initial commit

2 files changed, 157 insertions, 0 deletions

diff --git a/files/fi/html/canvas/index.html b/files/fi/html/canvas/index.html
new file mode 100644
index 0000000000..bbef096b3d
--- /dev/null
+++ b/files/fi/html/canvas/index.html
@@ -0,0 +1,73 @@
+---
+title: Canvas
+slug: HTML/Canvas
+translation_of: Web/API/Canvas_API
+---
+<p><a href="/en-US/docs/HTML/HTML5" title="/en-US/docs/HTML/HTML5">HTML5</a>:een lisätty <strong>HTML {{HTMLElement("canvas")}}-elementti</strong> on elementti, jota voidaan käyttää grafiikan piirtämiseen skriptaamalla (tavallisesti <a href="/en-US/docs/JavaScript" title="JavaScript">JavaScript</a>-kielellä). Sitä voidaan käyttää esimerkiksi diagrammojen piirtämiseen, valokuvayhdistelmien tekemiseen, animaatioiden luomiseen ja jopa ajantasaiseen video-käsittelyyn.</p>
+<p>Mozilla-sovellukset saivat <code>&lt;canvas&gt;</code>-tuen Gecko 1.8-versiosta alkaen (toisin sanoen <a href="/en-US/docs/Firefox_1.5_for_developers" title="Firefox_1.5_for_developers">Firefox 1.5</a>:stä lähtien). Elementin esitteli alunperin Apple OS X-käyttöjärjestelmä <a class="external" href="http://www.apple.com/macosx/features/dashboard/">Dashboard</a>- ja Safari-sovelluksissa. Internet Explorer tukee <code>&lt;canvas&gt;</code>:ia versiosta 9 lähtien; IE-selaimen aiemmissa versioissa webbisivulle voidaan tehokkaasti lisätä <code>&lt;canvas&gt;</code>-tuki Googlen <a class="external" href="http://excanvas.sourceforge.net/">Explorer Canvas</a>-hankkeen skriptillä. Google Chrome ja Opera 9 tukevat myös <code>&lt;canvas&gt;</code>:ia.</p>
+<p><a href="/en-US/docs/WebGL" title="WebGL">WebGL</a> käyttää myös <code>&lt;canvas&gt;</code>-elementtiä 3D-grafiikan laitteistokiihdytykseen webbisivuilla.</p>
+<div class="row topicpage-table">
+  <div class="section">
+    <h2 class="Documentation" id="Documentation" name="Documentation">Dokumentaatio</h2>
+    <dl>
+      <dt>
+        <a class="external" href="http://www.whatwg.org/specs/web-apps/current-work/multipage/the-canvas-element.html#the-canvas-element" title="http://www.whatwg.org/specs/web-apps/current-work/multipage/the-canvas-element.html#the-canvas-element">Spesifikaatio</a></dt>
+      <dd>
+        Elementti <code>&lt;canvas&gt;</code> on osa WhatWG Web applications 1.0 -spesifikaatiota, joka tunnetaan myös nimellä HTML5.</dd>
+      <dt>
+        <a href="/en-US/docs/Canvas_tutorial" title="Canvas_tutorial">Canvas-oppikurssi</a></dt>
+      <dd>
+        Laaja oppikurssi, joka kattaa sekä <code>&lt;canvas&gt;</code>-peruskäytön että sen edistyneemmät ominaisuudet.</dd>
+      <dt>
+        <a href="/en-US/docs/Code_snippets/Canvas" title="Code_snippets/Canvas">Koodikatkelma:Canvas</a></dt>
+      <dd>
+        Joitakin <code>&lt;canvas&gt;</code>:iin liittyviä koodikatkelmia.</dd>
+      <dt>
+        <a href="/en-US/docs/tag/Canvas_examples" title="tag/Canvas_examples">Canvas-esimerkkejä</a></dt>
+      <dd>
+        Muutama <code>&lt;canvas&gt;</code>-esittelyohjelma.</dd>
+      <dt>
+        <a href="/en-US/docs/HTML/Canvas/Drawing_DOM_objects_into_a_canvas" title="HTML/Canvas/Drawing DOM objects into a canvas">DOM-objektien piirtäminen canvas-elementtiin</a></dt>
+      <dd>
+        Kuinka piirtää canvas-komponenttiin DOM-sisältö, kuten HTML-elementit.</dd>
+      <dt>
+        <a href="/en-US/docs/A_Basic_RayCaster" title="A Basic RayCaster">Perussädeheittäjä</a></dt>
+      <dd>
+        Canvasia käyttävä sädejäljitysanimaation esittelyohjelma.</dd>
+      <dt>
+        <a href="/en-US/docs/Gecko_DOM_Reference#Canvas_interfaces" title="Gecko_DOM_Reference#Canvas_interfaces">Canvas DOM -rajapinnat</a></dt>
+      <dd>
+        Canvas DOM -rajapinnat Gecko-alustalla.</dd>
+    </dl>
+    <p><span class="alllinks"><a href="/en-US/docs/tag/HTML:Canvas" title="tag/HTML:Canvas">Katso kaikkia...</a></span></p>
+  </div>
+  <div class="section">
+    <h2 class="Community" id="Yhteisö">Yhteisö</h2>
+    <ul>
+      <li>Katso Mozilla-foorumeita... {{DiscussionList("dev-tech-html","mozilla.dev.tech.html")}}</li>
+      <li><a class="external" href="http://groups.yahoo.com/group/canvas-developers/">Canvas-kehittäjät Yahoo-ryhmä</a></li>
+    </ul>
+    <h2 class="Resources" id="Resources" name="Resources">Resurssit</h2>
+    <ul>
+      <li><a class="external" href="http://joshondesign.com/p/books/canvasdeepdive/title.html" title="http://projects.joshy.org/presentations/HTML/CanvasDeepDive/presentation.html">Syvä sukellus HTML5 Canvasiin</a></li>
+      <li><a class="external" href="http://blog.nihilogic.dk/2009/02/html5-canvas-cheat-sheet.html" title="http://blog.nihilogic.dk/2009/02/html5-canvas-cheat-sheet.html">Canvas-muistilappu</a> (<a href="http://www.nihilogic.dk/labs/canvas_sheet/HTML5_Canvas_Cheat_Sheet.png" title="HTML5_Canvas_Cheat_Sheet.png (1388×1027)">PNG</a> / <a href="http://www.nihilogic.dk/labs/canvas_sheet/HTML5_Canvas_Cheat_Sheet.pdf" title="http://www.nihilogic.dk/labs/canvas_sheet/HTML5_Canvas_Cheat_Sheet.pdf">PDF</a>)</li>
+    </ul>
+    <h2 class="Libraries" id="Libraries" name="Libraries">Kirjastot</h2>
+    <ul>
+      <li><a class="external" href="http://libcanvas.github.com/" title="http://libcanvas.github.com/">libCanvas</a> on tehokas ja kevyt canvas-ympäristö</li>
+      <li><a class="external" href="http://processingjs.org" title="http://processingjs.org/">Processing.js</a> on toiseen käyttöympäristöön siirretty Prosessin visualisointikieli</li>
+      <li><a class="external" href="http://easeljs.com/" title="http://easeljs.com/">EaselJS</a> on kirjasto, jossa on Flash-tyyppinen sovellusohjelmointirajapinta (API)</li>
+      <li><a class="external" href="http://www.liquidx.net/plotkit/" title="http://www.liquidx.net/plotkit/">PlotKit</a> on taulukko- ja grafiikkakirjasto</li>
+      <li><a class="link-https" href="https://github.com/jeremyckahn/rekapi" title="https://github.com/jeremyckahn/rekapi">Rekapi</a> on avainkehys-animaatioympäristön sovellusohjelmointirajapinta Canvasille</li>
+      <li><a class="external" href="http://senchalabs.github.com/philogl/" title="http://senchalabs.github.com/philogl/">PhiloGL</a> on WebGL-ympäristö datan visualisointiin, luovaan koodaukseen ja pelikehitykseen.</li>
+      <li><a class="external" href="http://thejit.org/" title="http://thejit.org/">JavaScript InfoVis Toolkit</a> luo vuorovaikutteisia 2D Canvas -datavisualisointeja webbiin.</li>
+      <li><a href="http://www.frame-engine.com" title="http://www.frame-engine.com">Frame-Engine</a> on sovellusten ja pelin kehitysympäristö</li>
+    </ul>
+    <h2 class="Related_Topics" id="Related_Topics" name="Related_Topics">Asiaan liittyvät aiheet</h2>
+    <ul>
+      <li><a href="/en-US/docs/HTML" title="HTML">HTML</a>, <a href="/en-US/docs/JavaScript" title="JavaScript">JavaScript</a>, <a href="/en-US/docs/CSS" title="CSS">CSS</a>, <a href="/en-US/docs/AJAX" title="AJAX">AJAX</a>, <a href="/en-US/docs/DOM" title="DOM">DOM</a>, <a href="/en-US/docs/SVG" title="SVG">SVG</a>, <a href="/en-US/docs/WebGL" title="WebGL">WebGL</a></li>
+    </ul>
+  </div>
+</div>
+<div>
+  {{HTML5ArticleTOC()}}</div>
diff --git a/files/fi/html/index.html b/files/fi/html/index.html
new file mode 100644
index 0000000000..dd02719a98
--- /dev/null
+++ b/files/fi/html/index.html
@@ -0,0 +1,84 @@
+---
+title: HTML
+slug: HTML
+tags:
+  - HTML
+  - NeedsTranslation
+  - References
+  - TopicStub
+translation_of: Web/HTML
+---
+<div class="callout-box">
+  <div style="font: normal 20px 'Bebas Neue','League Gothic',Haettenschweiler,Impact,'Arial Narrow',sans-serif; text-transform: uppercase;">
+    HTML5 Demos</div>
+  <p>A <a href="https://developer.mozilla.org/en-US/demos/tag/tech:html5" title="demos/tag/tech:html5">collection of demos</a> showing the latest HTML technologies in action.</p>
+  <p><a href="/en-US/docs/HTML/HTML5" title="html5"><img alt="The logo of HTML" class="default" src="/files/3563/HTML5_Logo_128.png" style="width: 128px; height: 128px;"></a></p>
+</div>
+<p><strong>HyperText Markup Language (<em>HTML</em>)</strong> is the language used to create web pages and other types of documents viewable in a browser. More precisely, HTML is the language that describes the structure and the semantic of a document. The content is tagged with HTML elements like <code>&lt;img&gt;</code>, <code>&lt;title&gt;</code>, <code>&lt;p&gt;</code>, <code>&lt;div&gt;</code>, …</p>
+<p>HTML is an international standard whose specifications are maintained by the <a class="external" href="http://www.w3.org/">World Wide Web Consortium</a> and the <a href="http://www.whatwg.org/" title="http://www.whatwg.org/">WHATWG</a>.</p>
+<p>HTML is considered a <em>living standard</em> and is technically under continuous development. That always-current version of the HTML specification is referred to as <strong>HTML5</strong>.</p>
+<div class="cleared topicpage-table">
+  <div class="section">
+    <h2 class="Documentation" id="Documentation" name="Documentation">Documentation about HTML</h2>
+    <dl>
+      <dt>
+        <a href="/en-US/docs/HTML/Introduction" title="Introduction to HTML"><strong>Introduction to HTML</strong></a></dt>
+      <dd>
+        This page provides basic information on syntax and semantics of an HTML page (document). This will provide basic information required to develop HTML documents.</dd>
+      <dt>
+        <a href="/en-US/docs/HTML/Element" title="HTML/Element">HTML element reference</a></dt>
+      <dd>
+        Get details about each element supported by different browsers.</dd>
+      <dt>
+        <a href="/en-US/docs/HTML/Attributes" title="HTML/Attributes">HTML attributes list </a></dt>
+      <dd>
+        See all attributes and what elements they are associated with.</dd>
+      <dt>
+        <a href="/en-US/docs/HTML/HTML5" title="HTML/HTML5">HTML5</a></dt>
+      <dd>
+        Learn about the new HTML5 APIs and elements along with their support.</dd>
+      <dt>
+        <a href="/en-US/docs/HTML/Forms" title="HTML/Forms">HTML Forms Guide</a></dt>
+      <dd>
+        HTML forms are a complex part of HTML. This guide will help you mastering them, from structure to styling, from browser support to custom controls.</dd>
+      <dt>
+        <a href="/en-US/docs/Web_development/Historical_artifacts_to_avoid" title="HTML/Bad_copy_pasting_habits">Bad copy-pasting habits</a></dt>
+      <dd>
+        Web technologies are very often learned by viewing sources of other pages and copy-pasting. However, this often means that bad habits perpetuate. This page lists some of these bad patterns and show you can achieve their goal the right way.</dd>
+      <dt>
+        <a href="/en-US/docs/HTML/Canvas/Drawing_Graphics_with_Canvas" title="Drawing_Graphics_with_Canvas">Drawing Graphics with Canvas</a></dt>
+      <dd>
+        A new HTML element for programmable graphics. <code>&lt;canvas&gt;</code> can be used for rendering graphs, UI elements, and other custom graphics on the client.</dd>
+      <dt>
+        <a href="/en-US/docs/HTML/Tips_for_authoring_fast-loading_HTML_pages" title="HTML/Tips for authoring fast-loading HTML pages">Tips for Authoring Fast-loading HTML Pages</a></dt>
+      <dd>
+        An optimized web page not only provides for a more responsive site for your visitors, but also reduces the load on your web servers and internet connection.</dd>
+    </dl>
+    <p><span class="alllinks"><a href="/en-US/docs/tag/HTML" title="Article tagged: HTML">View All...</a></span></p>
+  </div>
+  <div class="section">
+    <h2 class="Community" id="Community" name="Community">Getting help from the community</h2>
+    <p>You need help on a HTML-related problem and can't find the solution in the documentation?</p>
+    <ul>
+      <li>Consult the dedicated Mozilla forum : {{DiscussionList("dev-tech-html", "mozilla.dev.tech.html")}}</li>
+      <li>Go to <a href="http://stackoverflow.com/questions/tagged/html" title="http://stackoverflow.com/questions/tagged/css">Stack Overflow</a>, a collaboratively built and maintained Q&amp;A site and look if you can find the answer to your quetion. If not you will be able to ask your question there.</li>
+    </ul>
+    <p><span class="alllinks"><a href="http://www.catb.org/~esr/faqs/smart-questions.html">Don't forget about the <em>netiquette</em>...</a></span></p>
+    <h2 class="Tools" id="Tools" name="Tools">Tools easing HTML development</h2>
+    <ul>
+      <li>Firefox' <a class="link-https" href="https://addons.mozilla.org/en-US/firefox/addon/1843">Firebug extension</a><span class="external">, a popular</span> extension of that navigator that allows to edit live CSS on watched sites. Very practical to test some changes, though this extension does much more.</li>
+      <li><a class="external" href="http://validator.w3.org/">HTML Validator</a></li>
+      <li><a class="link-https" href="https://addons.mozilla.org/en-US/firefox/addon/web-developer/">Web Developer Extension</a></li>
+      <li><a class="external" href="http://tidy.sourceforge.net/">HTML Tidy</a></li>
+      <li><a class="external" href="http://prettydiff.com/?html">Pretty Diff</a></li>
+    </ul>
+    <p><span class="alllinks"><a href="/en-US/docs/tag/HTML:Tools" title="Article tagged: HTML:Tools">View All...</a></span></p>
+    <h2 class="Related_Topics" id="Related_Topics" name="Related_Topics">Related Topics</h2>
+    <ul>
+      <li>The <a href="/en-US/docs/CSS" title="CSS">Cascading Style Sheets (CSS)</a> used to give style to HTML.</li>
+      <li>The <a href="/en-US/docs/Document_Object_Model_(DOM)" title="Document Object Model (DOM)">Document Object Model (DOM)</a> is the representation of an HTML document as a tree.</li>
+      <li><a href="/en-US/docs/XHTML" title="XHTML">XHTML</a> is the <a href="/en-US/docs/XML" title="XML">XML</a> version of the language.</li>
+    </ul>
+  </div>
+</div>
+<p> </p>