initial commit

23 files changed, 2906 insertions, 0 deletions

diff --git a/files/es/web/svg/attribute/index.html b/files/es/web/svg/attribute/index.html
new file mode 100644
index 0000000000..2c8897445b
--- /dev/null
+++ b/files/es/web/svg/attribute/index.html
@@ -0,0 +1,467 @@
+---
+title: Referencia atributos SVG
+slug: Web/SVG/Attribute
+tags:
+  - Atributo SVG
+  - Dibujo
+  - Gráficos vectoriales
+  - SVG
+translation_of: Web/SVG/Attribute
+---
+<div>{{SVGRef}}</div>
+
+<p class="summary"><span class="seoSummary">Los elementos SVG pueden ser modificados usando atributos, especificando cómo debe ser manejado o renderizado el elemento</span> A continuación se muestra una lista de todos los atributos disponibles en SVG con sus respectivos enlaces a la documentación de referencia para ayudarte a comprender qué elementos los soportan y cómo funcionan</p>
+
+<h2 id="Atributos_SVG_de_la_A_a_la_Z">Atributos SVG de la A a la Z</h2>
+
+<div class="index">
+<h3 id="A">A</h3>
+
+<ul>
+ <li>{{ SVGAttr("accent-height") }}</li>
+ <li>{{ SVGAttr("accumulate") }}</li>
+ <li>{{ SVGAttr("additive") }}</li>
+ <li>{{ SVGAttr("alignment-baseline") }}</li>
+ <li>{{ SVGAttr("allowReorder") }}</li>
+ <li>{{ SVGAttr("alphabetic") }}</li>
+ <li>{{ SVGAttr("amplitude") }}</li>
+ <li>{{ SVGAttr("arabic-form") }}</li>
+ <li>{{ SVGAttr("ascent") }}</li>
+ <li>{{ SVGAttr("attributeName") }}</li>
+ <li>{{ SVGAttr("attributeType") }}</li>
+ <li>{{ SVGAttr("autoReverse") }}</li>
+ <li>{{ SVGAttr("azimuth") }}</li>
+</ul>
+
+<h3 id="B">B</h3>
+
+<ul>
+ <li>{{ SVGAttr("baseFrequency") }}</li>
+ <li>{{ SVGAttr("baseline-shift") }}</li>
+ <li>{{ SVGAttr("baseProfile") }}</li>
+ <li>{{ SVGAttr("bbox") }}</li>
+ <li>{{ SVGAttr("begin") }}</li>
+ <li>{{ SVGAttr("bias") }}</li>
+ <li>{{ SVGAttr("by") }}</li>
+</ul>
+
+<h3 id="C">C</h3>
+
+<ul>
+ <li>{{ SVGAttr("calcMode") }}</li>
+ <li>{{ SVGAttr("cap-height") }}</li>
+ <li>{{ SVGAttr("class") }}</li>
+ <li>{{ SVGAttr("clip") }}</li>
+ <li>{{ SVGAttr("clipPathUnits") }}</li>
+ <li>{{ SVGAttr("clip-path") }}</li>
+ <li>{{ SVGAttr("clip-rule") }}</li>
+ <li>{{ SVGAttr("color") }}</li>
+ <li>{{ SVGAttr("color-interpolation") }}</li>
+ <li>{{ SVGAttr("color-interpolation-filters") }}</li>
+ <li>{{ SVGAttr("color-profile") }}</li>
+ <li>{{ SVGAttr("color-rendering") }}</li>
+ <li>{{ SVGAttr("contentScriptType") }}</li>
+ <li>{{ SVGAttr("contentStyleType") }}</li>
+ <li>{{ SVGAttr("cursor") }}</li>
+ <li>{{ SVGAttr("cx") }}</li>
+ <li>{{ SVGAttr("cy") }}</li>
+</ul>
+
+<h3 id="D">D</h3>
+
+<ul>
+ <li>{{ SVGAttr("d") }}</li>
+ <li>{{ SVGAttr("decelerate") }}</li>
+ <li>{{ SVGAttr("descent") }}</li>
+ <li>{{ SVGAttr("diffuseConstant") }}</li>
+ <li>{{ SVGAttr("direction") }}</li>
+ <li>{{ SVGAttr("display") }}</li>
+ <li>{{ SVGAttr("divisor") }}</li>
+ <li>{{ SVGAttr("dominant-baseline") }}</li>
+ <li>{{ SVGAttr("dur") }}</li>
+ <li>{{ SVGAttr("dx") }}</li>
+ <li>{{ SVGAttr("dy") }}</li>
+</ul>
+
+<h3 id="E">E</h3>
+
+<ul>
+ <li>{{ SVGAttr("edgeMode") }}</li>
+ <li>{{ SVGAttr("elevation") }}</li>
+ <li>{{ SVGAttr("enable-background") }}</li>
+ <li>{{ SVGAttr("end") }}</li>
+ <li>{{ SVGAttr("exponent") }}</li>
+ <li>{{ SVGAttr("externalResourcesRequired") }}</li>
+</ul>
+
+<h3 id="F">F</h3>
+
+<ul>
+ <li>{{ SVGAttr("fill") }}</li>
+ <li>{{ SVGAttr("fill-opacity") }}</li>
+ <li>{{ SVGAttr("fill-rule") }}</li>
+ <li>{{ SVGAttr("filter") }}</li>
+ <li>{{ SVGAttr("filterRes") }}</li>
+ <li>{{ SVGAttr("filterUnits") }}</li>
+ <li>{{ SVGAttr("flood-color") }}</li>
+ <li>{{ SVGAttr("flood-opacity") }}</li>
+ <li>{{ SVGAttr("font-family") }}</li>
+ <li>{{ SVGAttr("font-size") }}</li>
+ <li>{{ SVGAttr("font-size-adjust") }}</li>
+ <li>{{ SVGAttr("font-stretch") }}</li>
+ <li>{{ SVGAttr("font-style") }}</li>
+ <li>{{ SVGAttr("font-variant") }}</li>
+ <li>{{ SVGAttr("font-weight") }}</li>
+ <li>{{ SVGAttr("format") }}</li>
+ <li>{{ SVGAttr("from") }}</li>
+ <li>{{ SVGAttr("fr") }}</li>
+ <li>{{ SVGAttr("fx") }}</li>
+ <li>{{ SVGAttr("fy") }}</li>
+</ul>
+
+<h3 id="G">G</h3>
+
+<ul>
+ <li>{{ SVGAttr("g1") }}</li>
+ <li>{{ SVGAttr("g2") }}</li>
+ <li>{{ SVGAttr("glyph-name") }}</li>
+ <li>{{ SVGAttr("glyph-orientation-horizontal") }}</li>
+ <li>{{ SVGAttr("glyph-orientation-vertical") }}</li>
+ <li>{{ SVGAttr("glyphRef") }}</li>
+ <li>{{ SVGAttr("gradientTransform") }}</li>
+ <li>{{ SVGAttr("gradientUnits") }}</li>
+</ul>
+
+<h3 id="H">H</h3>
+
+<ul>
+ <li>{{ SVGAttr("hanging") }}</li>
+ <li>{{ SVGAttr("height") }}</li>
+ <li>{{ SVGAttr("href") }}</li>
+ <li>{{ SVGAttr("horiz-adv-x") }}</li>
+ <li>{{ SVGAttr("horiz-origin-x") }}</li>
+</ul>
+
+<h3 id="I">I</h3>
+
+<ul>
+ <li>{{ SVGAttr("id") }}</li>
+ <li>{{ SVGAttr("ideographic") }}</li>
+ <li>{{ SVGAttr("image-rendering") }}</li>
+ <li>{{ SVGAttr("in") }}</li>
+ <li>{{ SVGAttr("in2") }}</li>
+ <li>{{ SVGAttr("intercept") }}</li>
+</ul>
+
+<h3 id="K">K</h3>
+
+<ul>
+ <li>{{ SVGAttr("k") }}</li>
+ <li>{{ SVGAttr("k1") }}</li>
+ <li>{{ SVGAttr("k2") }}</li>
+ <li>{{ SVGAttr("k3") }}</li>
+ <li>{{ SVGAttr("k4") }}</li>
+ <li>{{ SVGAttr("kernelMatrix") }}</li>
+ <li>{{ SVGAttr("kernelUnitLength") }}</li>
+ <li>{{ SVGAttr("kerning") }}</li>
+ <li>{{ SVGAttr("keyPoints") }}</li>
+ <li>{{ SVGAttr("keySplines") }}</li>
+ <li>{{ SVGAttr("keyTimes") }}</li>
+</ul>
+
+<h3 id="L">L</h3>
+
+<ul>
+ <li>{{ SVGAttr("lang") }}</li>
+ <li>{{ SVGAttr("lengthAdjust") }}</li>
+ <li>{{ SVGAttr("letter-spacing") }}</li>
+ <li>{{ SVGAttr("lighting-color") }}</li>
+ <li>{{ SVGAttr("limitingConeAngle") }}</li>
+ <li>{{ SVGAttr("local") }}</li>
+</ul>
+
+<h3 id="M">M</h3>
+
+<ul>
+ <li>{{ SVGAttr("marker-end") }}</li>
+ <li>{{ SVGAttr("marker-mid") }}</li>
+ <li>{{ SVGAttr("marker-start") }}</li>
+ <li>{{ SVGAttr("markerHeight") }}</li>
+ <li>{{ SVGAttr("markerUnits") }}</li>
+ <li>{{ SVGAttr("markerWidth") }}</li>
+ <li>{{ SVGAttr("mask") }}</li>
+ <li>{{ SVGAttr("maskContentUnits") }}</li>
+ <li>{{ SVGAttr("maskUnits") }}</li>
+ <li>{{ SVGAttr("mathematical") }}</li>
+ <li>{{ SVGAttr("max") }}</li>
+ <li>{{ SVGAttr("media") }}</li>
+ <li>{{ SVGAttr("method") }}</li>
+ <li>{{ SVGAttr("min") }}</li>
+ <li>{{ SVGAttr("mode") }}</li>
+</ul>
+
+<h3 id="N">N</h3>
+
+<ul>
+ <li>{{ SVGAttr("name") }}</li>
+ <li>{{ SVGAttr("numOctaves") }}</li>
+</ul>
+
+<h3 id="O">O</h3>
+
+<ul>
+ <li>{{ SVGAttr("offset") }}</li>
+ <li>{{ SVGAttr("onabort") }}</li>
+ <li>{{ SVGAttr("onactivate") }}</li>
+ <li>{{ SVGAttr("onbegin") }}</li>
+ <li>{{ SVGAttr("onclick") }}</li>
+ <li>{{ SVGAttr("onend") }}</li>
+ <li>{{ SVGAttr("onerror") }}</li>
+ <li>{{ SVGAttr("onfocusin") }}</li>
+ <li>{{ SVGAttr("onfocusout") }}</li>
+ <li>{{ SVGAttr("onload") }}</li>
+ <li>{{ SVGAttr("onmousedown") }}</li>
+ <li>{{ SVGAttr("onmousemove") }}</li>
+ <li>{{ SVGAttr("onmouseout") }}</li>
+ <li>{{ SVGAttr("onmouseover") }}</li>
+ <li>{{ SVGAttr("onmouseup") }}</li>
+ <li>{{ SVGAttr("onrepeat") }}</li>
+ <li>{{ SVGAttr("onresize") }}</li>
+ <li>{{ SVGAttr("onscroll") }}</li>
+ <li>{{ SVGAttr("onunload") }}</li>
+ <li>{{ SVGAttr("opacity") }}</li>
+ <li>{{ SVGAttr("operator") }}</li>
+ <li>{{ SVGAttr("order") }}</li>
+ <li>{{ SVGAttr("orient") }}</li>
+ <li>{{ SVGAttr("orientation") }}</li>
+ <li>{{ SVGAttr("origin") }}</li>
+ <li>{{ SVGAttr("overflow") }}</li>
+ <li>{{ SVGAttr("overline-position") }}</li>
+ <li>{{ SVGAttr("overline-thickness") }}</li>
+</ul>
+
+<h3 id="P">P</h3>
+
+<ul>
+ <li>{{ SVGAttr("panose-1") }}</li>
+ <li>{{ SVGAttr("paint-order") }}</li>
+ <li>{{ SVGAttr("pathLength") }}</li>
+ <li>{{ SVGAttr("patternContentUnits") }}</li>
+ <li>{{ SVGAttr("patternTransform") }}</li>
+ <li>{{ SVGAttr("patternUnits") }}</li>
+ <li>{{ SVGAttr("pointer-events") }}</li>
+ <li>{{ SVGAttr("points") }}</li>
+ <li>{{ SVGAttr("pointsAtX") }}</li>
+ <li>{{ SVGAttr("pointsAtY") }}</li>
+ <li>{{ SVGAttr("pointsAtZ") }}</li>
+ <li>{{ SVGAttr("preserveAlpha") }}</li>
+ <li>{{ SVGAttr("preserveAspectRatio") }}</li>
+ <li>{{ SVGAttr("primitiveUnits") }}</li>
+</ul>
+
+<h3 id="R">R</h3>
+
+<ul>
+ <li>{{ SVGAttr("r") }}</li>
+ <li>{{ SVGAttr("radius") }}</li>
+ <li>{{ SVGAttr("refX") }}</li>
+ <li>{{ SVGAttr("refY") }}</li>
+ <li>{{ SVGAttr("rendering-intent") }}</li>
+ <li>{{ SVGAttr("repeatCount") }}</li>
+ <li>{{ SVGAttr("repeatDur") }}</li>
+ <li>{{ SVGAttr("requiredExtensions") }}</li>
+ <li>{{ SVGAttr("requiredFeatures") }}</li>
+ <li>{{ SVGAttr("restart") }}</li>
+ <li>{{ SVGAttr("result") }}</li>
+ <li>{{ SVGAttr("rotate") }}</li>
+ <li>{{ SVGAttr("rx") }}</li>
+ <li>{{ SVGAttr("ry") }}</li>
+</ul>
+
+<h3 id="S">S</h3>
+
+<ul>
+ <li>{{ SVGAttr("scale") }}</li>
+ <li>{{ SVGAttr("seed") }}</li>
+ <li>{{ SVGAttr("shape-rendering") }}</li>
+ <li>{{ SVGAttr("slope") }}</li>
+ <li>{{ SVGAttr("spacing") }}</li>
+ <li>{{ SVGAttr("specularConstant") }}</li>
+ <li>{{ SVGAttr("specularExponent") }}</li>
+ <li>{{ SVGAttr("speed") }}</li>
+ <li>{{ SVGAttr("spreadMethod") }}</li>
+ <li>{{ SVGAttr("startOffset") }}</li>
+ <li>{{ SVGAttr("stdDeviation") }}</li>
+ <li>{{ SVGAttr("stemh") }}</li>
+ <li>{{ SVGAttr("stemv") }}</li>
+ <li>{{ SVGAttr("stitchTiles") }}</li>
+ <li>{{ SVGAttr("stop-color") }}</li>
+ <li>{{ SVGAttr("stop-opacity") }}</li>
+ <li>{{ SVGAttr("strikethrough-position") }}</li>
+ <li>{{ SVGAttr("strikethrough-thickness") }}</li>
+ <li>{{ SVGAttr("string") }}</li>
+ <li>{{ SVGAttr("stroke") }}</li>
+ <li>{{ SVGAttr("stroke-dasharray") }}</li>
+ <li>{{ SVGAttr("stroke-dashoffset") }}</li>
+ <li>{{ SVGAttr("stroke-linecap") }}</li>
+ <li>{{ SVGAttr("stroke-linejoin") }}</li>
+ <li>{{ SVGAttr("stroke-miterlimit") }}</li>
+ <li>{{ SVGAttr("stroke-opacity") }}</li>
+ <li>{{ SVGAttr("stroke-width") }}</li>
+ <li>{{ SVGAttr("style") }}</li>
+ <li>{{ SVGAttr("surfaceScale") }}</li>
+ <li>{{ SVGAttr("systemLanguage") }}</li>
+</ul>
+
+<h3 id="T">T</h3>
+
+<ul>
+ <li>{{ SVGAttr("tabindex") }}</li>
+ <li>{{ SVGAttr("tableValues") }}</li>
+ <li>{{ SVGAttr("target") }}</li>
+ <li>{{ SVGAttr("targetX") }}</li>
+ <li>{{ SVGAttr("targetY") }}</li>
+ <li>{{ SVGAttr("text-anchor") }}</li>
+ <li>{{ SVGAttr("text-decoration") }}</li>
+ <li>{{ SVGAttr("text-rendering") }}</li>
+ <li>{{ SVGAttr("textLength") }}</li>
+ <li>{{ SVGAttr("to") }}</li>
+ <li>{{ SVGAttr("transform") }}</li>
+ <li>{{ SVGAttr("type") }}</li>
+</ul>
+
+<h3 id="U">U</h3>
+
+<ul>
+ <li>{{ SVGAttr("u1") }}</li>
+ <li>{{ SVGAttr("u2") }}</li>
+ <li>{{ SVGAttr("underline-position") }}</li>
+ <li>{{ SVGAttr("underline-thickness") }}</li>
+ <li>{{ SVGAttr("unicode") }}</li>
+ <li>{{ SVGAttr("unicode-bidi") }}</li>
+ <li>{{ SVGAttr("unicode-range") }}</li>
+ <li>{{ SVGAttr("units-per-em") }}</li>
+</ul>
+
+<h3 id="V">V</h3>
+
+<ul>
+ <li>{{ SVGAttr("v-alphabetic") }}</li>
+ <li>{{ SVGAttr("v-hanging") }}</li>
+ <li>{{ SVGAttr("v-ideographic") }}</li>
+ <li>{{ SVGAttr("v-mathematical") }}</li>
+ <li>{{ SVGAttr("values") }}</li>
+ <li>{{ SVGAttr("version") }}</li>
+ <li>{{ SVGAttr("vert-adv-y") }}</li>
+ <li>{{ SVGAttr("vert-origin-x") }}</li>
+ <li>{{ SVGAttr("vert-origin-y") }}</li>
+ <li>{{ SVGAttr("viewBox") }}</li>
+ <li>{{ SVGAttr("viewTarget") }}</li>
+ <li>{{ SVGAttr("visibility") }}</li>
+</ul>
+
+<h3 id="W">W</h3>
+
+<ul>
+ <li>{{ SVGAttr("width") }}</li>
+ <li>{{ SVGAttr("widths") }}</li>
+ <li>{{ SVGAttr("word-spacing") }}</li>
+ <li>{{ SVGAttr("writing-mode") }}</li>
+</ul>
+
+<h3 id="X">X</h3>
+
+<ul>
+ <li>{{ SVGAttr("x") }}</li>
+ <li>{{ SVGAttr("x-height") }}</li>
+ <li>{{ SVGAttr("x1") }}</li>
+ <li>{{ SVGAttr("x2") }}</li>
+ <li>{{ SVGAttr("xChannelSelector") }}</li>
+ <li>{{ SVGAttr("xlink:actuate") }}</li>
+ <li>{{ SVGAttr("xlink:arcrole") }}</li>
+ <li>{{ SVGAttr("xlink:href") }}</li>
+ <li>{{ SVGAttr("xlink:role") }}</li>
+ <li>{{ SVGAttr("xlink:show") }}</li>
+ <li>{{ SVGAttr("xlink:title") }}</li>
+ <li>{{ SVGAttr("xlink:type") }}</li>
+ <li>{{ SVGAttr("xml:base") }}</li>
+ <li>{{ SVGAttr("xml:lang") }}</li>
+ <li>{{ SVGAttr("xml:space") }}</li>
+</ul>
+
+<h3 id="Y">Y</h3>
+
+<ul>
+ <li>{{ SVGAttr("y") }}</li>
+ <li>{{ SVGAttr("y1") }}</li>
+ <li>{{ SVGAttr("y2") }}</li>
+ <li>{{ SVGAttr("yChannelSelector") }}</li>
+</ul>
+
+<h3 id="Z">Z</h3>
+
+<ul>
+ <li>{{ SVGAttr("z") }}</li>
+ <li>{{ SVGAttr("zoomAndPan") }}</li>
+</ul>
+</div>
+
+<h2 id="Categorías">Categorías</h2>
+
+<h3 id="Atributos_de_eventos_de_animación">Atributos de eventos de animación</h3>
+
+<p>{{ SVGAttr("onbegin") }}, {{ SVGAttr("onend") }}, {{ SVGAttr("onload") }}, {{ SVGAttr("onrepeat") }}</p>
+
+<h3 id="Atributos_de_objetivo_de_animación">Atributos de objetivo de animación</h3>
+
+<p>{{ SVGAttr("attributeType") }}, {{ SVGAttr("attributeName") }}</p>
+
+<h3 id="Atributos_temporales_de_animación">Atributos temporales de animación</h3>
+
+<p>{{ SVGAttr("begin") }}, {{ SVGAttr("dur") }}, {{ SVGAttr("end") }}, {{ SVGAttr("min") }}, {{ SVGAttr("max") }}, {{ SVGAttr("restart") }}, {{ SVGAttr("repeatCount") }}, {{ SVGAttr("repeatDur") }}, {{ SVGAttr("fill") }}</p>
+
+<h3 id="Atributos_de_valores_de_animación">Atributos de valores de animación</h3>
+
+<p>{{ SVGAttr("calcMode") }}, {{ SVGAttr("values") }}, {{ SVGAttr("keyTimes") }}, {{ SVGAttr("keySplines") }}, {{ SVGAttr("from") }}, {{ SVGAttr("to") }}, {{ SVGAttr("by") }}, {{ SVGAttr("autoReverse") }}, {{ SVGAttr("accelerate") }}, {{ SVGAttr("decelerate") }}</p>
+
+<h3 id="Atributos_de_adición_de_animación">Atributos de adición de animación</h3>
+
+<p>{{ SVGAttr("additive") }}, {{ SVGAttr("accumulate") }}</p>
+
+<h3 id="Atributos_de_procesado_condicional">Atributos de procesado condicional</h3>
+
+<p>{{ SVGAttr("requiredExtensions") }}, {{ SVGAttr("requiredFeatures") }}, {{ SVGAttr("systemLanguage") }}.</p>
+
+<h3 id="Atributos_principales">Atributos principales</h3>
+
+<p>{{ SVGAttr("id") }}, {{ SVGAttr("xml:base") }}, {{ SVGAttr("xml:lang") }}, {{ SVGAttr("xml:space") }}, {{ SVGAttr("tabindex") }}</p>
+
+<h3 id="Atributos_de_eventos_del_documento">Atributos de eventos del documento</h3>
+
+<p>{{ SVGAttr("onabort") }}, {{ SVGAttr("onerror") }}, {{ SVGAttr("onresize") }}, {{ SVGAttr("onscroll") }}, {{ SVGAttr("onunload") }}</p>
+
+<h3 id="Atributos_de_filtro_de_primitivas">Atributos de filtro de primitivas</h3>
+
+<p>{{ SVGAttr("height") }}, {{ SVGAttr("result") }}, {{ SVGAttr("width") }}, {{ SVGAttr("x") }}, {{ SVGAttr("y") }}</p>
+
+<h3 id="Atributos_de_eventos_gráficos">Atributos de eventos gráficos</h3>
+
+<p>{{ SVGAttr("onactivate") }}, {{ SVGAttr("onclick") }}, {{ SVGAttr("onfocusin") }}, {{ SVGAttr("onfocusout") }}, {{ SVGAttr("onload") }}, {{ SVGAttr("onmousedown") }}, {{ SVGAttr("onmousemove") }}, {{ SVGAttr("onmouseout") }}, {{ SVGAttr("onmouseover") }}, {{ SVGAttr("onmouseup") }}</p>
+
+<h3 id="Atributos_presentacionales">Atributos presentacionales</h3>
+
+<div class="note">Nota: todos los atributos presentacionales de SVG pueden ser usados como propiedades CSS.</div>
+
+<p>{{ SVGAttr("alignment-baseline") }}, {{ SVGAttr("baseline-shift") }}, {{ SVGAttr("clip") }}, {{ SVGAttr("clip-path") }}, {{ SVGAttr("clip-rule") }}, {{ SVGAttr("color") }}, {{ SVGAttr("color-interpolation") }}, {{ SVGAttr("color-interpolation-filters") }}, {{ SVGAttr("color-profile") }}, {{ SVGAttr("color-rendering") }}, {{ SVGAttr("cursor") }}, {{ SVGAttr("direction") }}, {{ SVGAttr("display") }}, {{ SVGAttr("dominant-baseline") }}, {{ SVGAttr("enable-background") }}, {{ SVGAttr("fill") }}, {{ SVGAttr("fill-opacity") }}, {{ SVGAttr("fill-rule") }}, {{ SVGAttr("filter") }}, {{ SVGAttr("flood-color") }}, {{ SVGAttr("flood-opacity") }}, {{ SVGAttr("font-family") }}, {{ SVGAttr("font-size") }}, {{ SVGAttr("font-size-adjust") }}, {{ SVGAttr("font-stretch") }}, {{ SVGAttr("font-style") }}, {{ SVGAttr("font-variant") }}, {{ SVGAttr("font-weight") }}, {{ SVGAttr("glyph-orientation-horizontal") }}, {{ SVGAttr("glyph-orientation-vertical") }}, {{ SVGAttr("image-rendering") }}, {{ SVGAttr("kerning") }}, {{ SVGAttr("letter-spacing") }}, {{ SVGAttr("lighting-color") }}, {{ SVGAttr("marker-end") }}, {{ SVGAttr("marker-mid") }}, {{ SVGAttr("marker-start") }}, {{ SVGAttr("mask") }}, {{ SVGAttr("opacity") }}, {{ SVGAttr("overflow") }}, {{ SVGAttr("pointer-events") }}, {{ SVGAttr("shape-rendering") }}, {{ SVGAttr("stop-color") }}, {{ SVGAttr("stop-opacity") }}, {{ SVGAttr("stroke") }}, {{ SVGAttr("stroke-dasharray") }}, {{ SVGAttr("stroke-dashoffset") }}, {{ SVGAttr("stroke-linecap") }}, {{ SVGAttr("stroke-linejoin") }}, {{ SVGAttr("stroke-miterlimit") }}, {{ SVGAttr("stroke-opacity") }}, {{ SVGAttr("stroke-width") }}, {{ SVGAttr("text-anchor") }}, {{ SVGAttr("text-decoration") }}, {{ SVGAttr("text-rendering") }}, {{ SVGAttr("unicode-bidi") }}, {{ SVGAttr("visibility") }}, {{ SVGAttr("word-spacing") }}, {{ SVGAttr("writing-mode") }}</p>
+
+<h3 id="Atributos_de_estilo">Atributos de estilo</h3>
+
+<p>{{ SVGAttr("class") }}, {{ SVGAttr("style") }}</p>
+
+<h3 id="Atributos_de_transferencia_de_funcionalidades">Atributos de transferencia de funcionalidades</h3>
+
+<p>{{ SVGAttr("type") }}, {{ SVGAttr("tableValues") }}, {{ SVGAttr("slope") }}, {{ SVGAttr("intercept") }}, {{ SVGAttr("amplitude") }}, {{ SVGAttr("exponent") }}, {{ SVGAttr("offset") }}</p>
+
+<h3 id="Atributos_XLink">Atributos XLink</h3>
+
+<p>{{ SVGAttr("xlink:href") }}, {{ SVGAttr("xlink:type") }}, {{ SVGAttr("xlink:role") }}, {{ SVGAttr("xlink:arcrole") }}, {{ SVGAttr("xlink:title") }}, {{ SVGAttr("xlink:show") }}, {{ SVGAttr("xlink:actuate") }}</p>
diff --git a/files/es/web/svg/attribute/stop-color/index.html b/files/es/web/svg/attribute/stop-color/index.html
new file mode 100644
index 0000000000..54bfb8000b
--- /dev/null
+++ b/files/es/web/svg/attribute/stop-color/index.html
@@ -0,0 +1,59 @@
+---
+title: stop-color
+slug: Web/SVG/Attribute/stop-color
+tags:
+  - Atributos SVG
+translation_of: Web/SVG/Attribute/stop-color
+---
+<p>« <a href="/en/SVG/Attribute" title="en/SVG/Attribute">SVG Attribute reference hom</a>e</p>
+
+<p>El atributo <code>stop-color</code> indica que color usar en el stop del gradiente. La keyword <code>currentColor</code> y ICC  pueden ser especificadas de la misma manera con la especificación <a href="/en/SVG/Content_type#Paint" title="en/SVG/Content_type#Paint">&lt;paint&gt;</a> para los atributos {{ SVGAttr("fill") }} y {{ SVGAttr("stroke") }}.</p>
+
+<h2 id="Usage_context">Usage context</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="row">Categorías</th>
+   <td>Presentation attribute</td>
+  </tr>
+  <tr>
+   <th scope="row">Valor</th>
+   <td>currentColor | <a href="/en/SVG/Content_type#Color" title="en/SVG/Content_type#Color">&lt;color&gt;</a> | <a href="/en/SVG/Content_type#ICCColor" title="en/SVG/Content_type#ICCColor">&lt;icccolor&gt;</a> | inherit</td>
+  </tr>
+  <tr>
+   <th scope="row">Valor inicial</th>
+   <td>negro</td>
+  </tr>
+  <tr>
+   <th scope="row">Animatable</th>
+   <td>Sí</td>
+  </tr>
+  <tr>
+   <th scope="row">Documento normativo</th>
+   <td><a class="external" href="http://www.w3.org/TR/SVG11/pservers.html#StopColorProperty" title="http://www.w3.org/TR/SVG11/pservers.html#StopColorProperty">SVG 1.1 (2.ª edición)</a></td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h2 id="Elementos">Elementos</h2>
+
+<p>El siguiente elemento puede usar el atributo <code>stop-color</code></p>
+
+<ul>
+ <li>{{ SVGElement("stop") }}</li>
+</ul>
+
+<h2 id="Browser_Compatibility" name="Browser_Compatibility">Compatibilidad entre navegadores</h2>
+
+
+
+<p>{{Compat("svg.attributes.presentation.stop-color")}}</p>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{ SVGAttr("stop-opacity") }}</li>
+</ul>
diff --git a/files/es/web/svg/attribute/transform/index.html b/files/es/web/svg/attribute/transform/index.html
new file mode 100644
index 0000000000..0d225d06b8
--- /dev/null
+++ b/files/es/web/svg/attribute/transform/index.html
@@ -0,0 +1,144 @@
+---
+title: transform
+slug: Web/SVG/Attribute/transform
+translation_of: Web/SVG/Attribute/transform
+---
+<p>« Indice de atributos SVG</p>
+
+<p>El atributo <code>transform</code> exhibe una lista de definiciones de transformación que se aplican a un elemento y a sus hijos. Los elementos en la lista de tranformación están separados por espacios en blanco y/o comas y se aplican de derecha a izquierda.</p>
+
+<h2 id="Contexto_de_uso">Contexto de uso</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="row">Categorias</th>
+   <td>None</td>
+  </tr>
+  <tr>
+   <th scope="row">Valor</th>
+   <td><strong title="this is the default value">&lt;transform-list&gt;</strong></td>
+  </tr>
+  <tr>
+   <th scope="row">Animable</th>
+   <td>Yes</td>
+  </tr>
+  <tr>
+   <th scope="row">Documento normativo</th>
+   <td><a class="external" href="http://www.w3.org/TR/SVG/coords.html#TransformAttribute" title="http://www.w3.org/TR/SVG/coords.html#TransformAttribute">SVG 1.1 (2nd Edition)</a></td>
+  </tr>
+ </tbody>
+</table>
+
+<h3 id="Tipos_de_definiciones_de_transformación">Tipos de definiciones de transformación</h3>
+
+<dl>
+ <dt>matrix(&lt;a&gt; &lt;b&gt; &lt;c&gt; &lt;d&gt; &lt;e&gt; &lt;f&gt;)</dt>
+ <dd>Esta definición de tranformación, especifica una transformación en forma de una matriz de transformación de seis valores. <code>matrix(a,b,c,d,e,f)</code> es equivalente a aplicar la siguiente matriz de transformación:<math display="block"><semantics><mrow><mo>(</mo><mtable rowspacing="0.5ex"><mtr><mtd><mi>a</mi></mtd><mtd><mi>c</mi></mtd><mtd><mi>e</mi></mtd></mtr><mtr><mtd><mi>b</mi></mtd><mtd><mi>d</mi></mtd><mtd><mi>f</mi></mtd></mtr><mtr><mtd><mn>0</mn></mtd><mtd><mn>0</mn></mtd><mtd><mn>1</mn></mtd></mtr></mtable><mo>)</mo></mrow><annotation encoding="TeX">\begin{pmatrix} a &amp; c &amp; e \\ b &amp; d &amp; f \\ 0 &amp; 0 &amp; 1 \end{pmatrix}</annotation></semantics></math> que mapea las coordinadas desde un nuevo sistema de coordenadas a un sistema existente mediante la siguiente matriz de igualdades:<math display="block"><semantics><mrow><mrow><mo>(</mo><mtable rowspacing="0.5ex"><mtr><mtd><msub><mi>x</mi><mstyle mathvariant="normal"><mrow><mi>p</mi><mi>r</mi><mi>e</mi><mi>v</mi><mi>C</mi><mi>o</mi><mi>o</mi><mi>r</mi><mi>d</mi><mi>S</mi><mi>y</mi><mi>s</mi></mrow></mstyle></msub></mtd></mtr><mtr><mtd><msub><mi>y</mi><mstyle mathvariant="normal"><mrow><mi>p</mi><mi>r</mi><mi>e</mi><mi>v</mi><mi>C</mi><mi>o</mi><mi>o</mi><mi>r</mi><mi>d</mi><mi>S</mi><mi>y</mi><mi>s</mi></mrow></mstyle></msub></mtd></mtr><mtr><mtd><mn>1</mn></mtd></mtr></mtable><mo>)</mo></mrow><mo>=</mo><mrow><mo>(</mo><mtable rowspacing="0.5ex"><mtr><mtd><mi>a</mi></mtd><mtd><mi>c</mi></mtd><mtd><mi>e</mi></mtd></mtr><mtr><mtd><mi>b</mi></mtd><mtd><mi>d</mi></mtd><mtd><mi>f</mi></mtd></mtr><mtr><mtd><mn>0</mn></mtd><mtd><mn>0</mn></mtd><mtd><mn>1</mn></mtd></mtr></mtable><mo>)</mo></mrow><mrow><mo>(</mo><mtable rowspacing="0.5ex"><mtr><mtd><msub><mi>x</mi><mstyle mathvariant="normal"><mrow><mi>n</mi><mi>e</mi><mi>w</mi><mi>C</mi><mi>o</mi><mi>o</mi><mi>r</mi><mi>d</mi><mi>S</mi><mi>y</mi><mi>s</mi></mrow></mstyle></msub></mtd></mtr><mtr><mtd><msub><mi>y</mi><mstyle mathvariant="normal"><mrow><mi>n</mi><mi>e</mi><mi>w</mi><mi>C</mi><mi>o</mi><mi>o</mi><mi>r</mi><mi>d</mi><mi>S</mi><mi>y</mi><mi>s</mi></mrow></mstyle></msub></mtd></mtr><mtr><mtd><mn>1</mn></mtd></mtr></mtable><mo>)</mo></mrow><mo>=</mo><mrow><mo>(</mo><mtable rowspacing="0.5ex"><mtr><mtd><mi>a</mi><msub><mi>x</mi><mstyle mathvariant="normal"><mrow><mi>n</mi><mi>e</mi><mi>w</mi><mi>C</mi><mi>o</mi><mi>o</mi><mi>r</mi><mi>d</mi><mi>S</mi><mi>y</mi><mi>s</mi></mrow></mstyle></msub><mo>+</mo><mi>c</mi><msub><mi>y</mi><mstyle mathvariant="normal"><mrow><mi>n</mi><mi>e</mi><mi>w</mi><mi>C</mi><mi>o</mi><mi>o</mi><mi>r</mi><mi>d</mi><mi>S</mi><mi>y</mi><mi>s</mi></mrow></mstyle></msub><mo>+</mo><mi>e</mi></mtd></mtr><mtr><mtd><mi>b</mi><msub><mi>x</mi><mstyle mathvariant="normal"><mrow><mi>n</mi><mi>e</mi><mi>w</mi><mi>C</mi><mi>o</mi><mi>o</mi><mi>r</mi><mi>d</mi><mi>S</mi><mi>y</mi><mi>s</mi></mrow></mstyle></msub><mo>+</mo><mi>d</mi><msub><mi>y</mi><mstyle mathvariant="normal"><mrow><mi>n</mi><mi>e</mi><mi>w</mi><mi>C</mi><mi>o</mi><mi>o</mi><mi>r</mi><mi>d</mi><mi>S</mi><mi>y</mi><mi>s</mi></mrow></mstyle></msub><mo>+</mo><mi>f</mi></mtd></mtr><mtr><mtd><mn>1</mn></mtd></mtr></mtable><mo>)</mo></mrow></mrow><annotation encoding="TeX"> \begin{pmatrix} x_{\mathrm{prevCoordSys}} \\ y_{\mathrm{prevCoordSys}} \\ 1 \end{pmatrix} = \begin{pmatrix} a &amp; c &amp; e \\ b &amp; d &amp; f \\ 0 &amp; 0 &amp; 1 \end{pmatrix} \begin{pmatrix} x_{\mathrm{newCoordSys}} \\ y_{\mathrm{newCoordSys}} \\ 1 \end{pmatrix} = \begin{pmatrix} a x_{\mathrm{newCoordSys}} + c y_{\mathrm{newCoordSys}} + e \\ b x_{\mathrm{newCoordSys}} + d y_{\mathrm{newCoordSys}} + f \\ 1 \end{pmatrix} </annotation></semantics></math></dd>
+ <dt>translate(&lt;x&gt; [&lt;y&gt;])</dt>
+ <dd>Esta definición de transformación, especifica la transición en <code>x</code> e <code>y</code>. Es equivalente a: <code>matrix(1 0 0 1 x y)</code>. Si no se provee ningun valor de  <code>y</code> , éste se asume como cero.</dd>
+ <dt>scale(&lt;x&gt; [&lt;y&gt;])</dt>
+ <dd>Esta definición de transformación, especifica la escala de operación en <code>x</code> e <code>y</code>. Es equivalente a: <code>matrix(x 0 0 y 0 0)</code>. Si no se provee ningun valor de  <code>y</code> , éste se asume igual a <code>x.</code></dd>
+ <dt>rotate(&lt;a&gt; [&lt;x&gt; &lt;y&gt;])</dt>
+ <dd>Esta definición de transformación, especifica la rotación en <code>a</code> grados a partir del punto dado. Si los parámetros opcionales  <code>x</code> e <code>y</code> no se proveen, la rotación se produce en el origen del actual sistema de coordenadas del usuario. Esta operación se corresponde con la matriz:<math display="block"><semantics><mrow><mo>(</mo><mtable rowspacing="0.5ex"><mtr><mtd><mo lspace="0em" rspace="0em">cos</mo><mi>a</mi></mtd><mtd><mo>-</mo><mo lspace="0em" rspace="0em">sin</mo><mi>a</mi></mtd><mtd><mn>0</mn></mtd></mtr><mtr><mtd><mo lspace="0em" rspace="0em">sin</mo><mi>a</mi></mtd><mtd><mo lspace="0em" rspace="0em">cos</mo><mi>a</mi></mtd><mtd><mn>0</mn></mtd></mtr><mtr><mtd><mn>0</mn></mtd><mtd><mn>0</mn></mtd><mtd><mn>1</mn></mtd></mtr></mtable><mo>)</mo></mrow><annotation encoding="TeX">\begin{pmatrix} \cos a &amp; -\sin a &amp; 0 \\ \sin a &amp; \cos a &amp; 0 \\ 0 &amp; 0 &amp; 1 \end{pmatrix}</annotation></semantics></math> Si se proveen los parámetros opcionales <code>x</code> e <code>y</code> , la rotación se produce en el punto provisto <code>(x, y)</code>. La operación representa el equivalente a la siguiente lista de transformaciones: <code>translate(&lt;x&gt;, &lt;y&gt;) rotate(&lt;a&gt;) translate(-&lt;x&gt;, -&lt;y&gt;)</code>.</dd>
+ <dt>skewX(&lt;a&gt;)</dt>
+ <dd>This transform definition specifies a skew transformation along the x axis by <code>a</code> degrees. The operation corresponds to the matrix <math display="block"><semantics><mrow><mo>(</mo><mtable rowspacing="0.5ex"><mtr><mtd><mn>1</mn></mtd><mtd><mo lspace="0em" rspace="0em">tan</mo><mo stretchy="false">(</mo><mi>a</mi><mo stretchy="false">)</mo></mtd><mtd><mn>0</mn></mtd></mtr><mtr><mtd><mn>0</mn></mtd><mtd><mn>1</mn></mtd><mtd><mn>0</mn></mtd></mtr><mtr><mtd><mn>0</mn></mtd><mtd><mn>0</mn></mtd><mtd><mn>1</mn></mtd></mtr></mtable><mo>)</mo></mrow><annotation encoding="TeX">\begin{pmatrix} 1 &amp; \tan(a) &amp; 0 \\ 0 &amp; 1 &amp; 0 \\ 0 &amp; 0 &amp; 1 \end{pmatrix}</annotation></semantics></math></dd>
+ <dt> </dt>
+ <dt>skewY(&lt;a&gt;)</dt>
+ <dd>This transform definition specifies a skew transformation along the y axis by <code>a</code> degrees. The operation corresponds to the matrix <math display="block"><semantics><mrow><mo>(</mo><mtable rowspacing="0.5ex"><mtr><mtd><mn>1</mn></mtd><mtd><mn>0</mn></mtd><mtd><mn>0</mn></mtd></mtr><mtr><mtd><mo lspace="0em" rspace="0em">tan</mo><mo stretchy="false">(</mo><mi>a</mi><mo stretchy="false">)</mo></mtd><mtd><mn>1</mn></mtd><mtd><mn>0</mn></mtd></mtr><mtr><mtd><mn>0</mn></mtd><mtd><mn>0</mn></mtd><mtd><mn>1</mn></mtd></mtr></mtable><mo>)</mo></mrow><annotation encoding="TeX"> \begin{pmatrix} 1 &amp; 0 &amp; 0 \\ \tan(a) &amp; 1 &amp; 0 \\ 0 &amp; 0 &amp; 1 \end{pmatrix} </annotation></semantics></math></dd>
+</dl>
+
+<h2 id="Example">Example</h2>
+
+<h3 id="Rotating_and_Translating_an_SVG_element">Rotating and Translating an SVG element</h3>
+
+<p>In this simple example we rotate and translate (move) an SVG element using transform SVG attribute. The original element before transform is shown with a low opacity.</p>
+
+<p>CSS (optional):</p>
+
+<pre class="brush: css">text {
+  font: 1em sans-serif;
+}</pre>
+
+<p>SVG:</p>
+
+<pre class="brush: html">&lt;svg width="180" height="200"
+  xmlns="http://www.w3.org/2000/svg"
+  xmlns:xlink="http://www.w3.org/1999/xlink"&gt;
+
+  &lt;!-- This is the element before translation and rotation are applied --&gt;
+  &lt;rect x="50" y="50" height="100" width="100" style="stroke:#000; fill: #0086B2"<strong> </strong>fill-opacity=0.2 stroke-opacity=0.2&gt;&lt;/rect&gt;
+
+  &lt;!-- Now we add a text element and apply rotate and translate to both --&gt;
+  &lt;rect x="50" y="50" height="100" width="100" style="stroke:#000; fill: #0086B2"<strong> transform="translate(30) rotate(45 50 50)"</strong>&gt;&lt;/rect&gt;
+  &lt;text x="60" y="105" <strong>transform="translate(30) rotate(45 50 50)"</strong>&gt; Hello Moz! &lt;/text&gt;
+
+&lt;/svg&gt;
+</pre>
+
+<p>{{EmbedLiveSample("Rotating_and_Translating_an_SVG_element",200,200,"/files/5217/rotate_and_translate_svg.png.png")}}</p>
+
+<h3 id="General_Transformation" name="General_Transformation">General Transformation</h3>
+
+<p>Here is a basic example to understand a general transformation. We consider the transform <code>matrix(1,2,3,4,5,6)</code> and draw a thick blue line from (10,20) to (30,40) in the new coordinate system. A thin white line with the same end points is drawn above it using the original coordinate system.</p>
+
+<pre class="brush: html">&lt;svg width="160" height="230" xmlns="http://www.w3.org/2000/svg"&gt;
+
+  &lt;g transform="matrix(1,2,3,4,5,6)"&gt;
+    &lt;!-- New coordinate system (thick blue line)
+         x1 = 10 | x2 = 30
+         y1 = 20 | y2 = 40
+      --&gt;
+    &lt;line x1="10" y1="20" x2="30" y2="40" style="stroke-width: 10px; stroke: blue;"/&gt;
+  &lt;/g&gt;
+
+  &lt;!-- Previous coordinate system (thin white line)
+       x1 = 1 * 10 + 3 * 20 + 5 = 75  | x2 = 1 * 30 + 3 * 40 + 5 = 155
+       y1 = 2 * 10 + 4 * 20 + 6 = 106 | y2 = 2 * 30 + 4 * 40 + 6 = 226
+    --&gt;
+  &lt;line x1="75" y1="106" x2="155" y2="226" style="stroke-width: 1px; stroke: white;"/&gt;
+
+&lt;/svg&gt;
+</pre>
+
+<p>{{ EmbedLiveSample('General_Transformation','200px','250px') }}</p>
+
+<h3 id="Illustration_of_Text_at_the_Same_Position_Rotated_Around_Different_Points">Illustration of Text at the Same Position Rotated Around Different Points</h3>
+
+<p>All text examples in the SVG below have the same positioning on the page (<code>x="200" y="0"</code>), and all are rotated at 45°. The only difference is the point that anchors the rotation.</p>
+
+<pre class="brush: html">&lt;svg viewBox="-20 -20 820 420" xmlns="http://www.w3.org/2000/svg" width="800" height="400"&gt;
+
+  &lt;text x="200" y="0"&gt;...unrotated text; same starting position as examples below (in all cases: x="200" y="0")&lt;/text&gt;
+
+  &lt;circle cx="200" cy="0" r="2" style="stroke: green; stroke-width: 1; fill: green;" /&gt;
+  &lt;text x="200" y="0" transform="rotate(45 200,0)" style="fill: green;" &gt;...(1) rotate(45 200,0) (rotated 45° around a point at 200,0)&lt;/text&gt;
+
+  &lt;circle cx="100" cy="0" r="2" style="stroke: blue; stroke-width: 1; fill: blue;" /&gt;
+  &lt;path d="M 200,0 A 100,100 0 0,1 0,0" style="stroke: blue; stroke-width: 1; fill: transparent;" /&gt;
+  &lt;text x="200" y="0" transform="rotate(45 100,0)" style="fill: blue;"&gt;...(2) rotate(45 100,0) (rotated 45° around a point at 100,0)&lt;/text&gt;
+
+  &lt;circle cx="0" cy="0" r="2" style="stroke: red; stroke-width: 1; fill: red;" /&gt;
+  &lt;path d="M 200,0 A 200,200 0 0,1 0,200" style="stroke: red; stroke-width: 1; fill: transparent;" /&gt;
+  &lt;text x="200" y="0" transform="rotate(45 0,0)" style="fill: red;" &gt;...(3) rotate(45 0,0) (rotated 45° around a point at 0,0)&lt;/text&gt;
+
+&lt;/svg&gt;
+</pre>
+
+<p>{{EmbedLiveSample("Illustration_of_Text_at_the_Same_Position_Rotated_Around_Different_Points", 800, 400)}}</p>
+
+<h2 id="Elements">Elements</h2>
+
+<p>The following elements can use the <code>transform</code> attribute:</p>
+
+<ul>
+ <li>{{ SVGElement("a") }}</li>
+ <li>{{ SVGElement("clipPath") }}</li>
+ <li>{{ SVGElement("defs") }}</li>
+ <li>{{ SVGElement("foreignObject") }}</li>
+ <li>{{ SVGElement("g") }}</li>
+ <li>{{ SVGElement("switch") }}</li>
+ <li>{{ SVGElement("use") }}</li>
+ <li>{{ SVGElement("svg") }} (SVG 2 onwards)</li>
+ <li><a href="/en/SVG/Element#Graphics" title="en/SVG/Element#Graphics">Graphics elements</a> »</li>
+</ul>
diff --git a/files/es/web/svg/element/a/index.html b/files/es/web/svg/element/a/index.html
new file mode 100644
index 0000000000..2377b690f7
--- /dev/null
+++ b/files/es/web/svg/element/a/index.html
@@ -0,0 +1,145 @@
+---
+title: <a>
+slug: Web/SVG/Element/a
+translation_of: Web/SVG/Element/a
+---
+<div>{{SVGRef}}</div>
+
+<p>El elemento SVG &lt;a&gt; crea un hipervínculo a otras páginas web, archivos, ubicaciones dentro de la misma página, direcciones de correo electrónico o cualquier otra URL.</p>
+
+<p>En SVG, el elemento &lt;a&gt; es un contenedor, es decir, puede crear un enlace alrededor del texto, como en HTML, pero también puede crear un enlace alrededor de cualquier forma.</p>
+
+<div id="Exemple">
+<div class="hidden">
+<pre class="brush: css">@namespace svgns url(http://www.w3.org/2000/svg);
+html,body,svg { height:100% }</pre>
+</div>
+
+<pre class="brush: html">&lt;svg viewBox="0 0 100 100" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"&gt;
+  &lt;!-- Un vínculo alrededor de una forma --&gt;
+  &lt;a href="https://developer.mozilla.org/docs/Web/SVG/Element/circle"&gt;
+    &lt;circle cx="50" cy="40" r="35"/&gt;
+  &lt;/a&gt;
+
+  &lt;!-- Un vínculo alrededor de una forma --&gt;
+  &lt;a href="https://developer.mozilla.org/docs/Web/SVG/Element/circle"&gt;
+    &lt;text x="50" y="90" text-anchor="middle"&gt;
+      &amp;lt;circle&amp;gt;
+    &lt;/text&gt;
+  &lt;/a&gt;
+&lt;/svg&gt;</pre>
+
+<pre class="brush: css">/* Como SVG no proporciona un estilo visual predeterminado para los enlaces,
+   se considera una práctica recomendada agregar algunos */
+
+@namespace svgns url(http://www.w3.org/2000/svg);
+
+svgns|a {
+  cursor: pointer;
+}
+
+svgns|a text {
+  fill: blue; /* Incluso para el texto, SVG usa fill para el color */
+  text-decoration: underline;
+}
+
+svgns|a:hover, svgns|a:active {
+  outline: dotted 1px blue;
+}</pre>
+
+<p>{{EmbedLiveSample('Exemple', 100, 100)}}</p>
+</div>
+
+<div class="warning">
+<p>Puesto que este elemento comparte su nombre de etiqueta con el <a href="/en-US/docs/Web/HTML/Element/a">elemento <code>&lt;a&gt;</code>de HTML</a>, la selección de "<code>a</code>" con CSS o <a href="/en-US/docs/Web/API/Document/querySelector"><code>querySelector</code></a> puede aplicarse al tipo incorrecto de elemento. Pruebe <a href="/en-US/docs/Web/CSS/@namespace">la regla <code>@namespace</code></a> para distinguir entre los dos.</p>
+</div>
+
+<h2 id="Atributos">Atributos</h2>
+
+<dl>
+ <dt>{{htmlattrxref("download", "a")}} {{experimental_inline}}</dt>
+ <dd>Este atributo indica a los navegadores que descarguen un {{Glossary ( "URL ")}} en lugar de desplazarse a él, por lo que se le pedirá al usuario que lo guarde como un archivo local.<br>
+ <small><em>Value type</em>: <strong>&lt;string&gt;</strong> ; <em>Default value</em>: <em>none</em>; <em>Animatable</em>: <strong>no</strong></small></dd>
+ <dt>{{SVGAttr("href")}}</dt>
+ <dd>Este atributo contiene el {{Glossary ( "URL ")}} o el fragmento de URL al que apunta el hipervínculo.<br>
+ <small><em>Value type</em>: <strong><a href="/docs/Web/SVG/Content_type#URL">&lt;URL&gt;</a></strong> ; <em>Default value</em>: <em>none</em>; <em>Animatable</em>: <strong>yes</strong></small></dd>
+ <dt>{{htmlattrxref("hreflang", "a")}}</dt>
+ <dd>This attribute contains the URL or URL fragment that the hyperlink points to.<br>
+ <small><em>Value type</em>: <strong>&lt;string&gt;</strong> ; <em>Default value</em>: <em>none</em>; <em>Animatable</em>: <strong>yes</strong></small></dd>
+ <dt>{{htmlattrxref("ping", "a")}} {{experimental_inline}}</dt>
+ <dd>Este atributo contiene una lista de direcciones URL separadas por espacios a las que, cuando se sigue el hipervínculo, las solicitudes <a href="https://developer.mozilla.org/en-US/docs/Web/HTTP/Methods/POST" title="The HTTP POST method sends data to the server. The type of the body of the request is indicated by the Content-Type header."><code>POST</code></a> con el cuerpo <code>PING</code> serán enviadas por el navegador (en segundo plano). Normalmente se utiliza para el seguimiento. Para obtener una característica más ampliamente admitida que aborde los mismos casos de uso, consulte <a href="/en-US/docs/Web/API/Navigator/sendBeacon">Navigator.sendBeacon()</a>.<br>
+ <small><em>Value type</em>: <strong><a href="/docs/Web/SVG/Content_type#List-of-Ts">&lt;list-of-URLs&gt;</a></strong> ; <em>Default value</em>: <em>none</em>; <em>Animatable</em>: <strong>no</strong></small></dd>
+ <dt>{{htmlattrxref("referrerpolicy", "a")}} {{experimental_inline}}</dt>
+ <dd>Este atributo indica qué <a href="https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Referer">referrer</a> se enviará al obtener {{Glossary("URL")}}.<br>
+ <small><em>Value type</em>: <code>no-referrer</code>|<code>no-referrer-when-downgrade</code>|<code>same-origin</code>|<code>origin</code>|<code>strict-origin</code>|<code>origin-when-cross-origin</code>|<code>strict-origin-when-cross-origin</code>|<code>unsafe-url</code> ; <em>Default value</em>: <em>none</em>; <em>Animatable</em>: <strong>no</strong></small></dd>
+ <dt>{{htmlattrxref("rel", "a")}} {{experimental_inline}}</dt>
+ <dd>Este atributo especifica la relación del objeto de destino con el vínculado.<br>
+ <small><em>Value type</em>: <strong><a href="/docs/Web/HTML/Link_types">&lt;list-of-Link-Types&gt;</a></strong> ; <em>Default value</em>: <em>none</em>; <em>Animatable</em>: <strong>yes</strong></small></dd>
+ <dt>{{SVGAttr("target")}}</dt>
+ <dd>Este atributo especifica dónde mostrar el {{Glossary("URL")}}.<br>
+ <small><em>Value type</em>: <code>_self</code>|<code>_parent</code>|<code>_top</code>|<code>_blank</code>|<strong>&lt;name&gt;</strong> ; <em>Default value</em>: <code>_self</code>; <em>Animatable</em>: <strong>yes</strong></small></dd>
+ <dt>{{htmlattrxref("type", "a")}}</dt>
+ <dd>Este atributo especifica el tipo de medio en forma de un {{Glossary ( "tipo MIME ")}} para la dirección URL vinculada.<br>
+ <small><em>Value type</em>: <strong>&lt;string&gt;</strong> ; <em>Default value</em>: <em>none</em>; <em>Animatable</em>: <strong>yes</strong></small></dd>
+ <dt>{{SVGAttr("xlink:href")}} {{deprecated_inline("SVG2")}}</dt>
+ <dd>Este atributo contiene la dirección URL o el fragmento de URL al que apunta el hipervínculo.<br>
+ <small><em>Value type</em>: <strong><a href="/docs/Web/SVG/Content_type#URL">&lt;URL&gt;</a></strong> ; <em>Default value</em>: <em>none</em>; <em>Animatable</em>: <strong>yes</strong></small></dd>
+</dl>
+
+<h3 id="Atributos_globales">Atributos globales</h3>
+
+<dl>
+ <dt><a href="/docs/Web/SVG/Attribute/Core">Atributos principales</a> </dt>
+ <dd><small>Especialmente: {{SVGAttr('id')}}, {{SVGAttr('lang')}}, {{SVGAttr('tabindex')}}</small></dd>
+ <dt><a href="/docs/Web/SVG/Attribute/Styling">Atributos de estilo</a></dt>
+ <dd><small>{{SVGAttr('class')}}, {{SVGAttr('style')}}</small></dd>
+ <dt><a href="/docs/Web/SVG/Attribute/Conditional_Processing">Atributos de procesamiento condicional</a></dt>
+ <dd><small>Especialmente: {{SVGAttr('requiredExtensions')}}, {{SVGAttr('systemLanguage')}}</small></dd>
+ <dt>Atributos de evento</dt>
+ <dd><small><a href="/docs/Web/SVG/Attribute/Events#Global_Event_Attributes">Atributos de eventos globales</a>, <a href="/docs/Web/SVG/Attribute/Events#Document_Element_Event_Attributes">atributos de eventos de elementos de documento</a>, <a href="/docs/Web/SVG/Attribute/Events#Graphical_Event_Attributes">atributos de eventos gráficos</a></small></dd>
+ <dt><a href="/docs/Web/SVG/Attribute/Presentation">Atributos de presentación</a></dt>
+ <dd><small>Especialmente: {{SVGAttr('clip-path')}}, {{SVGAttr('clip-rule')}}, {{SVGAttr('color')}}, {{SVGAttr('color-interpolation')}}, {{SVGAttr('color-rendering')}}, {{SVGAttr('cursor')}}, {{SVGAttr('display')}}, {{SVGAttr('fill')}}, {{SVGAttr('fill-opacity')}}, {{SVGAttr('fill-rule')}}, {{SVGAttr('filter')}}, {{SVGAttr('mask')}}, {{SVGAttr('opacity')}}, {{SVGAttr('pointer-events')}}, {{SVGAttr('shape-rendering')}}, {{SVGAttr('stroke')}}, {{SVGAttr('stroke-dasharray')}}, {{SVGAttr('stroke-dashoffset')}}, {{SVGAttr('stroke-linecap')}}, {{SVGAttr('stroke-linejoin')}}, {{SVGAttr('stroke-miterlimit')}}, {{SVGAttr('stroke-opacity')}}, {{SVGAttr('stroke-width')}}, {{SVGAttr("transform")}}, {{SVGAttr('vector-effect')}}, {{SVGAttr('visibility')}}</small></dd>
+ <dt>Atributos XLink</dt>
+ <dd><small>Most notably: {{SVGAttr("xlink:title")}}</small></dd>
+ <dt>Atributos ARIA</dt>
+ <dd><small><code>aria-activedescendant</code>, <code>aria-atomic</code>, <code>aria-autocomplete</code>, <code>aria-busy</code>, <code>aria-checked</code>, <code>aria-colcount</code>, <code>aria-colindex</code>, <code>aria-colspan</code>, <code>aria-controls</code>, <code>aria-current</code>, <code>aria-describedby</code>, <code>aria-details</code>, <code>aria-disabled</code>, <code>aria-dropeffect</code>, <code>aria-errormessage</code>, <code>aria-expanded</code>, <code>aria-flowto</code>, <code>aria-grabbed</code>, <code>aria-haspopup</code>, <code>aria-hidden</code>, <code>aria-invalid</code>, <code>aria-keyshortcuts</code>, <code>aria-label</code>, <code>aria-labelledby</code>, <code>aria-level</code>, <code>aria-live</code>, <code>aria-modal</code>, <code>aria-multiline</code>, <code>aria-multiselectable</code>, <code>aria-orientation</code>, <code>aria-owns</code>, <code>aria-placeholder</code>, <code>aria-posinset</code>, <code>aria-pressed</code>, <code>aria-readonly</code>, <code>aria-relevant</code>, <code>aria-required</code>, <code>aria-roledescription</code>, <code>aria-rowcount</code>, <code>aria-rowindex</code>, <code>aria-rowspan</code>, <code>aria-selected</code>, <code>aria-setsize</code>, <code>aria-sort</code>, <code>aria-valuemax</code>, <code>aria-valuemin</code>, <code>aria-valuenow</code>, <code>aria-valuetext</code>, <code>role</code></small></dd>
+</dl>
+
+<h2 id="Notas_de_uso">Notas de uso</h2>
+
+<p>{{svginfo}}</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">Comentatio</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('Referrer Policy', '#referrer-policy-delivery-referrer-attribute', 'referrer attribute')}}</td>
+   <td>{{Spec2('Referrer Policy')}}</td>
+   <td>Añadido el atributo <code>referrerpolicy</code>.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName("SVG2", "linking.html#Links", "&lt;a&gt;")}}</td>
+   <td>{{Spec2("SVG2")}}</td>
+   <td>Se sustituye el atributo {{SVGAttr("xlink:href")}} por {{SVGAttr("href")}}</td>
+  </tr>
+  <tr>
+   <td>{{SpecName("SVG1.1", "linking.html#Links", "&lt;a&gt;")}}</td>
+   <td>{{Spec2("SVG1.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 desea contribuir a los datos, haz un check out de <a href="https://ssl.microsofttranslator.com/bv.aspx?from=&amp;to=es&amp;a=https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíenos un pull request.</div>
+
+<p>{{Compat("svg.elements.a")}}</p>
diff --git a/files/es/web/svg/element/animate/index.html b/files/es/web/svg/element/animate/index.html
new file mode 100644
index 0000000000..962a535446
--- /dev/null
+++ b/files/es/web/svg/element/animate/index.html
@@ -0,0 +1,109 @@
+---
+title: <animate>
+slug: Web/SVG/Element/animate
+translation_of: Web/SVG/Element/animate
+---
+<div>{{SVGRef}}</div>
+
+<div>El elemento <code>animate</code> de SVG se utiliza para animar un atributo o propiedad a través del tiempo. Normalmente se inserta dentro del elemento o referenciado con el atributo <code>href</code>.</div>
+
+<h2 id="Contexto_de_uso">Contexto de uso</h2>
+
+<p>{{svginfo}}</p>
+
+<h2 id="Atributos">Atributos</h2>
+
+<h3 id="Atributos_globales">Atributos globales</h3>
+
+<ul>
+ <li><a href="/en-US/docs/Web/SVG/Attribute#Conditional_processing_attributes">Conditional processing attributes</a> »</li>
+ <li><a href="/en-US/docs/Web/SVG/Attribute#Core_attributes">Core attributes</a> »</li>
+ <li><a href="/en-US/docs/Web/SVG/Attribute#Animation_event_attributes">Animation event attributes</a> »</li>
+ <li><a href="/en-US/docs/Web/SVG/Attribute#XLink_attributes">Xlink attributes</a> »</li>
+ <li><a href="/en-US/docs/Web/SVG/Attribute#AnimationAttributeTarget">Animation attribute target attributes</a> »</li>
+ <li><a href="/en-US/docs/Web/SVG/Attribute#Animation_timing_attributes">Animation timing attributes</a> »</li>
+ <li><a href="/en-US/docs/Web/SVG/Attribute#Animation_value_attributes">Animation value attributes</a> »</li>
+ <li><a href="/en-US/docs/Web/SVG/Attribute#Animation_addition_attributes">Animation addition attributes</a> »</li>
+ <li>{{SVGAttr("externalResourcesRequired")}}</li>
+</ul>
+
+<h3 id="Atributos_específicos">Atributos específicos</h3>
+
+<ul>
+ <li>{{SVGAttr("attributeName")}}</li>
+ <li>{{SVGAttr("attributeType")}}</li>
+ <li>{{SVGAttr("from")}}</li>
+ <li>{{SVGAttr("to")}}</li>
+ <li>{{SVGAttr("dur")}}</li>
+ <li>{{SVGAttr("repeatCount")}}</li>
+</ul>
+
+<h2 id="DOM">DOM</h2>
+
+<p>Este elemento implementa la interfaz de <code><a href="/en-US/docs/Web/DOM/SVGAnimateElement">SVGAnimateElement</a></code>.</p>
+
+<h2 id="Ejemplo">Ejemplo</h2>
+
+<h3 id="SVG">SVG</h3>
+
+<pre class="brush: html; highlight[6-7]">&lt;?xml version="1.0"?&gt;
+&lt;svg width="120" height="120" viewBox="0 0 120 120" version="1.1"
+     xmlns="http://www.w3.org/2000/svg"&gt;
+
+  &lt;rect x="10" y="10" width="100" height="100"&gt;
+    &lt;animate attributeType="XML" attributeName="x" from="-100" to="120"
+        dur="10s" repeatCount="indefinite"/&gt;
+  &lt;/rect&gt;
+&lt;/svg&gt;</pre>
+
+<h3 id="Result">Result</h3>
+
+<p>{{EmbedLiveSample("Ejemplo", 120, 120)}}</p>
+
+<h2 id="Sobre_Accesibilidad">Sobre Accesibilidad</h2>
+
+<p>Las animaciones titilantes e intermitentes pueden causar dificultades a las personas con discapacidades cognitivas como Trastorno por Déficit de Atención con Hiperactividad (ADHD) además de causar ataques a personas con cinestosis, epilepsia, migranias o <span class="short_text" id="result_box" lang="es"><span>síndrome de sensibilidad escotópica</span></span>.</p>
+
+<p>Por favor, considerá ofrecer un mecanismo para pausar o deshabilitar las animaciones, como utilizando <a href="https://developer.mozilla.org/en-US/docs/Web/CSS/@media/prefers-reduced-motion">Reduced Motion Media Query.</a></p>
+
+<p>Para más información (en inglés):</p>
+
+<ul>
+ <li><a href="https://alistapart.com/article/designing-safer-web-animation-for-motion-sensitivity">Designing Safer Web Animation For Motion Sensitivity · An A List Apart Article </a></li>
+ <li><a href="https://css-tricks.com/introduction-reduced-motion-media-query/">An Introduction to the Reduced Motion Media Query | CSS-Tricks</a></li>
+ <li><a href="https://webkit.org/blog/7551/responsive-design-for-motion/">Responsive Design for Motion | WebKit</a></li>
+ <li><a href="https://developer.mozilla.org/en-US/docs/Web/Accessibility/Understanding_WCAG/Operable#Guideline_2.2_%E2%80%94_Enough_Time_Provide_users_enough_time_to_read_and_use_content">MDN Understanding WCAG, Guideline 2.2 explanations</a></li>
+ <li><a href="https://www.w3.org/TR/UNDERSTANDING-WCAG20/time-limits-pause.html">Understanding Success Criterion 2.2.2  | W3C Understanding WCAG 2.0</a></li>
+</ul>
+
+<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("SVG Animations 2", "#AnimateElement", "&lt;animate&gt;")}}</td>
+   <td>{{Spec2("SVG Animations 2")}}</td>
+   <td>Sin cambios</td>
+  </tr>
+  <tr>
+   <td>{{SpecName("SVG1.1", "animate.html#AnimateElement", "&lt;animate&gt;")}}</td>
+   <td>{{Spec2("SVG1.1")}}</td>
+   <td>Definición inicial</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
+
+<div>
+
+
+<p>{{Compat("svg.elements.animate")}}</p>
+</div>
diff --git a/files/es/web/svg/element/circle/index.html b/files/es/web/svg/element/circle/index.html
new file mode 100644
index 0000000000..36b4f9e6c2
--- /dev/null
+++ b/files/es/web/svg/element/circle/index.html
@@ -0,0 +1,116 @@
+---
+title: circle
+slug: Web/SVG/Element/circle
+tags:
+  - Elemento
+  - Gráficos SVG
+  - Referencia
+  - SVG
+translation_of: Web/SVG/Element/circle
+---
+<div>{{SVGRef}}</div>
+
+<p>El elemento <span style="font-family: consolas,monaco,andale mono,monospace;">circle </span>es una forma básica de SVG, usada para crear circulos a partir de un punto, el cual indica el centro del circulo, y un radio.</p>
+
+<h2 id="Contexto_de_uso">Contexto de uso</h2>
+
+<p>{{svginfo}}</p>
+
+<h2 id="Ejemplo">Ejemplo</h2>
+
+<p> </p>
+
+<pre class="brush: xml line-numbers  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>svg</span> <span class="attr-name token">viewBox</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>0 0 120 120<span class="punctuation token">"</span></span> <span class="attr-name token">version</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>1.1<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.w3.org/2000/svg<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>circle</span> <span class="attr-name token">cx</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>60<span class="punctuation token">"</span></span> <span class="attr-name token">cy</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>60<span class="punctuation token">"</span></span> <span class="attr-name token">r</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>50<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>svg</span><span class="punctuation token">&gt;</span></span></code></pre>
+
+<p> </p>
+
+<p>» <a href="https://mdn.mozillademos.org/files/7707/circle2.svg">circulo.svg</a></p>
+
+<h2 id="Atributos">Atributos</h2>
+
+<h3 id="Atributos_globales">Atributos globales</h3>
+
+<ul>
+ <li><a href="/en/SVG/Attribute#ConditionalProccessing">Atributos de procesamiento condicional</a> »</li>
+ <li><a href="/en/SVG/Attribute#Core">Atributos principales</a> »</li>
+ <li><a href="/en/SVG/Attribute#GraphicalEvent">Atributos de eventos gráficos</a> »</li>
+ <li><a href="/en/SVG/Attribute#Presentation">Atributos de presentación</a> »</li>
+ <li>{{ SVGAttr("class") }}</li>
+ <li>{{ SVGAttr("style") }}</li>
+ <li>{{ SVGAttr("externalResourcesRequired") }}</li>
+ <li>{{ SVGAttr("transform") }}</li>
+</ul>
+
+<h3 id="Atributos_específicos">Atributos específicos</h3>
+
+<ul>
+ <li>{{ SVGAttr("cx") }}</li>
+ <li>{{ SVGAttr("cy") }}</li>
+ <li>{{ SVGAttr("r") }}</li>
+</ul>
+
+<h2 id="Interfaz_DOM">Interfaz DOM</h2>
+
+<p>Este elemento implementa la interfaz {{ domxref("SVGCircleElement") }}.</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 scope="col">Chrome</th>
+   <th scope="col">Firefox (Gecko)</th>
+   <th scope="col">Internet Explorer</th>
+   <th scope="col">Opera</th>
+   <th scope="col">Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>1.0</td>
+   <td>{{ CompatGeckoDesktop('1.8') }}</td>
+   <td>{{ CompatIE('9.0') }}</td>
+   <td>{{ CompatOpera('8.0') }}</td>
+   <td>{{ CompatSafari('3.0.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>Soporte básico</td>
+   <td>{{ CompatAndroid('3.0') }}</td>
+   <td>{{ CompatGeckoMobile('1.8') }}</td>
+   <td>{{ CompatNo() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatSafari('3.0.4') }}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<p>La gráfica está basada en <a href="/en-US/docs/Web/SVG/Compatibility_sources">estas fuentes</a>.</p>
+
+<h2 id="Relacionado">Relacionado</h2>
+
+<ul>
+ <li>{{ SVGElement("ellipse") }}</li>
+</ul>
diff --git a/files/es/web/svg/element/foreignobject/index.html b/files/es/web/svg/element/foreignobject/index.html
new file mode 100644
index 0000000000..ea64360cbb
--- /dev/null
+++ b/files/es/web/svg/element/foreignobject/index.html
@@ -0,0 +1,133 @@
+---
+title: foreignObject
+slug: Web/SVG/Element/foreignObject
+translation_of: Web/SVG/Element/foreignObject
+---
+<div>{{SVGRef}}</div>
+
+<p>El elemento <code>foreignObject</code> permite la inclusión de un namespace XML externo que tiene su contenido gráfico dibujado por un diferente user-agent. El contenido gráfico externo incluido está sujeto a las transformaciones SVG y composición.</p>
+
+<p>The contents of <code>foreignObject</code> are assumed to be from a different namespace. Any SVG elements within a <code>foreignObject</code> will not be drawn, except in the situation where a properly defined SVG subdocument with a proper <code>xmlns</code> attribute specification is embedded recursively. One situation where this can occur is when an SVG document fragment is embedded within another non-SVG document fragment, which in turn is embedded within an SVG document fragment (e.g., an SVG document fragment contains an XHTML document fragment which in turn contains yet another SVG document fragment).</p>
+
+<p>Usually, a <code>foreignObject</code> will be used in conjunction with the {{ SVGElement("switch") }} element and the {{ SVGAttr("requiredExtensions") }} attribute to provide proper checking for user agent support and provide an alternate rendering in case user agent support is not available.</p>
+
+<h2 id="Usage_context">Usage context</h2>
+
+<p>{{svginfo}}</p>
+
+<h2 id="Example">Example</h2>
+
+<pre class="brush: xml">&lt;svg width="400px" height="300px" viewBox="0 0 400 300"
+     xmlns="http://www.w3.org/2000/svg"&gt;
+  &lt;desc&gt;This example uses the 'switch' element to provide a
+        fallback graphical representation of a paragraph, if
+        XHTML is not supported.&lt;/desc&gt;
+
+  &lt;!-- The 'switch' element will process the first child element
+       whose testing attributes evaluate to true.--&gt;
+  &lt;switch&gt;
+
+    &lt;!-- Process the embedded XHTML if the requiredExtensions attribute
+         evaluates to true (i.e., the user agent supports XHTML
+         embedded within SVG). --&gt;
+    &lt;foreignObject width="100" height="50"
+                   requiredExtensions="<span id="the-code"><span class="s">http://www.w3.org/1999/xhtml</span></span>"&gt;
+      &lt;!-- XHTML content goes here --&gt;
+      &lt;body xmlns="http://www.w3.org/1999/xhtml"&gt;
+        &lt;p&gt;Here is a paragraph that requires word wrap&lt;/p&gt;
+      &lt;/body&gt;
+    &lt;/foreignObject&gt;
+
+    &lt;!-- Else, process the following alternate SVG.
+         Note that there are no testing attributes on the 'text' element.
+         If no testing attributes are provided, it is as if there
+         were testing attributes and they evaluated to true.--&gt;
+    &lt;text font-size="10" font-family="Verdana"&gt;
+      &lt;tspan x="10" y="10"&gt;Here is a paragraph that&lt;/tspan&gt;
+      &lt;tspan x="10" y="20"&gt;requires word wrap.&lt;/tspan&gt;
+    &lt;/text&gt;
+  &lt;/switch&gt;
+&lt;/svg&gt;
+</pre>
+
+<h2 id="Attributes">Attributes</h2>
+
+<h3 id="Global_attributes">Global attributes</h3>
+
+<ul>
+ <li><a href="/en-US/docs/SVG/Attribute#ConditionalProccessing" title="en/SVG/Attribute#ConditionalProccessing">Conditional processing attributes</a> »</li>
+ <li><a href="/en-US/docs/SVG/Attribute#Core" title="en/SVG/Attribute#Core">Core attributes</a> »</li>
+ <li><a href="/en-US/docs/SVG/Attribute#GraphicalEvent" title="en/SVG/Attribute#GraphicalEvent">Graphical event attributes</a> »</li>
+ <li><a href="/en-US/docs/SVG/Attribute#Presentation" title="en/SVG/Attribute#Presentation ">Presentation attributes</a> »</li>
+ <li>{{ SVGAttr("class") }}</li>
+ <li>{{ SVGAttr("style") }}</li>
+ <li>{{ SVGAttr("externalResourcesRequired") }}</li>
+ <li>{{ SVGAttr("transform") }}</li>
+</ul>
+
+<h3 id="Specific_attributes">Specific attributes</h3>
+
+<ul>
+ <li>{{ SVGAttr("x") }}</li>
+ <li>{{ SVGAttr("y") }}</li>
+ <li>{{ SVGAttr("width") }}</li>
+ <li>{{ SVGAttr("height") }}</li>
+</ul>
+
+<h2 id="DOM_Interface">DOM Interface</h2>
+
+<p>This element implements the <code><a href="/en-US/docs/DOM/SVGForeignObjectElement" title="en/DOM/SVGForeignObjectElement">SVGForeignObjectElement</a></code> interface.</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</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>1.0</td>
+   <td>1.9</td>
+   <td>{{ CompatNo() }}</td>
+   <td>2.0</td>
+   <td>3.0</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>2.0</td>
+   <td>{{ CompatNo() }}</td>
+   <td>2.0</td>
+   <td>3.0</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<p>The chart is based on <a href="/en-US/docs/SVG/Compatibility_sources" title="en/SVG/Compatibility sources">these sources</a>.</p>
diff --git a/files/es/web/svg/element/g/index.html b/files/es/web/svg/element/g/index.html
new file mode 100644
index 0000000000..1c0438c53d
--- /dev/null
+++ b/files/es/web/svg/element/g/index.html
@@ -0,0 +1,110 @@
+---
+title: g
+slug: Web/SVG/Element/g
+tags:
+  - Contenedor
+  - Contenedor SVG
+  - Elemento
+  - Referencia
+  - SVG
+translation_of: Web/SVG/Element/g
+---
+<div>{{SVGRef}}</div>
+
+<div>El elemento <code>g</code> es un contenedor usado para agrupar objetos. Las transformaciones aplicadas al elemento <code>g</code> son realizadas sobre todos los elementos hijos del mismo. Los atributos aplicados son heredados por los elementos hijos. Además, puede ser usado para definir objetos complejos que pueden luego ser referenciados con el elemento {{SVGElement("use")}}.</div>
+
+<div> </div>
+
+<h2 id="Contexto_de_uso">Contexto de uso</h2>
+
+<p>{{svginfo}}</p>
+
+<h2 id="Ejemplo">Ejemplo</h2>
+
+<pre class="brush: html" style="color: rgb(0, 0, 0); font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: normal; text-align: -webkit-auto; text-indent: 0px; text-transform: none;">&lt;svg width="100%" height="100%" viewBox="0 0 95 50"
+     xmlns="http://www.w3.org/2000/svg"&gt;
+  &lt;g stroke="green" fill="white" stroke-width="5"&gt;
+    &lt;circle cx="25" cy="25" r="15" /&gt;
+    &lt;circle cx="40" cy="25" r="15" /&gt;
+    &lt;circle cx="55" cy="25" r="15" /&gt;
+    &lt;circle cx="70" cy="25" r="15" /&gt;
+  &lt;/g&gt;
+&lt;/svg&gt;
+</pre>
+
+<p>{{EmbedLiveSample("Ejemplo",220,130)}}</p>
+
+<h2 id="Atributos">Atributos</h2>
+
+<h3 id="Atributos_globales">Atributos globales</h3>
+
+<ul>
+ <li><a href="/en-US/docs/SVG/Attribute#ConditionalProccessing" title="SVG/Attribute#ConditionalProccessing">Conditional processing attributes</a> »</li>
+ <li><a href="/en-US/docs/SVG/Attribute#Core" title="SVG/Attribute#Core">Core attributes</a> »</li>
+ <li><a href="/en-US/docs/SVG/Attribute#GraphicalEvent" title="SVG/Attribute#GraphicalEvent">Graphical event attributes</a> »</li>
+ <li><a href="/en-US/docs/SVG/Attribute#Presentation" title="SVG/Attribute#Presentation">Presentation attributes</a> »</li>
+ <li>{{SVGAttr("class")}}</li>
+ <li>{{SVGAttr("style")}}</li>
+ <li>{{SVGAttr("externalResourcesRequired")}}</li>
+ <li>{{SVGAttr("transform")}}</li>
+</ul>
+
+<h3 id="Atributos_Específicos">Atributos Específicos</h3>
+
+<p><em>No hay atributos específicos</em></p>
+
+<h2 id="Interfaz_DOM">Interfaz DOM</h2>
+
+<p>Este elemento implementa la interfaz <code><a href="/en-US/docs/DOM/SVGGElement" title="DOM/SVGGElement">SVGGElement</a></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 scope="col">Característica</th>
+   <th scope="col">Chrome</th>
+   <th scope="col">Firefox (Gecko)</th>
+   <th scope="col">Internet Explorer</th>
+   <th scope="col">Opera</th>
+   <th scope="col">Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte Básico</td>
+   <td>1.0</td>
+   <td>{{CompatGeckoDesktop('1.8')}}</td>
+   <td>{{CompatIE('9.0')}}</td>
+   <td>{{CompatOpera('8.0')}}</td>
+   <td>{{CompatSafari('3.0.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>Soporte Básico</td>
+   <td>{{CompatAndroid('3.0')}}</td>
+   <td>{{CompatGeckoMobile('1.8')}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatSafari('3.0.4')}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<p>La tabla está basada en <a href="/en-US/docs/SVG/Compatibility_sources" title="SVG/Compatibility sources">these sources</a>.</p>
diff --git a/files/es/web/svg/element/glifo/index.html b/files/es/web/svg/element/glifo/index.html
new file mode 100644
index 0000000000..78f97fe3bb
--- /dev/null
+++ b/files/es/web/svg/element/glifo/index.html
@@ -0,0 +1,114 @@
+---
+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/index.html b/files/es/web/svg/element/index.html
new file mode 100644
index 0000000000..cb741fc471
--- /dev/null
+++ b/files/es/web/svg/element/index.html
@@ -0,0 +1,297 @@
+---
+title: Referencia de Elementos SVG
+slug: Web/SVG/Element
+tags:
+  - NeedsTranslation
+  - SVG
+  - SVG Reference
+  - TopicStub
+translation_of: Web/SVG/Element
+---
+<p>« <a href="/en-US/docs/SVG" title="SVG">SVG</a> / <a href="/en-US/docs/SVG/Attribute" title="SVG/Attribute">SVG Attribute reference</a> »</p>
+
+<p>Los dibujos e imágenes SVG son creados utilizando una amplia variedad de elementos dedicados a la construcción, el dibujo y el diseño de imágenes y diagramas vectoriales. Aquí encontrarás la documentación de referencia para cada uno de los elementos SVG.</p>
+
+<h2 id="Elementos_SVG">Elementos SVG</h2>
+
+<div class="index">
+<h3 id="A">A</h3>
+
+<ul>
+ <li>{{SVGElement("a")}}</li>
+ <li>{{SVGElement("animate")}}</li>
+ <li>{{SVGElement("animateMotion")}}</li>
+ <li>{{SVGElement("animateTransform")}}</li>
+</ul>
+
+<h3 id="C">C</h3>
+
+<ul>
+ <li>{{SVGElement("circle")}}</li>
+ <li>{{SVGElement("clipPath")}}</li>
+ <li>{{SVGElement("color-profile")}}</li>
+</ul>
+
+<h3 id="D">D</h3>
+
+<ul>
+ <li>{{SVGElement("defs")}}</li>
+ <li>{{SVGElement("desc")}}</li>
+ <li>{{SVGElement("discard")}}</li>
+</ul>
+
+<h3 id="E">E</h3>
+
+<ul>
+ <li>{{SVGElement("ellipse")}}</li>
+</ul>
+
+<h3 id="F">F</h3>
+
+<ul>
+ <li>{{SVGElement("feBlend")}}</li>
+ <li>{{SVGElement("feColorMatrix")}}</li>
+ <li>{{SVGElement("feComponentTransfer")}}</li>
+ <li>{{SVGElement("feComposite")}}</li>
+ <li>{{SVGElement("feConvolveMatrix")}}</li>
+ <li>{{SVGElement("feDiffuseLighting")}}</li>
+ <li>{{SVGElement("feDisplacementMap")}}</li>
+ <li>{{SVGElement("feDistantLight")}}</li>
+ <li>{{SVGElement("feDropShadow")}}</li>
+ <li>{{SVGElement("feFlood")}}</li>
+ <li>{{SVGElement("feFuncA")}}</li>
+ <li>{{SVGElement("feFuncB")}}</li>
+ <li>{{SVGElement("feFuncG")}}</li>
+ <li>{{SVGElement("feFuncR")}}</li>
+ <li>{{SVGElement("feGaussianBlur")}}</li>
+ <li>{{SVGElement("feImage")}}</li>
+ <li>{{SVGElement("feMerge")}}</li>
+ <li>{{SVGElement("feMergeNode")}}</li>
+ <li>{{SVGElement("feMorphology")}}</li>
+ <li>{{SVGElement("feOffset")}}</li>
+ <li>{{SVGElement("fePointLight")}}</li>
+ <li>{{SVGElement("feSpecularLighting")}}</li>
+ <li>{{SVGElement("feSpotLight")}}</li>
+ <li>{{SVGElement("feTile")}}</li>
+ <li>{{SVGElement("feTurbulence")}}</li>
+ <li>{{SVGElement("filter")}}</li>
+ <li>{{SVGElement("foreignObject")}}</li>
+</ul>
+
+<h3 id="G">G</h3>
+
+<ul>
+ <li>{{SVGElement("g")}}</li>
+</ul>
+
+<h3 id="H">H</h3>
+
+<ul>
+ <li>{{SVGElement("hatch")}}</li>
+ <li>{{SVGElement("hatchpath")}}</li>
+</ul>
+
+<h3 id="I">I</h3>
+
+<ul>
+ <li>{{SVGElement("image")}}</li>
+</ul>
+
+<h3 id="L">L</h3>
+
+<ul>
+ <li>{{SVGElement("line")}}</li>
+ <li>{{SVGElement("linearGradient")}}</li>
+</ul>
+
+<h3 id="M">M</h3>
+
+<ul>
+ <li>{{SVGElement("marker")}}</li>
+ <li>{{SVGElement("mask")}}</li>
+ <li>{{SVGElement("mesh")}}</li>
+ <li>{{SVGElement("meshgradient")}}</li>
+ <li>{{SVGElement("meshpatch")}}</li>
+ <li>{{SVGElement("meshrow")}}</li>
+ <li>{{SVGElement("metadata")}}</li>
+ <li>{{SVGElement("mpath")}}</li>
+</ul>
+
+<h3 id="P">P</h3>
+
+<ul>
+ <li>{{SVGElement("path")}}</li>
+ <li>{{SVGElement("pattern")}}</li>
+ <li>{{SVGElement("polygon")}}</li>
+ <li>{{SVGElement("polyline")}}</li>
+</ul>
+
+<h3 id="R">R</h3>
+
+<ul>
+ <li>{{SVGElement("radialGradient")}}</li>
+ <li>{{SVGElement("rect")}}</li>
+</ul>
+
+<h3 id="S">S</h3>
+
+<ul>
+ <li>{{SVGElement("script")}}</li>
+ <li>{{SVGElement("set")}}</li>
+ <li>{{SVGElement("solidcolor")}}</li>
+ <li>{{SVGElement("stop")}}</li>
+ <li>{{SVGElement("style")}}</li>
+ <li>{{SVGElement("svg")}}</li>
+ <li>{{SVGElement("switch")}}</li>
+ <li>{{SVGElement("symbol")}}</li>
+ <li>&lt;</li>
+</ul>
+
+<h3 id="T">T</h3>
+
+<ul>
+ <li>{{SVGElement("text")}}</li>
+ <li>{{SVGElement("textPath")}}</li>
+ <li>{{SVGElement("title")}}</li>
+ <li>{{SVGElement("tspan")}}</li>
+</ul>
+
+<h3 id="U">U</h3>
+
+<ul>
+ <li>{{SVGElement("unknown")}}</li>
+ <li>{{SVGElement("use")}}</li>
+</ul>
+
+<h3 id="V">V</h3>
+
+<ul>
+ <li>{{SVGElement("view")}}</li>
+</ul>
+</div>
+
+<h2 id="Elementos_SVG_por_Categorías">Elementos SVG por Categorías</h2>
+
+<h3 id="Elementos_de_Animación">Elementos de Animación</h3>
+
+<p>{{SVGElement("animate")}}, {{SVGElement("animateColor")}}, {{SVGElement("animateMotion")}}, {{SVGElement("animateTransform")}}, {{SVGElement("discard")}}, {{SVGElement("mpath")}}, {{SVGElement("set")}}</p>
+
+<h3 id="Formas_básicas">Formas básicas</h3>
+
+<p>{{SVGElement("circle")}}, {{SVGElement("ellipse")}}, {{SVGElement("line")}}, {{SVGElement("polygon")}}, {{SVGElement("polyline")}}, {{SVGElement("rect")}}</p>
+
+<h3 id="Elementos_Contenedores">Elementos Contenedores</h3>
+
+<p>{{SVGElement("a")}}, {{SVGElement("defs")}}, {{SVGElement("g")}}, {{SVGElement("marker")}}, {{SVGElement("mask")}}, {{SVGElement("missing-glyph")}}, {{SVGElement("pattern")}}, {{SVGElement("svg")}}, {{SVGElement("switch")}}, {{SVGElement("symbol")}}, {{SVGElement("unknown")}}</p>
+
+<h3 id="Elementos_Descriptivos">Elementos Descriptivos</h3>
+
+<p>{{SVGElement("desc")}}, {{SVGElement("metadata")}}, {{SVGElement("title")}}</p>
+
+<h3 id="Elementos_de_Filtros_Primitivos">Elementos de Filtros Primitivos</h3>
+
+<p>{{SVGElement("feBlend")}}, {{SVGElement("feColorMatrix")}}, {{SVGElement("feComponentTransfer")}}, {{SVGElement("feComposite")}}, {{SVGElement("feConvolveMatrix")}}, {{SVGElement("feDiffuseLighting")}}, {{SVGElement("feDisplacementMap")}}, {{SVGElement("feDropShadow")}}, {{SVGElement("feFlood")}},{{SVGElement("feFuncA")}}, {{SVGElement("feFuncB")}}, {{SVGElement("feFuncG")}}, {{SVGElement("feFuncR")}},{{SVGElement("feGaussianBlur")}}, {{SVGElement("feImage")}}, {{SVGElement("feMerge")}}, {{SVGElement("feMergeNode")}}, {{SVGElement("feMorphology")}}, {{SVGElement("feOffset")}}, {{SVGElement("feSpecularLighting")}}, {{SVGElement("feTile")}}, {{SVGElement("feTurbulence")}}</p>
+
+<h3 id="Elementos_de_Fuentes">Elementos de Fuentes</h3>
+
+<p>{{SVGElement("font")}}, {{SVGElement("font-face")}}, {{SVGElement("font-face-format")}}, {{SVGElement("font-face-name")}}, {{SVGElement("font-face-src")}}, {{SVGElement("font-face-uri")}}, {{SVGElement("hkern")}}, {{SVGElement("vkern")}}</p>
+
+<h3 id="Elementos_de_Gradientes">Elementos de Gradientes</h3>
+
+<p>{{SVGElement("linearGradient")}}, {{SVGElement("meshgradient")}}, {{SVGElement("radialGradient")}}, {{SVGElement("stop")}}</p>
+
+<h3 id="Elementos_Gráficos">Elementos Gráficos</h3>
+
+<p>{{SVGElement("circle")}}, {{SVGElement("ellipse")}}, {{SVGElement("image")}}, {{SVGElement("line")}}, {{SVGElement("mesh")}}, {{SVGElement("path")}}, {{SVGElement("polygon")}}, {{SVGElement("polyline")}}, {{SVGElement("rect")}}, {{SVGElement("text")}}, {{SVGElement("use")}}</p>
+
+<h3 id="Elementos_de_referencia_de_gráficos">Elementos de referencia de gráficos</h3>
+
+<p>{{SVGElement("mesh")}}, {{SVGElement("use")}}</p>
+
+<h3 id="Elementos_que_crean_luz">Elementos que crean luz</h3>
+
+<p>{{SVGElement("feDistantLight")}}, {{SVGElement("fePointLight")}}, {{SVGElement("feSpotLight")}}</p>
+
+<h3 id="Elementos_que_no_se_renderizan">Elementos que no se renderizan</h3>
+
+<p>{{SVGElement("clipPath")}}, {{SVGElement("defs")}}, {{SVGElement("hatch")}}, {{SVGElement("linearGradient")}}, {{SVGElement("marker")}}, {{SVGElement("mask")}}, {{SVGElement("meshgradient")}}, {{SVGElement("metadata")}}, {{SVGElement("pattern")}}, {{SVGElement("radialGradient")}}, {{SVGElement("script")}}, {{SVGElement("style")}}, {{SVGElement("symbol")}}, {{SVGElement("title")}}</p>
+
+<h3 id="Elementos_de_servidor_para_pintar">Elementos de servidor para pintar</h3>
+
+<p>{{SVGElement("hatch")}}, {{SVGElement("linearGradient")}}, {{SVGElement("meshgradient")}}, {{SVGElement("pattern")}}, {{SVGElement("radialGradient")}}, {{SVGElement("solidcolor")}}</p>
+
+<h3 id="Elementos_renderizables">Elementos renderizables</h3>
+
+<p>{{SVGElement("a")}}, {{SVGElement("circle")}}, {{SVGElement("ellipse")}}, {{SVGElement("foreignObject")}}, {{SVGElement("g")}}, {{SVGElement("image")}}, {{SVGElement("line")}}, {{SVGElement("mesh")}}, {{SVGElement("path")}}, {{SVGElement("polygon")}}, {{SVGElement("polyline")}}, {{SVGElement("rect")}}, {{SVGElement("svg")}}, {{SVGElement("switch")}}, {{SVGElement("symbol")}}, {{SVGElement("text")}}, {{SVGElement("textPath")}}, {{SVGElement("tspan")}}, {{SVGElement("unknown")}}, {{SVGElement("use")}}</p>
+
+<h3 id="Elementos_de_forma">Elementos de forma</h3>
+
+<p>{{SVGElement("circle")}}, {{SVGElement("ellipse")}}, {{SVGElement("line")}}, {{SVGElement("mesh")}}, {{SVGElement("path")}}, {{SVGElement("polygon")}}, {{SVGElement("polyline")}}, {{SVGElement("rect")}}</p>
+
+<h3 id="Elementos_estructurales">Elementos estructurales</h3>
+
+<p>{{SVGElement("defs")}}, {{SVGElement("g")}}, {{SVGElement("svg")}}, {{SVGElement("symbol")}}, {{SVGElement("use")}}</p>
+
+<h3 id="Elementos_de_contenido_textual">Elementos de contenido textual</h3>
+
+<p>{{SVGElement("altGlyph")}}, {{SVGElement("altGlyphDef")}}, {{SVGElement("altGlyphItem")}}, {{SVGElement("glyph")}}, {{SVGElement("glyphRef")}}, {{SVGElement("textPath")}}, {{SVGElement("text")}}, {{SVGElement("tref")}}, {{SVGElement("tspan")}}</p>
+
+<h3 id="Elementos_secundarios_de_contenido_textual">Elementos secundarios de contenido textual</h3>
+
+<p>{{SVGElement("altGlyph")}}, {{SVGElement("textPath")}}, {{SVGElement("tref")}}, {{SVGElement("tspan")}}</p>
+
+<h3 id="Elementos_sin_categorizar">Elementos sin categorizar</h3>
+
+<p>{{SVGElement("clipPath")}}, {{SVGElement("color-profile")}}, {{SVGElement("cursor")}}, {{SVGElement("filter")}}, {{SVGElement("foreignObject")}}, {{SVGElement("hatchpath")}}, {{SVGElement("meshpatch")}}, {{SVGElement("meshrow")}}, {{SVGElement("script")}}, {{SVGElement("style")}}, {{SVGElement("view")}}</p>
+
+<h2 id="Elementos_obsoletos_y_deprecated">Elementos obsoletos y deprecated</h2>
+
+<div class="blockIndicator warning">
+<p><strong>Advertencia:</strong> Estos son elementos antiguos de SVG que están en desuso y no deben utilizarse. <strong> Nunca debe usarlos en nuevos proyectos, y debe reemplazarlos en proyectos antiguos tan pronto como sea posible.</strong> Se enumeran aquí sólo con fines informativos.</p>
+</div>
+
+<p> </p>
+
+<h3 id="A_2">A</h3>
+
+<p>{{SVGElement("altGlyph")}}, {{SVGElement("altGlyphDef")}}, {{SVGElement("altGlyphItem")}}, {{SVGElement("animateColor")}}</p>
+
+<h3 id="C_2">C</h3>
+
+<p>{{SVGElement("cursor")}}</p>
+
+<h3 id="F_2">F</h3>
+
+<p>{{SVGElement("font")}}, {{SVGElement("font-face")}}, {{SVGElement("font-face-format")}}, {{SVGElement("font-face-name")}}, {{SVGElement("font-face-src")}}, {{SVGElement("font-face-uri")}}</p>
+
+<h3 id="G_2">G</h3>
+
+<p>{{SVGElement("glyph")}}, {{SVGElement("glyphRef")}}</p>
+
+<h3 id="H_2">H</h3>
+
+<p>{{SVGElement("hkern")}}</p>
+
+<h3 id="M_2">M</h3>
+
+<p>{{SVGElement("missing-glyph")}}</p>
+
+<h3 id="T_2">T</h3>
+
+<p>{{SVGElement("tref")}}</p>
+
+<h3 id="V_2">V</h3>
+
+<p>{{SVGElement("vkern")}}</p>
+
+<p> </p>
+
+<h2 id="Véase_también">Véase también</h2>
+
+<ul>
+ <li><a href="/en-US/docs/Web/SVG/Attribute">SVG attribute reference</a></li>
+ <li><a href="/en-US/docs/Web/SVG/Tutorial">SVG Tutorial</a></li>
+ <li><a href="/en-US/docs/Web/API/Document_Object_Model#SVG_interfaces">SVG interface reference</a></li>
+</ul>
+
+<p>{{SVGRef}}</p>
diff --git a/files/es/web/svg/element/rect/index.html b/files/es/web/svg/element/rect/index.html
new file mode 100644
index 0000000000..b61b77ba47
--- /dev/null
+++ b/files/es/web/svg/element/rect/index.html
@@ -0,0 +1,141 @@
+---
+title: rect
+slug: Web/SVG/Element/rect
+tags:
+  - Elemento
+  - Gráficos SVG
+  - Referencia
+  - SVG
+translation_of: Web/SVG/Element/rect
+---
+<div>{{SVGRef}}</div>
+
+<p>El elemento <code>rect</code> es una forma básica de SVG, usada para crear rectángulos basada en la posición de una esquina, su alto y ancho.<br>
+ También podría ser usada para crear rectángulos con esquinas redondeadas.</p>
+
+<h2 id="Contexto_de_uso">Contexto de uso</h2>
+
+<p>{{svginfo}}</p>
+
+<h2 id="Ejemplo">Ejemplo</h2>
+
+<h3 id="Uso_simple_de_rect">Uso simple de <code>rect</code></h3>
+
+<p> </p>
+
+<pre class="brush: xml">&lt;?xml version="1.0"?&gt;
+&lt;svg width="120" height="120"
+     viewBox="0 0 120 120"
+     xmlns="http://www.w3.org/2000/svg"&gt;
+
+  &lt;rect x="10" y="10" width="100" height="100"/&gt;
+&lt;/svg&gt;</pre>
+
+<p> </p>
+
+<p>» <a href="https://mdn.mozillademos.org/files/8893/rect-1.svg" title="https://developer.mozilla.org/files/3247/rect-1.svg">rect-1.svg</a></p>
+
+<h3 id="rect_con_esquinas_redondeados"><code>rect</code> con esquinas redondeados</h3>
+
+<p> </p>
+
+<pre class="brush: xml">&lt;?xml version="1.0"?&gt;
+&lt;svg width="120" height="120"
+     viewBox="0 0 120 120"
+     xmlns="http://www.w3.org/2000/svg"&gt;
+
+  &lt;rect x="10" y="10"
+        width="100" height="100"
+        rx="15" ry="15"/&gt;
+
+&lt;/svg&gt;</pre>
+
+<p>» <a href="https://mdn.mozillademos.org/files/8897/rect-2.svg" title="https://developer.mozilla.org/files/3248/rect-2.svg">rect-2.svg</a></p>
+
+<h2 id="Atributos">Atributos</h2>
+
+<h3 id="Atributos_globales">Atributos globales</h3>
+
+<ul>
+ <li><a href="/en/SVG/Attribute#ConditionalProccessing" title="en/SVG/Attribute#ConditionalProccessing">Conditional processing attributes</a> »</li>
+ <li><a href="/en/SVG/Attribute#Core" title="en/SVG/Attribute#Core">Core attributes</a> »</li>
+ <li><a href="/en/SVG/Attribute#GraphicalEvent" title="en/SVG/Attribute#GraphicalEvent">Graphical event attributes</a> »</li>
+ <li><a href="/en/SVG/Attribute#Presentation" title="en/SVG/Attribute#Presentation">Presentation attributes</a> »</li>
+ <li>{{ SVGAttr("class") }}</li>
+ <li>{{ SVGAttr("style") }}</li>
+ <li>{{ SVGAttr("externalResourcesRequired") }}</li>
+ <li>{{ SVGAttr("transform") }}</li>
+</ul>
+
+<h3 id="Atributos_específicos">Atributos específicos</h3>
+
+<ul>
+ <li>{{ SVGAttr("x") }}</li>
+ <li>{{ SVGAttr("y") }}</li>
+ <li>{{ SVGAttr("width") }}</li>
+ <li>{{ SVGAttr("height") }}</li>
+ <li>{{ SVGAttr("rx") }}</li>
+ <li>{{ SVGAttr("ry") }}</li>
+</ul>
+
+<h2 id="Interfaz_DOM">Interfaz DOM</h2>
+
+<p>Este elemento implementa la interfaz <code><a href="/en/DOM/SVGRectElement" title="en/DOM/SVGRectElement">SVGRectElement</a></code>.</p>
+
+<h2 id="Compatibilidad_de_los_Navegadores">Compatibilidad de los Navegadores</h2>
+
+<p>{{ CompatibilityTable() }}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th scope="col">Feature</th>
+   <th scope="col">Chrome</th>
+   <th scope="col">Firefox (Gecko)</th>
+   <th scope="col">Internet Explorer</th>
+   <th scope="col">Opera</th>
+   <th scope="col">Safari</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>1.0</td>
+   <td>{{ CompatGeckoDesktop('1.8') }}</td>
+   <td>{{ CompatIE('9.0') }}</td>
+   <td>{{ CompatOpera('8.0') }}</td>
+   <td>{{ CompatSafari('3.0.4') }}</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>{{ CompatAndroid('3.0') }}</td>
+   <td>{{ CompatGeckoMobile('1.8') }}</td>
+   <td>{{ CompatNo() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatSafari('3.0.4') }}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<p>Esta tabla está basada en <a href="/en/SVG/Compatibility_sources" title="en/SVG/Compatibility sources">estos recursos</a>.</p>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{ SVGElement("path") }}</li>
+</ul>
diff --git a/files/es/web/svg/element/style/index.html b/files/es/web/svg/element/style/index.html
new file mode 100644
index 0000000000..f48b22ad0a
--- /dev/null
+++ b/files/es/web/svg/element/style/index.html
@@ -0,0 +1,112 @@
+---
+title: style
+slug: Web/SVG/Element/style
+translation_of: Web/SVG/Element/style
+---
+<div>{{SVGRef}}</div>
+
+<p>El elemento <code>style</code> permite agregar directamente hojas de estilo en el contenido del SVG. El elemento style de SVG tiene los mismos atributos que el elemento correspondiente en HTML (ver elemento  {{ HTMLElement("style") }} de HTML).</p>
+
+<h2 id="Usage_context">Usage context</h2>
+
+<p>{{svginfo}}</p>
+
+<h2 id="Ejemplo">Ejemplo</h2>
+
+<pre class="brush: html">&lt;svg width="100%" height="100%" viewBox="0 0 100 100"
+     xmlns="http://www.w3.org/2000/svg"&gt;
+  &lt;style type="text/css"&gt;
+    /* &lt;![CDATA[ */
+    circle {
+      fill: orange;
+      stroke: black;
+      stroke-width: 10px; // Note that the value of a pixel depend on the viewBox
+    }
+    /* ]]&gt; */
+  &lt;/style&gt;
+
+  &lt;circle cx="50" cy="50" r="40" /&gt;
+&lt;/svg&gt;
+</pre>
+
+<p>Live result:</p>
+
+<p>{{EmbedLiveSample("Ejemplo",150,165)}}</p>
+
+<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">Core attributes</a> »</li>
+</ul>
+
+<h3 id="Atributos_específicos">Atributos específicos</h3>
+
+<ul>
+ <li>{{ SVGAttr("type") }}</li>
+ <li>{{ SVGAttr("media") }}</li>
+ <li>{{ SVGAttr("title") }}</li>
+</ul>
+
+<h2 id="DOM_Interface">DOM Interface</h2>
+
+<p>Este elemento implementa la interfaz <code><a href="/en/DOM/SVGStyleElement" title="en/DOM/SVGStyleElement">SVGStyleElement</a></code>.</p>
+
+<h2 id="Browser_compatibility">Browser compatibility</h2>
+
+<p>{{ CompatibilityTable() }}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th scope="col">Feature</th>
+   <th scope="col">Chrome</th>
+   <th scope="col">Firefox (Gecko)</th>
+   <th scope="col">Internet Explorer</th>
+   <th scope="col">Opera</th>
+   <th scope="col">Safari</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>1.0</td>
+   <td>{{ CompatGeckoDesktop('1.8') }}</td>
+   <td>{{ CompatIE('9.0') }}</td>
+   <td>{{ CompatOpera('9.0') }}</td>
+   <td>{{ CompatSafari('3.0.4') }}</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>{{ CompatAndroid('3.0') }}</td>
+   <td>{{ CompatGeckoMobile('1.8') }}</td>
+   <td>{{ CompatNo() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatSafari('3.0.4') }}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<p>The chart is based on <a href="/en/SVG/Compatibility_sources" title="en/SVG/Compatibility sources">these sources</a>.</p>
+
+<h2 id="See_also">See also</h2>
+
+<ul>
+ <li><a href="/en/HTML/Element/style" title="en/HTML/Element/style">&lt;style&gt; element in HTML</a></li>
+</ul>
diff --git a/files/es/web/svg/element/svg/index.html b/files/es/web/svg/element/svg/index.html
new file mode 100644
index 0000000000..93409888a6
--- /dev/null
+++ b/files/es/web/svg/element/svg/index.html
@@ -0,0 +1,110 @@
+---
+title: <svg>
+slug: Web/SVG/Element/svg
+tags:
+  - Contenedor SVG
+  - Elemento
+  - Referencia
+  - SVG
+  - red
+translation_of: Web/SVG/Element/svg
+---
+<p>El elemento <code>svg</code> es un contenedor que define un nuevo sistema de coordenadas y <a href="/en-US/docs/Web/SVG/Attribute/viewBox">viewport</a>. Es usado como el elemento más externo de cualquier documento SVG, pero también puede ser usado para agregar un fragmento de un SVG dentro de un documento SVG o HTML.</p>
+
+<h2 id="Contexto_de_Uso">Contexto de Uso</h2>
+
+<p>{{svginfo}}</p>
+
+<h2 id="Ejemplo">Ejemplo</h2>
+
+<p>Considere la sigiente imagen SVG (representando la bandera nacional de Italia):</p>
+
+<pre class="brush: xml notranslate">&lt;svg xmlns="http://www.w3.org/2000/svg"
+     width="150" height="100" viewBox="0 0 3 2"&gt;
+
+  &lt;rect width="1" height="2" x="0" fill="#008d46" /&gt;
+  &lt;rect width="1" height="2" x="1" fill="#ffffff" /&gt;
+  &lt;rect width="1" height="2" x="2" fill="#d2232c" /&gt;
+&lt;/svg&gt;</pre>
+
+<p>Esta puede ser incluida en un docuemnto HTML5 de la siguiente manera:</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;HTML/SVG Example&lt;/title&gt;
+&lt;/head&gt;
+
+&lt;body&gt;
+
+  &lt;svg width="150" height="100" viewBox="0 0 3 2"&gt;
+    &lt;rect width="1" height="2" x="0" fill="#008d46" /&gt;
+    &lt;rect width="1" height="2" x="1" fill="#ffffff" /&gt;
+    &lt;rect width="1" height="2" x="2" fill="#d2232c" /&gt;
+  &lt;/svg&gt;
+
+&lt;/body&gt;
+&lt;/html&gt;</pre>
+
+<h2 id="Atributos">Atributos</h2>
+
+<h3 id="Atributos_Globales">Atributos Globales</h3>
+
+<ul>
+ <li><a href="/en-US/docs/Web/SVG/Attribute#ConditionalProccessing">Atributos de procesamiento condicional</a> »</li>
+ <li><a href="/en-US/docs/Web/SVG/Attribute#Core_attributes">Atributo Central</a> »</li>
+ <li><a href="/en-US/docs/Web/SVG/Attribute#DocumentEvent">Atributos de evento del Documento</a> »</li>
+ <li><a href="/en-US/docs/Web/SVG/Attribute#GraphicalEvent">Atributo de Eventos Gráficos</a> »</li>
+ <li><a href="/en-US/docs/Web/SVG/Attribute#Presentation">Atributos de presentación</a> »</li>
+ <li>{{SVGAttr("class")}}</li>
+ <li>{{SVGAttr("style")}}</li>
+ <li>{{SVGAttr("externalResourcesRequired")}}</li>
+</ul>
+
+<h3 id="Specific_attributes">Specific attributes</h3>
+
+<ul>
+ <li>{{SVGAttr("version")}}</li>
+ <li>{{SVGAttr("baseProfile")}}</li>
+ <li>{{SVGAttr("x")}}</li>
+ <li>{{SVGAttr("y")}}</li>
+ <li>{{SVGAttr("width")}}</li>
+ <li>{{SVGAttr("height")}}</li>
+ <li>{{SVGAttr("preserveAspectRatio")}}</li>
+ <li>{{SVGAttr("contentScriptType")}}</li>
+ <li>{{SVGAttr("contentStyleType")}}</li>
+ <li>{{SVGAttr("viewBox")}}</li>
+</ul>
+
+<h2 id="Interfaz_DOM">Interfaz DOM</h2>
+
+<p>Este elemento implementa <code><a href="/en-US/docs/Web/API/SVGSVGElement">SVGSVGElement</a></code> en la interfaz.</p>
+
+<h2 id="Specificaciones">Specificaciones</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Specificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('SVG2', 'struct.html#NewDocument', '&lt;svg&gt;')}}</td>
+   <td>{{Spec2('SVG2')}}</td>
+   <td></td>
+  </tr>
+  <tr>
+   <td>{{SpecName('SVG1.1', 'struct.html#NewDocument', '&lt;svg&gt;')}}</td>
+   <td>{{Spec2('SVG1.1')}}</td>
+   <td>Initial definition</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_de_Navegador">Compatibilidad de Navegador</h2>
+
+<p>{{Compat("svg.elements.svg")}}</p>
diff --git a/files/es/web/svg/element/text/index.html b/files/es/web/svg/element/text/index.html
new file mode 100644
index 0000000000..e694d9dd52
--- /dev/null
+++ b/files/es/web/svg/element/text/index.html
@@ -0,0 +1,152 @@
+---
+title: text
+slug: Web/SVG/Element/text
+translation_of: Web/SVG/Element/text
+---
+<div>{{SVGRef}}</div>
+
+<p>El elemento text define un elemento gráfico que consiste en texto. Nótese que es posible aplicar un degradado, patrón, recorte, máscara o filtro al texto</p>
+
+<h2 id="Uso">Uso</h2>
+
+<p>{{svginfo}}</p>
+
+<h2 id="Ejemplo">Ejemplo</h2>
+
+<pre class="brush: xml">&lt;?xml version="1.0"?&gt;
+&lt;svg xmlns="http://www.w3.org/2000/svg"
+     width="100px" height="30px" viewBox="0 0 1000 300"&gt;
+
+  &lt;text x="250" y="150"
+        font-family="Verdana"
+        font-size="55"&gt;
+    Hello, out there
+  &lt;/text&gt;
+
+  &lt;!-- Show outline of canvas using 'rect' element --&gt;
+  &lt;rect x="1" y="1" width="998" height="298"
+        fill="none" stroke-width="2" /&gt;
+&lt;/svg&gt;
+</pre>
+
+<p>El elemento &lt;text&gt; es usado para dibujar texto. El siguiente código de ejemplo es usado para dibujar texto con coordenadas.</p>
+
+<pre class="brush: xml">&lt;svg xmlns="http://www.w3.org/2000/svg" width="100px" height="50px"&gt;
+  &lt;text x="10" y="20"&gt;SVG Text Example&lt;/text&gt;
+&lt;/svg&gt;
+</pre>
+
+<p>El elemento text puede ser rotado. El siguiente código de ejemplo muestra cómo.</p>
+
+<pre class="brush: xml">&lt;svg xmlns="http://www.w3.org/2000/svg" width="100px" height="50px"&gt;
+  &lt;text x="10"  y="20"
+        transform="rotate(30 20,40)"&gt;
+    SVG Text Rotation example
+  &lt;/text&gt;
+&lt;/svg&gt;
+</pre>
+
+<p>SVG text también puede ser estilizado</p>
+
+<pre class="brush: xml">&lt;svg xmlns="http://www.w3.org/2000/svg" width="100px" height="50px"&gt;
+  &lt;text x="10"  y="20"
+        style="font-family: Times New Roman;
+               font-size  : 24;
+               stroke     : #00ff00;
+               fill       : #0000ff;"&gt;
+    SVG text styling
+  &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#ConditionalProccessing">Atributos de procesamiento condicional »</a></li>
+ <li><a href="/en/SVG/Attribute#Core">Atributos base »</a></li>
+ <li><a href="/en/SVG/Attribute#GraphicalEvent">Atributos de eventos gráficos »</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>
+ <li>{{ SVGAttr("externalResourcesRequired") }}</li>
+ <li>{{ SVGAttr("transform") }}</li>
+</ul>
+
+<h3 id="Atributos_específicos">Atributos específicos</h3>
+
+<ul>
+ <li>{{ SVGAttr("x") }}</li>
+ <li>{{ SVGAttr("y") }}</li>
+ <li>{{ SVGAttr("dx") }}</li>
+ <li>{{ SVGAttr("dy") }}</li>
+ <li>{{ SVGAttr("text-anchor") }}</li>
+ <li>{{ SVGAttr("rotate") }}</li>
+ <li>{{ SVGAttr("textLength") }}</li>
+ <li>{{ SVGAttr("lengthAdjust") }}</li>
+</ul>
+
+<h2 id="Interfaz_DOM">Interfaz DOM</h2>
+
+<p>Este elemento hereda la interfaz de <code><a href="/en/DOM/SVGTextElement" title="en/DOM/SVGTextElement">SVGTextElement</a></code>.</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>IE</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{ CompatChrome('1.0') }}</td>
+   <td>{{ CompatGeckoDesktop('1.8') }}</td>
+   <td>{{ CompatIE('9.0') }}</td>
+   <td>{{ CompatOpera('8.0') }}</td>
+   <td>{{ CompatSafari('3.0.4') }}</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>{{ CompatAndroid('3.0') }}</td>
+   <td>{{ CompatGeckoMobile('1.8') }}</td>
+   <td>{{ CompatNo() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatSafari('3.0.4') }}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<p>La gráfica está basada en  <a href="/en/SVG/Compatibility_sources" title="en/SVG/Compatibility sources">estas fuentes</a>.</p>
+
+<h2 id="Relacionados">Relacionados</h2>
+
+<ul>
+ <li>{{ SVGElement("tspan") }}</li>
+ <li>{{ SVGElement("tref") }}</li>
+ <li>{{ SVGElement("altGlyph") }}</li>
+</ul>
diff --git a/files/es/web/svg/element/use/index.html b/files/es/web/svg/element/use/index.html
new file mode 100644
index 0000000000..32c7a4c086
--- /dev/null
+++ b/files/es/web/svg/element/use/index.html
@@ -0,0 +1,154 @@
+---
+title: <use>
+slug: Web/SVG/Element/use
+tags:
+  - Elementos
+  - Gráficos SVG
+  - Referencia
+  - SVG
+translation_of: Web/SVG/Element/use
+---
+<div>{{SVGRef}}</div>
+
+<p>El elemento <code>use</code> toma los nodos que están dentro del documento SVG y duplica el contenido donde éste esté siendo utilizado. El efecto es el mismo, como si éstos nodos hubiesen sido profundamente clonados en un elemento DOM no expuesto, y luego pegados donde se encuentra el elemeto <code>use</code>, al igual que los <a href="/en-US/docs/Web/HTML/Element/template">elementos plantilla</a> son clonados en HTML5. Desde que los elementos clonados no sean expuestos como DOM, su cuidado debe tomarse en cuenta durante el uso de <a href="/en/CSS" title="en/CSS">CSS</a> para estilizar un elemento <code>use</code> y sus descendientes ocultos. Los atributos CSS no ofrecen la garantía de heredarse en los elementos DOM clonados y escondidos, a no ser que lo realice utilizando <a href="/en/CSS/inheritance" title="en/CSS/inheritance">herencia CSS</a>.</p>
+
+<p>Por razones de seguridad, algunos navegadores podrían aplicar una política del mismo origen sobre los elementos <code>use</code> y podrían negarse a cargar una URI de origen cruzado dentro del atributo <code>xlink:href</code>.</p>
+
+<h2 id="Contexto_de_uso">Contexto de uso</h2>
+
+<p>{{svginfo}}</p>
+
+<h2 id="Ejemplo">Ejemplo</h2>
+
+<pre class="brush: xml" id="Attributes">&lt;svg width="100%" height="100%" xmlns="<a href="http://www.w3.org/2000/svg">http://www.w3.org/2000/svg</a>" xmlns:xlink="<a href="http://www.w3.org/1999/xlink">http://www.w3.org/1999/xlink</a>"&gt;
+  &lt;style&gt;
+    .classA { fill:red }
+  &lt;/style&gt;
+  &lt;defs&gt;
+    &lt;g id="Port"&gt;
+      &lt;circle style="fill:inherit" r="10"/&gt;
+    &lt;/g&gt;
+  &lt;/defs&gt;
+
+  &lt;text y="15"&gt;black&lt;/text&gt;
+  &lt;use x="50" y="10" xlink:href="#Port" /&gt;
+  &lt;text y="35"&gt;red&lt;/text&gt;
+  &lt;use x="50" y="30" xlink:href="#Port" class="classA"/&gt;
+  &lt;text y="55"&gt;blue&lt;/text&gt;
+  &lt;use x="50" y="50" xlink:href="#Port" style="fill:blue"/&gt;
+ &lt;/svg&gt;
+</pre>
+
+<p> </p>
+
+<h2 id="Atributos">Atributos</h2>
+
+<h3 id="Atributos_Globales">Atributos Globales</h3>
+
+<ul>
+ <li><a href="/en/SVG/Attribute#ConditionalProccessing" title="en/SVG/Attribute#ConditionalProccessing">Atributos de procesamiento condicional</a> »</li>
+ <li><a href="/en/SVG/Attribute#Core" title="en/SVG/Attribute#Core">Atributos núcleo</a> »</li>
+ <li><a href="/en/SVG/Attribute#GraphicalEvent" title="en/SVG/Attribute#GraphicalEvent">Atributos de eventos gráficos</a> »</li>
+ <li><a href="/en/SVG/Attribute#Presentation" title="en/SVG/Attribute#Presentation">Atributos de presentación</a> »</li>
+ <li><a href="/en/SVG/Attribute#XLink" title="en/SVG/Attribute#XLink">Atributos Xlink</a> »</li>
+ <li>{{ SVGAttr("class") }}</li>
+ <li>{{ SVGAttr("style") }}</li>
+ <li>{{ SVGAttr("externalResourcesRequired") }}</li>
+ <li>{{ SVGAttr("transform") }}</li>
+</ul>
+
+<h3 id="Atributos_específicos">Atributos específicos</h3>
+
+<ul>
+ <li>{{ SVGAttr("x") }}</li>
+ <li>{{ SVGAttr("y") }}</li>
+ <li>{{ SVGAttr("width") }}</li>
+ <li>{{ SVGAttr("height") }}</li>
+ <li>{{ SVGAttr("xlink:href") }}</li>
+</ul>
+
+<h2 id="Interfaz_DOM">Interfaz DOM</h2>
+
+<p>Este elemento implementa la interface <code><a href="/en/DOM/SVGUseElement" title="en/DOM/SVGUseElement">SVGUseElement</a></code>.</p>
+
+<h2 id="Browser_compatibility" name="Browser_compatibility">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 (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>
+  <tr>
+   <td>Carga desde una URL externa</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{CompatNo()}}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+  </tr>
+  <tr>
+   <td>Carga desde dato: URI</td>
+   <td>{{ CompatUnknown() }}</td>
+   <td>{{ CompatGeckoDesktop("10.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>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+  </tr>
+  <tr>
+   <td>Carga desde una URL externa</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+  </tr>
+  <tr>
+   <td>Carga desde dato: URI</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
diff --git a/files/es/web/svg/index.html b/files/es/web/svg/index.html
new file mode 100644
index 0000000000..642ed8aedf
--- /dev/null
+++ b/files/es/web/svg/index.html
@@ -0,0 +1,110 @@
+---
+title: SVG
+slug: Web/SVG
+tags:
+  - Gráficos 2D
+  - Gráficos(2)
+  - SVG
+  - Todas_las_Categorías
+  - Web
+translation_of: Web/SVG
+---
+<div class="callout-box"><strong><a class="external" href="/es-ES/docs/SVG/Tutorial">Comenzando con SVG</a></strong><br>
+Este tutorial te ayudará a comenzar a usar SVG.</div>
+
+<p class="summary"><span class="seoSummary"><strong>Gráficos vectoriales escalables</strong> <strong>(SVG)</strong> es un lenguaje de marcado <a href="/es/docs/XML_Introduction" hreflang="es">XML</a> para describir <a href="https://es.wikipedia.org/wiki/Gr%C3%A1fico_vectorial">gráficos vectoriales </a>en dos dimensiones.</span> Básicamente, es a los gráficos lo que <a href="/es/docs/web/HTML" hreflang="es">HTML</a> es al texto.</p>
+
+<p>SVG es un estándar Web abierto basado en texto. Está expresamente diseñado para trabajar con otros estándares web como <a href="/es/docs/CSS" lang="es" title="es/docs/CSS">CSS</a>, <a href="/es/docs/DOM" lang="es" title="es/docs/DOM">DOM</a>, y <a href="/es/docs/Web/SVG/SVG_animation_with_SMIL" lang="es" title="es/docs/Web/SVG/SVG_animation_with_SMIL">SMIL</a>.</p>
+
+<p><span class="comment">&lt;br style="clear:both;" /&gt;</span></p>
+
+<table class="topicpage-table">
+ <tbody>
+  <tr>
+   <td>
+    <h2 id="Documentaci.C3.B3n" name="Documentaci.C3.B3n">Documentación</h2>
+
+    <dl>
+     <dt><a href="/es-ES/docs/Web/SVG/Element">Referencia de elementos SVG</a></dt>
+     <dd>Detalles sobre cada uno de los elementos SVG.</dd>
+     <dt><a href="/es-ES/docs/Web/SVG/Attribute">Referencia de atributos SVG</a></dt>
+     <dd>Detalles sobre cada uno de los atributos SVG.</dd>
+     <dt><a href="/es-ES/docs/DOM/DOM_Reference#SVG_interfaces">Referencia del interfaz DOM SVG</a></dt>
+     <dd>Detalles acerca del API SVG DOM, para interacción con JavaScript.</dd>
+     <dt><a href="/es-ES/docs/Web/SVG/Applying_SVG_effects_to_HTML_content">Aplicando efectos SVG a contenido HTML</a></dt>
+     <dd>SVG trabaja con with {{Glossary("HTML")}}, {{Glossary("CSS")}} and {{Glossary("JavaScript")}}. Usa SVG para <a href="/es-ES/docs/SVG_In_HTML_Introduction">mejorar una página HTML normal o aplicación web</a>.</dd>
+     <dt>
+     <p><span class="alllinks"><a href="/es-ES/docs/tag/SVG">Ver más...</a></span></p>
+     </dt>
+     <dt>
+     <h2 class="Community" id="Comunidad">Comunidad</h2>
+     Ver foros de Mozilla... {{DiscussionList("dev-tech-svg", "mozilla.dev.tech.svg")}}</dt>
+     <dd> </dd>
+    </dl>
+
+    <h2 class="Tools" id="Herramientas">Herramientas</h2>
+
+    <ul>
+     <li><small><a href="http://www.w3.org/Graphics/SVG/Test/">Área de pruebas SVG</a> </small></li>
+     <li><small><a href="http://jiggles.w3.org/svgvalidator/">Validador SVG</a> (Discontinuado) </small></li>
+     <li><small><a href="/es-ES/docs/tag/SVG:Tools">Más Herramientas...</a> </small></li>
+     <li><small>Otros recursos: <a href="/es-ES/docs/XML">XML</a>, <a href="/es-ES/docs/CSS">CSS</a>, <a href="/es-ES/docs/DOM">DOM</a>, <a href="/es-ES/docs/HTML/Canvas">Canvas</a> </small></li>
+    </ul>
+   </td>
+   <td>
+    <h2 id="Ejemplos">Ejemplos</h2>
+
+    <div class="section">
+    <ul>
+     <li>Google <a href="https://maps.google.com">Maps</a> (superposición de rutas) &amp; <a href="https://docs.google.com">Docs</a> (gráficos con hojas de cálculo)</li>
+     <li><a href="http://starkravingfinkle.org/projects/demo/svg-bubblemenu-in-html.xml">Menús SVG de burbuja</a></li>
+     <li><a href="http://jwatt.org/svg/authoring/">Directríces de autoría de SVG</a></li>
+     <li>Una visión general del <a href="/es-ES/docs/Mozilla_SVG_Project">Proyecto SVG de Mozilla</a></li>
+     <li><a href="/es-ES/docs/SVG/FAQ">Preguntas frecuentes</a> acerca de SVG y Mozilla</li>
+     <li>Diapositivas y demos de la charla sobre <a href="http://jwatt.org/svg-open-US/docs/2009/slides.xhtml">SVG y Mozilla</a> en el SVG Open 2009</li>
+     <li><a href="/es-ES/docs/SVG/SVG_as_an_Image">SVG como imagen</a></li>
+     <li><a href="/es-ES/docs/SVG/SVG_animation_with_SMIL">Animación SVG con SMIL</a></li>
+     <li><a href="http://plurib.us/1shot/2007/svg_gallery/">Galería de arte SVG</a></li>
+     <li>Más ejemplos (<a href="http://www.carto.net/papers/svg/samples/">carto.net</a>)</li>
+    </ul>
+
+    <p> </p>
+
+    <h3 id="Animaciones_e_interacciones">Animaciones e interacciones</h3>
+
+    <p>Al igual que HTML, SVG tiene un modelo de objetos de documento (DOM) y eventos, y es accesible desde JavaScript. Esto permite al desarrollador crear animaciones ricas y permite e imágenes interactivas.</p>
+
+    <ul>
+     <li>Algunos SVG muy atractivos en <a href="http://svg-wow.org/">svg-wow.org</a></li>
+     <li>Extension Firefox (<a href="http://schepers.cc/grafox/">Grafox</a>) para añadir soporte al subconjunto de animación {{Glossary("SMIL")}}</li>
+     <li>Manipulación interactiva de <a href="http://people.mozilla.com/%7Evladimir/demos/photos.svg">fotos</a></li>
+     <li><a href="http://starkravingfinkle.org/blog/2007/07/firefox-3-svg-foreignobject/">Transformaciones HTML</a> usando <code>foreignObject</code> de SVG</li>
+    </ul>
+
+    <p> </p>
+
+    <h3 id="Mapeado_gráficos_juegos_y_experimentos_3D">Mapeado, gráficos, juegos y experimentos 3D</h3>
+
+    <p>Aunque un poco de SVG puede dar mucho recorrido a la hora de mejorar contenidos web, aquí tienes algunos ejemplos de uso de gran cantidad de SVG.</p>
+
+    <ul>
+     <li><a href="http://www.codedread.com/yastframe.php">Tetris</a></li>
+     <li><a href="https://web.archive.org/web/20131019072450/http://www.treebuilder.de/svg/connect4.svg" title="Archive link provided because source now requires authentication.">Connect 4</a></li>
+     <li><a href="http://www.carto.net/papers/svg/us_population/index.html">Mapa de población de los Estados Unidos de América</a></li>
+     <li><a href="http://www.treebuilder.de/default.asp?file=441875.xml">Caja 3D box</a> y <a href="http://www.treebuilder.de/default.asp?file=206524.xml">Cajas 3D</a></li>
+     <li><a href="http://jvectormap.com/">jVectorMap</a> (mapas interactivos para visualización de datos)</li>
+     <li><a href="http://jointjs.com">JointJS</a> (JavaScript libreria de creación de diagramas con JavaScript)</li>
+    </ul>
+    </div>
+   </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( { "en": "en/SVG", "fr": "fr/SVG", "it": "it/SVG", "ja": "ja/SVG", "pl": "pl/SVG", "pt": "pt/SVG" } ) }}</p>
diff --git a/files/es/web/svg/index/index.html b/files/es/web/svg/index/index.html
new file mode 100644
index 0000000000..a9cf2d3736
--- /dev/null
+++ b/files/es/web/svg/index/index.html
@@ -0,0 +1,6 @@
+---
+title: SVG documentation index
+slug: Web/SVG/Index
+translation_of: Web/SVG/Index
+---
+<p>{{Index("/en-US/docs/Web/SVG")}}</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
new file mode 100644
index 0000000000..f2d954e573
--- /dev/null
+++ b/files/es/web/svg/svg_en_firefox_1.5/index.html
@@ -0,0 +1,60 @@
+---
+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/getting_started/index.html b/files/es/web/svg/tutorial/getting_started/index.html
new file mode 100644
index 0000000000..c4a332ed02
--- /dev/null
+++ b/files/es/web/svg/tutorial/getting_started/index.html
@@ -0,0 +1,96 @@
+---
+title: Getting Started
+slug: Web/SVG/Tutorial/Getting_Started
+translation_of: Web/SVG/Tutorial/Getting_Started
+---
+<p>{{ PreviousNext("SVG/Tutorial/Introduction", "SVG/Tutorial/Positions") }}</p>
+
+<h3 id="A_Simple_Example" name="A_Simple_Example">Un Ejemplo Simple</h3>
+
+<p>Permitanos introducirlo con un sencillo ejemplo. Mire el siguiente codigo :</p>
+
+<pre class="brush: xml">&lt;svg version="1.1"
+     baseProfile="full"
+     width="300" height="200"
+     xmlns="http://www.w3.org/2000/svg"&gt;
+
+  &lt;rect width="100%" height="100%" fill="red" /&gt;
+
+  &lt;circle cx="150" cy="100" r="80" fill="green" /&gt;
+
+  &lt;text x="150" y="125" font-size="60" text-anchor="middle" fill="white"&gt;SVG&lt;/text&gt;
+
+&lt;/svg&gt;
+</pre>
+
+<p>Copie el código y guárdelo como demo1.svg. Luego ábralo en Firefox. Lo verá como se ve en la siguiente figura. (usuarios Firefox : click <a class="external" href="http://developer.mozilla.org/@api/deki/files/4571/=svgdemo1.xml" title="http://developer.mozilla.org/@api/deki/files/4571/=svgdemo1.xml">aqui</a>)</p>
+
+<p><img alt="svgdemo1.png" class="default internal" src="/@api/deki/files/4928/=svgdemo1.png"></p>
+
+<p>El proceso de renderizado incluye lo siguiente :</p>
+
+<ol>
+ <li>Comenzamos con el elemento raiz del <code>svg</code>:
+
+  <ul>
+   <li>La declaracion de tipo de documento (doctype) usual en  (X)HTML debería dejarse de lado debido a que la  validación DTD based SVG conduce a mas problemas que soluciones.</li>
+   <li>En cambio,  los atributos <code>version</code> y <code>baseProfile </code>deberian ser usados siempre para identificar la version de SVG para otro tipo de validaciones.</li>
+   <li>Debido a SVG es una especie de dialecto de XML, SVG debe unir siempre los namespaces correctamente (en el atributo xmlns). Para mayor información, vea  <a href="/en/docs/Web/SVG/Namespaces_Crash_Course" title="en/SVG/Namespaces_Crash_Course">Namespaces Crash Course</a>.</li>
+  </ul>
+ </li>
+ <li>El fondo esta puesto en rojo dibujando un rectangulo <a href="/en/SVG/Element/rect" title="en/SVG/Element/rect"><code>&lt;rect/&gt;</code></a> que cubre el area de la imagen.</li>
+ <li>Un circulo verde <a href="/en/SVG/Element/circle" title="en/SVG/Element/circle"><code>&lt;circle/&gt;</code></a> con un radio de 80px y se dibuja en el centro del rectangulo rojo(offset 30+120px inward, and 50+50px upward).</li>
+ <li>El texto "SVG" esta dibujado. El interior de cada letra esta relleno con blanco.
+  <div id="gt-src-tools">
+  <div dir="ltr" style="zoom: 1;"><span id="result_box" lang="es"><span class="hps">El texto</span> <span class="hps">se coloca</span> <span class="hps">mediante el establecimiento de</span> <span class="hps">un ancla</span> <span class="hps">en</span> <span class="hps">donde queremos que</span> <span class="hps">el punto medio</span> <span class="hps">sea</span><span>:</span></span> en este caso, el punto medio debe corresponder al centro del circulo verde. <span id="result_box" lang="es"><span class="hps">Los ajustes finos</span> <span class="hps">se pueden hacer</span> <span class="hps">con el</span> <span class="hps">tamaño de la fuente</span> <span class="hps">y la posición</span> <span class="hps">vertical para</span> <span class="hps">garantizar</span> <span class="hps">que el resultado final sea</span> <span class="hps">estéticamente agradable.</span></span></div>
+  </div>
+ </li>
+</ol>
+
+<h3 id="Basic_properties_of_SVG_files">Basic properties of SVG files</h3>
+
+<ul>
+ <li>The first important thing to notice is the order of rendering of elements. The globally valid rule for SVG files is, that <em>later</em> elements are rendered <em>atop previous</em> elements. The further down an element is the more will be visible.</li>
+ <li>SVG files on the web can be displayed directly in the browser or embedded in HTML files via several methods:
+  <ul>
+   <li>If the HTML is XHTML and is delivered as type <code>application/xhtml+xml</code>, the SVG can be directly embedded in the XML source.</li>
+   <li>If the HTML is HTML5, and the browser is a conforming HTML5 browser, the SVG can be directly embedded, too. However, there may be syntax changes necessary to conform to the HTML5 specification</li>
+   <li>The SVG file can be referenced with an <code>object</code> element:
+    <pre>        &lt;object data="image.svg" type="image/svg+xml" /&gt;</pre>
+   </li>
+   <li>Likewise an <code>iframe</code> element can be used:
+    <pre>        &lt;iframe src="image.svg"&gt;&lt;/iframe&gt;</pre>
+   </li>
+   <li>An <code>img</code> element can be used theoretically, too. However this technique doesn't work in Firefox before 4.0.</li>
+   <li>Finally SVG can be created dynamically with JavaScript and injected into the HTML DOM. This has the advantage, that replacement technologies for browsers, that can't process SVG, can be implemented.</li>
+  </ul>
+  See <a href="/en/SVG_In_HTML_Introduction" title="en/svg in html introduction">this dedicated article</a> for an in-depth dealing with the topic.</li>
+ <li>How SVG handles sizes and units will be explained <a href="/en/SVG/Tutorial/Positions" title="en/SVG/Tutorial/Positions">on the next page</a>.</li>
+</ul>
+
+<h3 id="SVG_File_Types" name="SVG_File_Types">SVG File Types</h3>
+
+<p>SVG files come in two flavors. Normal SVG files are simple text files containing SVG markup. The recommended filename extension for these files is ".svg" (all lowercase).</p>
+
+<p>Due to the potentially massive size SVG files can reach when used for some applications (e.g., geographical applications), the SVG specification also allows for gzip-compressed SVG files. The recommended filename extension for these files is ".svgz" (all lowercase). Unfortunately it is very problematic to get gzip-compressed SVG files to work reliably across all SVG capable user agents when served from Microsofts IIS server, and Firefox can not load gzip-compressed SVG from the local computer. Avoid gzip-compressed SVG except when you are publishing to a webserver that you know will serve it correctly (see below).</p>
+
+<h3 id="A_Word_on_Webservers" name="A_Word_on_Webservers">A Word on Webservers</h3>
+
+<p>Now that you have an idea of how to create basic SVG files, the next stage is to upload them to a Webserver. There are some gotchas at this stage though. For normal SVG files, servers should send the HTTP header:</p>
+
+<pre>Content-Type: image/svg+xml
+</pre>
+
+<p>For gzip-compressed SVG files, servers should send the HTTP headers:</p>
+
+<pre>Content-Type: image/svg+xml
+Content-Encoding: gzip
+</pre>
+
+<p>You can check that your server is sending the correct HTTP headers with your SVG files by using a site such as <a class="external" href="http://web-sniffer.net/">web-sniffer.net</a>. Submit the URL of one of your SVG files and look at the HTTP response headers. If you find that your server is not sending the headers with the values given above, then you should contact your Web host. If you have problems convincing them to correctly configure their servers for SVG, there may be ways to do it yourself. See the <a class="external" href="http://svg-whiz.com/wiki/index.php?title=Server_Configuration">server configuration page</a> on the SVG wiki for a range of simple solutions.</p>
+
+<p>Server misconfiguration is a very common reason for SVG failing to load, so make sure you check yours. If your server is not configured to send the correct headers with the SVG files it serves, then Firefox will most likely show the markup of the files as text or encoded garbage, or even ask the viewer to choose an application to open them.</p>
+
+<p>{{ PreviousNext("SVG/Tutorial/Introduction", "SVG/Tutorial/Positions") }}</p>
+
+<p>{{ languages( { "fr": "fr/SVG/Tutoriel/Premiers_pas", "ja": "ja/SVG/Tutorial/Getting_Started" } ) }}</p>
diff --git a/files/es/web/svg/tutorial/index.html b/files/es/web/svg/tutorial/index.html
new file mode 100644
index 0000000000..e1a2b9a408
--- /dev/null
+++ b/files/es/web/svg/tutorial/index.html
@@ -0,0 +1,57 @@
+---
+title: Tutorial de SVG
+slug: Web/SVG/Tutorial
+tags:
+  - Intermedio
+  - NeedsTranslation
+  - NesecitaActualizacion
+  - NesecitaAyuda
+  - NesecitaContenido
+  - SVG
+  - TopicStub
+  - Tutorial de SVG
+translation_of: Web/SVG/Tutorial
+---
+<p>Los graficos de vectores escalables, SVG , es un dialecto XML de W#C usado para describir graficos. Esta parcialente implementado en Firefox, Opera, WebKit , Internet Explorer y otros.</p>
+
+<p>Este tutorial intenta explicar SVG a profundidad y esta elaborado con detalles tecnicos. Si quieres dibujar hermosas imagenes, podras encontrar recursos mas utiles en la <a href="https://inkscape.org/en/learn/">Documentacion de Inkscape</a> . Otra buena introduccion es brindada por el W3C's <a href="http://www.w3.org/Graphics/SVG/IG/resources/svgprimer.html"> SVG Primer</a> . </p>
+
+<h5 id="Presentando_SVG_desde_cero">Presentando SVG desde cero</h5>
+
+<ul>
+ <li><a href="/en-US/SVG/Tutorial/Introduction" title="en-US/SVG/Tutorial/Introduction">Introducción</a></li>
+ <li><a href="/en-US/SVG/Tutorial/Getting_Started" title="en-US/SVG/Tutorial/Getting_Started">Comenzando</a></li>
+ <li><a href="/en-US/SVG/Tutorial/Positions" title="en-US/SVG/Tutorial/Positions">Posiciones</a></li>
+ <li><a href="/en-US/SVG/Tutorial/Basic_Shapes" title="en-US/SVG/Tutorial/Basic_Shapes">Figuras básicas</a></li>
+ <li><a href="/en-US/SVG/Tutorial/Paths" title="en-US/SVG/Tutorial/Paths">Paths</a></li>
+ <li><a href="/en-US/SVG/Tutorial/Fills_and_Strokes" title="en-US/SVG/Tutorial/Fills_and_Strokes">Rellenos y trazos</a></li>
+ <li><a href="/en-US/SVG/Tutorial/Gradients" title="en-US/SVG/Tutorial/Gradients">Gradientes</a></li>
+ <li><a href="/en-US/SVG/Tutorial/Patterns" title="en-US/SVG/Tutorial/Patterns">Patrones</a></li>
+ <li><a href="/en-US/SVG/Tutorial/Texts" title="en-US/SVG/Tutorial/Texts">Textos</a></li>
+ <li><a href="/en-US/SVG/Tutorial/Basic_Transformations" title="en-US/SVG/Tutorial/Basic_Transformations">Transformaciones básicas</a></li>
+ <li><a href="/en-US/SVG/Tutorial/Clipping_and_masking" title="en-US/SVG/Tutorial/Clipping_and_masking">Recortes y máscaras</a></li>
+ <li><a href="/en-US/SVG/Tutorial/Other_content_in_SVG" title="en-US/SVG/Tutorial/Other content in SVG">Otros contenidos en SVG</a></li>
+ <li><a href="/en-US/SVG/Tutorial/Filter_effects" title="en-US/SVG/Tutorial/Filter effects">Filtros y efectos</a></li>
+ <li><a href="/en-US/SVG/Tutorial/SVG_fonts" title="en-US/SVG/Tutorial/SVG fonts">Fuentes SVG</a></li>
+ <li><a href="/en-US/SVG/Tutorial/SVG_Image_Tag" title="en-US/SVG/Tutorial/SVG Image Tag">Etiquetas de imágenes SVG</a></li>
+ <li><a href="/en-US/SVG/Tutorial/Tools_for_SVG" title="en-US/SVG/Tutorial/Tools_for_SVG">Herramientas de SVG</a></li>
+ <li><a href="https://developer.mozilla.org/en-US/docs/Web/SVG/Tutorial/Other_content_in_SVG" title="en-US/SVG/Tutorial/Other_Tutorials">Otros tutoriales</a></li>
+</ul>
+
+<p>Los siguientes temas son más avanzados, por lo tanto deben tener sus propios tutoriales.</p>
+
+<h5 id="Scripting_SVG_con_JavaScript">Scripting SVG con JavaScript</h5>
+
+<p>TBD</p>
+
+<h5 id="Tutorial_filtros_SVG">Tutorial filtros SVG</h5>
+
+<p>TBD</p>
+
+<h5 id="Animaciones_con_SMIL_en_SVG">Animaciones con SMIL en SVG</h5>
+
+<p>TBD</p>
+
+<h5 id="Creación_de_fuentes_en_SVG">Creación de fuentes en SVG</h5>
+
+<p>TBD</p>
diff --git a/files/es/web/svg/tutorial/introducción/index.html b/files/es/web/svg/tutorial/introducción/index.html
new file mode 100644
index 0000000000..759ef2dbf9
--- /dev/null
+++ b/files/es/web/svg/tutorial/introducción/index.html
@@ -0,0 +1,45 @@
+---
+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/svg_in_html_introduction/index.html b/files/es/web/svg/tutorial/svg_in_html_introduction/index.html
new file mode 100644
index 0000000000..ff4bede205
--- /dev/null
+++ b/files/es/web/svg/tutorial/svg_in_html_introduction/index.html
@@ -0,0 +1,95 @@
+---
+title: SVG In HTML Introduction
+slug: Web/SVG/Tutorial/SVG_In_HTML_Introduction
+translation_of: Web/SVG/Tutorial/SVG_In_HTML_Introduction
+---
+<h2 id="Overview" name="Overview">Overview</h2>
+
+<p>This article and its associated example shows how to use inline <a href="/en-US/docs/SVG" title="SVG">SVG</a> to provide a background picture for a form. It shows how <a href="/en-US/docs/JavaScript" title="JavaScript">JavaScript</a> and <a href="/en-US/docs/CSS" title="CSS">CSS</a> can be used to manipulate the picture in the same way you would script regular XHTML. Note that the example will only work in browsers that support XHTML (not HTML) and SVG integration.</p>
+
+<h2 id="Source" name="Source">Source</h2>
+
+<p>Here is the source to <a class="external" href="/presentations/xtech2005/svg-canvas/SVGDemo.xml" title="presentations/xtech2005/svg-canvas/SVGDemo.xml">the example</a>:</p>
+
+<pre class="brush: html">&lt;html xmlns="http://www.w3.org/1999/xhtml"&gt;
+&lt;head&gt;
+&lt;title&gt;XTech SVG Demo&lt;/title&gt;
+&lt;style&gt;
+  stop.begin { stop-color:yellow; }
+  stop.end { stop-color:green; }
+  body.invalid stop.end { stop-color:red; }
+  #err { display:none; }
+  body.invalid #err { display:inline; }
+&lt;/style&gt;
+&lt;script&gt;
+  function signalError() {
+    document.getElementById('body').setAttribute("class", "invalid");
+  }
+&lt;/script&gt;
+&lt;/head&gt;
+&lt;body id="body"
+  style="position:absolute; z-index:0; border:1px solid black; left:5%; top:5%; width:90%; height:90%;"&gt;
+&lt;form&gt;
+  &lt;fieldset&gt;
+    &lt;legend&gt;HTML Form&lt;/legend&gt;
+    &lt;p&gt;&lt;label&gt;Enter something:&lt;/label&gt;
+    &lt;input type="text"/&gt;
+    &lt;span id="err"&gt;Incorrect value!&lt;/span&gt;&lt;/p&gt;
+    &lt;p&gt;&lt;input type="button" value="Activate!" onclick="signalError();" /&gt;&lt;/p&gt;
+  &lt;/fieldset&gt;
+&lt;/form&gt;
+
+&lt;svg xmlns="http://www.w3.org/2000/svg" version="1.1"
+  viewBox="0 0 100 100" preserveAspectRatio="xMidYMid slice"
+  style="width:100%; height:100%; position:absolute; top:0; left:0; z-index:-1;"&gt;
+  &lt;linearGradient id="gradient"&gt;
+    &lt;stop class="begin" offset="0%"/&gt;
+    &lt;stop class="end" offset="100%"/&gt;
+  &lt;/linearGradient&gt;
+  &lt;rect x="0" y="0" width="100" height="100" style="fill:url(#gradient)" /&gt;
+  &lt;circle cx="50" cy="50" r="30" style="fill:url(#gradient)" /&gt;
+&lt;/svg&gt;
+&lt;/body&gt;
+&lt;/html&gt;
+</pre>
+
+<h2 id="Discussion" name="Discussion">Discussion</h2>
+
+<p>The page is mainly regular XHTML, CSS and JavaScript. The only interesting part is the &lt;svg&gt; element it contains. This element and its children are declared to be in the SVG namespace. The element contains a gradient and two shapes filled with the gradient. The gradient color stops have their colors set by CSS. When the user enters something incorrect into the form, the script sets the <code>invalid</code> attribute on the &lt;body&gt;, and a style rule changes the gradient <code>end-stop</code> color to red. (Another style rule makes an error message appear.)</p>
+
+<p>This approach has the following points in its favor:</p>
+
+<ul>
+ <li>We have taken a regular XHTML form that could have been part of an existing Web site, and added an attractive, interactive background</li>
+ <li>The approach is backwards compatible to browsers that do not support SVG; simply, no background appears in them</li>
+ <li>It's very simple and performs very well</li>
+ <li>The picture dynamically sizes itself to the required size in an intelligent way</li>
+ <li>We can have declarative style rules applying to both HTML and SVG</li>
+ <li>The same script manipulates both HTML and SVG</li>
+ <li>The document is entirely standards-based</li>
+</ul>
+
+<div class="note">
+<p>To add a linked image with DOM methods to an embedded SVG element, one has to use <code>setAttributeNS</code> to set <code>href</code>. Like in the following example:</p>
+
+<pre class="brush: js"> var img = document.createElementNS("http://www.w3.org/2000/svg", "image");
+img.setAttributeNS("http://www.w3.org/1999/xlink", "xlink:href", "move.png");
+
+
+</pre>
+</div>
+
+<h2 id="Details" name="Details">Details</h2>
+
+<p>The <code>viewBox</code> attribute establishes a logical coordinate system which the SVG picture's coordinates are relative to. In this case our picture is laid out in a 100 by 100 viewport.</p>
+
+<p>The <code>preserveAspectRatio</code> attribute specifies that the aspect ratio must be preserved by centering the picture in the available size, sizing to the maximum of the height or width and then cutting off any overflow.</p>
+
+<p>The <code>style</code> attribute pins the SVG element to the background of the form.</p>
+
+<h2 id="Related_Links" name="Related_Links">Related Links</h2>
+
+<ul>
+ <li>Another SVG in XHTML example: <a href="/en-US/docs/SVG/Namespaces_Crash_Course/Example" title="SVG/Namespaces_Crash_Course/Example">A swarm of motes</a></li>
+ <li><a class="external" href="http://jwatt.org/svg/demos/xhtml-with-inline-svg.xhtml">Working example</a> that works in both Mozilla and in Internet Explorer with Adobe's SVG Viewer installed. (For inline SVG to work in both Firefox and Internet Explorer it is necessary to serve documents with a different Content-Type to each browser. For this reason, if you're behind a proxy server that caches the page, the example wont work in the second browser you load it in because it will receive the wrong Content-Type.)</li>
+</ul>
diff --git a/files/es/web/svg/tutorial/tools_for_svg/index.html b/files/es/web/svg/tutorial/tools_for_svg/index.html
new file mode 100644
index 0000000000..99c50f9aed
--- /dev/null
+++ b/files/es/web/svg/tutorial/tools_for_svg/index.html
@@ -0,0 +1,74 @@
+---
+title: Tools for SVG
+slug: Web/SVG/Tutorial/Tools_for_SVG
+translation_of: Web/SVG/Tutorial/Tools_for_SVG
+---
+<p>{{ PreviousNext("Web/SVG/Tutorial/SVG_Image_Tag") }}</p>
+
+<p> </p>
+
+<p>Ahora que hemos cubierto los aspectos básicos de los componentes internos de SVG, analizaremos algunas herramientas para trabajar con archivos SVG.</p>
+
+<h3 id="Browser_support">Browser support</h3>
+
+<p>A partir de Internet Explorer 9, la mayoria de los navegadores soportan SVG: IE 9, Mozilla Firefox, Safari, Google Chrome y Opera. Los dispositivos mobiles que estan basado en los navegadores Webkit tambien soportan SVG. En dispositivos más antiguos o más pequeños, es probable que se admita SVG Tiny</p>
+
+<h2 id="Inkscape">Inkscape</h2>
+
+<p>URL: <a class="external" href="http://www.inkscape.org" title="http://www.inkscape.org/">www.inkscape.org</a></p>
+
+<p>Una de las herramientas más importantes para un formato de gráficos es un programa de dibujo decente. Inkscape ofrece dibujos vectoriales de última generación, y es de código abierto.</p>
+
+<p>Además, utiliza SVG como su formato de archivo nativo. Para almacenar datos específicos de Inkscape, extiende el archivo SVG con elementos y atributos en un espacio de nombres personalizado, pero también puede optar por exportar como SVG simple.</p>
+
+<h2 id="Adobe_Illustrator">Adobe Illustrator</h2>
+
+<p>URL: <a class="external" href="http://www.adobe.com/products/illustrator/">www.adobe.com/products/illustrator/</a></p>
+
+<p>Before Adobe acquired Macromedia, it was the most prominent promoter of SVG. From this time stems the good support of SVG in Illustrator. However, the resulting SVG often shows some quirks, that make it necessary to post-process it for general applicability.</p>
+
+<h2 id="Apache_Batik">Apache Batik</h2>
+
+<p>URL: <a class="external" href="http://xmlgraphics.apache.org/batik/">xmlgraphics.apache.org/batik/</a></p>
+
+<p>Batik is a set of open source tools under the roof of the Apache Software Foundation. The toolkit is written in Java and offers almost complete SVG 1.1 support, as well as some features that were originally planned for SVG 1.2.</p>
+
+<p>Batik offers a viewer (Squiggle), a rasterizer for PNG output, an SVG pretty printer to format SVG files, and a TrueType-to-SVG-Font converter.</p>
+
+<p>Together with <a class="external" href="http://xmlgraphics.apache.org/fop/">Apache FOP</a> Batik can transform SVG to PDF.</p>
+
+<h3 id="Other_renderers">Other renderers</h3>
+
+<p>Several projects exist that can create a raster image from an SVG source. <a class="external" href="http://ImageMagick.org" title="http://imagemagick.org/">ImageMagick</a> is one of the most famous command-line image processing tools. The Gnome library <a class="external" href="http://library.gnome.org/devel/rsvg/" title="http://library.gnome.org/devel/rsvg/">rsvg</a> is used by the Wikipedia to raster their SVG graphics. Usage of headless browsers such as SlimerJS and PhantomJS are also popular for this purpose, as the image produced is closer to what the SVG will look like in the browser.</p>
+
+<h2 id="Raphael_JS">Raphael JS</h2>
+
+<p>URL: <a class="external" href="http://raphaeljs.com/">raphaeljs.com</a></p>
+
+<p>This is a JavaScript library, that acts as an abstraction layer between browser implementations. Notably older versions of Internet Explorer are supported by generating VML, a vector markup language, that is one of two ancestors of SVG and exists since IE 5.5.</p>
+
+<h2 id="Snap.svg">Snap.svg</h2>
+
+<p>URL: <a href="http://snapsvg.io/">snapsvg.io</a></p>
+
+<p>A newer JavaScript abstraction layer from the same author of Raphael JS. Snap.svg is designed for modern browsers and therefore supports the newest SVG features like masking, clipping, patterns, full gradients, groups. It does not support the older browsers that Raphael does.</p>
+
+<section id="sect1"> </section>
+
+<h2 id="Google_Docs">Google Docs</h2>
+
+<p>URL: <a class="external" href="http://www.google.com/google-d-s/drawings/">www.google.com/google-d-s/drawings/</a></p>
+
+<p>Drawings from Google Docs can be exported as SVG.</p>
+
+<h2 id="Science">Science</h2>
+
+<p>The well-known plotting tools xfig and gnuplot both support exporting as SVG. To render graphs on the web <a class="external" href="http://jsxgraph.uni-bayreuth.de/wp/" title="http://jsxgraph.uni-bayreuth.de/wp/">JSXGraph</a> supports VML, SVG and canvas, automatically deciding which technology to use based on browser capabilities.</p>
+
+<p>In GIS (Geographic Information System) applications SVG is often used as both storage and rendering format. See <a class="external" href="http://carto.net">carto.net</a> for details.</p>
+
+<h2 id="More_tools!">More tools!</h2>
+
+<p>The W3C offers a <a class="external" href="http://www.w3.org/Graphics/SVG/WG/wiki/Implementations">list of programs</a> that support SVG.</p>
+
+<p>{{ PreviousNext("Web/SVG/Tutorial/SVG_Image_Tag") }}</p>