1 files changed, 39 insertions, 0 deletions
diff --git a/files/pt-br/web/svg/tutorial/introduction/index.html b/files/pt-br/web/svg/tutorial/introduction/index.html
new file mode 100644
index 0000000000..8c38a939d3
--- /dev/null
+++ b/files/pt-br/web/svg/tutorial/introduction/index.html
@@ -0,0 +1,39 @@
+---
+title: Introdução
+slug: Web/SVG/Tutorial/Introduction
+translation_of: Web/SVG/Tutorial/Introduction
+---
+<p>{{ PreviousNext("Web/SVG/Tutorial", "Web/SVG/Tutorial/Getting_Started") }}</p>
+
+<p><img alt="" class="internal" src="/@api/deki/files/348/=SVG_Overview.png" style="float: right;"><a href="/en-US/SVG" title="en-US/SVG">SVG</a> é uma linguagem <a href="/en-US/XML" title="en-US/XML">XML</a>, similar ao <a href="/en-US/XHTML" title="en-US/XHTML">XHTML</a>, na qual pode ser usada para desenhar vetores gráficos (imagens), como os mostrados à direita. Ela pode ser usada para criar uma imagem qualquer especificando todas as linhas e formas necessárias, para modificar uma imagem raster já existente ou fazer ambas as opções. A imagem e seus componentes também podem ser transformados, compostas em conjunto, ou filtradas para mudar completamente sua aparência.</p>
+
+<p>SVG surgiu em 1999 após vários outros formatos terem sido submetidos à <a class="external" href="http://www.w3.org" title="en-US/W3C">W3C</a> e não terem sido totalmente ratificados. Enquanto a especificação tem levado um bom tempo, a aceitação pelos navegadores têm sido lenta, e não há tanto conteúdo sobre SVG sendo utilizado na internet neste momento (2009). Even the implementations that are available often are not as fast as competing technologies like <a href="/en-US/HTML/Canvas" title="en-US/HTML/Canvas">HTML5 Canvas</a> or Adobe Flash as a full application interface. SVG does offer benefits over both implementations, some of which include having a <a href="/en-US/docs/Web/API">DOM interface</a> available for it, and not requiring third-party extensions. Whether or not to use it often depends on your specific use case.</p>
+
+<h3 id="Ingredientes_Básicos">Ingredientes Básicos</h3>
+
+<p>O <a href="https://developer.mozilla.org/pt-BR/docs/Web/HTML">HTML</a> fornece elementos para definir cabeçalhos, parágrafos, tabelas e assim por diante. Da mesma forma, o SVG fornnece elementos para circulos,retangulos e curvas simples e complexas. Um documentos simples de SVG consiste de nada mais do que um elemento-raiz {{SVGElement('svg')}} e várias formas básicas que juntas constroem um gráfico. Há também o elemento {{SVGElement('g')}}, que é utilizado para agrupar várias formas básicas.</p>
+
+<p>Começando daqui, o SVG em imagem pode se tornar arbitrariamente complexo. SVG suporta gradientes, rotação, filtros, efeitos, animações, interatividade com JavaScript e assim por diante. Mas todas essas ferramentas extras da linguagem dependem desse conjunto relativamente pequeno de elementos para definir a área gráfica.</p>
+
+<h3 id="Before_you_start" name="Before_you_start">Antes de você começar</h3>
+
+<p>Há muitos softwares disponíveis como o <a class="external" href="http://www.inkscape.org/">Inkscape</a> os quais são gratuitos e usam SVG como seus formatos de arquivos padrão. Entretanto, este tutorial dependerá apenas do XML ou do editor de texto da sua escolha. A ideia é ensinar o funcionamento interno do SVG para aqueles que desejam entendê-lo, e a melhor forma é "pondo a mão na masssa", escrevendo algumas marcações. Contudo você deve anotar o seu objetivo. Nenhum dos visualizadores SVG são iguais, então, há uma boa chance de você desenvolver para um aplicativo não será exibido exatamente da mesma forma que em outros, simplesmente porque eles suportam diferentes níveis da especificação SVG ou outra especificação que você está usando junto com o SVG (isto é, JavaScript ou CSS).</p>
+
+<p>SVG é suportado em todos os browsers modernos em cobre algumas versões anteriores em alguns casos. Uma tabela completa de compatibilidade com browser pode ser encontrada em <a href="http://caniuse.com/svg">Can I use</a>. O Firefox suporta alguns conteúdos SVG desde a versão 1.5, e este suporte vem crescendo a cada lançamento desde então. Espero, que com essa tradução aqui, o MDN possa ajudar os desenvolvedores a acompanhar as diferenças entre o Gecko e algumas das outras importantes implementações.</p>
+
+<ul>
+ <li>O XML é case-sensitive (diferencia maiúsculas e minúsculas, diferentemente do HTML), ou seja, todos os exemplos devem ser escritos exatamente como mostrado aqui.</li>
+ <li>Valores de atributos, mesmo que estes sejam números, devem ser colocados dentro de aspas.</li>
+</ul>
+
+<p>SVG é uma especificação imensa. Este tutorial combre apenas o conteúdo básico. Uma vez que você se familiarizar você estará habilitado a usar o <a href="/en-US/SVG/Element" title="en-US/SVG/Element">Element Reference</a> e o <a href="/en-US/docs/DOM/DOM_Reference#SVG_interfaces" title="en-US/SVG/Interface">Interface Reference</a> para encontrar qualquer outra coisa que precisa saber.</p>
+
+<h3 id="Sabores_do_SVG">Sabores do SVG</h3>
+
+<p>Desde que se tornou uma recomendação em 2003, a mais recente Versão SVG completa é 1.1. Ele se baseia SVG 1.0, mas adiciona mais modularização para facilitar a implementação. <a href="http://www.w3.org/TR/SVG/">The second edition of SVG 1.1</a> tournouse uma recomendação em 2011. O SVG 1.2 completo deveria se tornar o próximo grande lançamento. Ele foi descartado para o próximo lançamento <a href="http://www.w3.org/TR/SVG2/">SVG 2.0</a>, o qual está sob forte desenvolvimento agora e segue uma abordagem semelhante ao CSS 3, que divide  <span class="tlid-translation translation"><span title="">pois divide componentes em várias especificações fracamente acopladas.</span></span></p>
+
+<p><span class="tlid-translation translation"><span title="">Além das recomendações completas do SVG, o grupo de trabalho do W3C introduziu o SVG Tiny e o SVG Basic em 2003. Esses dois perfis são voltados principalmente para dispositivos móveis.</span> <span title="">O primeiro, SVG Tiny, deve render primitivos gráficos para pequenos dispositivos com baixa capacidade.</span> <span title="">O SVG Basic oferece muitos recursos de SVG completo, mas não inclui aqueles que são difíceis de implementar ou pesados para renderizar (como animações).</span> <span title="">Em 2008, o SVG Tiny 1.2 tornou-se uma recomendação do W3C.</span><br>
+ <br>
+ <span title="">Havia planos para uma especificação de impressão SVG, que adicionaria suporte a várias páginas e gerenciamento de cores aprimorado.</span> <span title="">Este trabalho foi descontinuado.</span></span></p>
+
+<p>{{ PreviousNext("Web/SVG/Tutorial", "Web/SVG/Tutorial/Getting_Started") }}</p>