initial commit

2 files changed, 111 insertions, 0 deletions

diff --git a/files/fi/web/guide/events/index.html b/files/fi/web/guide/events/index.html
new file mode 100644
index 0000000000..0196a78f5a
--- /dev/null
+++ b/files/fi/web/guide/events/index.html
@@ -0,0 +1,53 @@
+---
+title: Event developer guide
+slug: Web/Guide/Events
+tags:
+  - DOM
+  - Event
+  - Guide
+  - NeedsTranslation
+  - NeedsUpdate
+  - TopicStub
+  - events
+translation_of: Web/Guide/Events
+---
+<p>{{draft()}}</p>
+
+<p>Events refers both to a design pattern used for the asynchronous handling of various incidents which occur in the lifetime of a web page and to the naming, characterization, and use of a large number of incidents of different types.</p>
+
+<p>The <a href="/en-US/docs/Web/Guide/API/DOM/Events/Overview_of_Events_and_Handlers">overview page</a> provides an introduction to the design pattern and a summary of the types of incidents which are defined and reacted to by modern web browsers.</p>
+
+<p>The <a href="/en-US/docs/Web/Guide/API/DOM/Events/Creating_and_triggering_events">custom events page</a> describes how the event code design pattern can be used in custom code to define new event types emitted by user objects, register listener functions to handle those events, and trigger the events in user code.</p>
+
+<p>The remaining pages describe how to use events of different kinds defined by web browsers. Unfortunately, these events have been defined piece by piece as web browsers have evolved so that there is no satisfying systematic characterization of the events built-in or defined by modern web browsers.</p>
+
+<p>The <strong>device</strong> on which the web browser is running can trigger events, for example due to a change in its position and orientation in the real world, as discussed partially by the <a href="/en-US/docs/Web/Guide/API/DOM/Events/Orientation_and_motion_data_explained">page on orientation coordinate systems</a> and the <a href="/en-US/docs/Web/Guide/API/DOM/Events/Using_device_orientation_with_3D_transforms">page on the use of 3D transforms</a>. That is different, but similar, to the change in device vertical orientation. </p>
+
+<p>The <strong>window</strong> in which the browser is displayed can trigger events; for example, change size if the user maximizes the window or otherwise changes it.</p>
+
+<p>The <strong>process</strong> loading of a web page can trigger events in response to the completion of different steps in the downloading, parsing, and rendering of the web page for display to the user.</p>
+
+<p>The <strong>user interaction</strong> with the web page contents can trigger events. The events triggered by user interaction evolved during the early years of browser design and include a complicated system defining the sequence in which events will be called and the manner in which that sequence can be controlled. The different types of user interaction-driven events include:</p>
+
+<ul>
+ <li>the original 'click' event,</li>
+ <li>mouse events,</li>
+ <li><a href="/en-US/docs/Web/Guide/API/DOM/Events/Mouse_gesture_events">mouse gesture events</a>, and</li>
+ <li>both <a href="/en-US/docs/Web/Guide/API/DOM/Events/Touch_events">touch events</a> and the earlier <a href="/en-US/docs/Web/Guide/API/DOM/Events/Touch_events_(Mozilla_experimental)">mozilla experimental touch events</a>, now deprecated.</li>
+</ul>
+
+<p>The <strong>modification of the web page</strong> in structure or content might trigger some events, as explained in the <a href="/en-US/docs/Web/Guide/API/DOM/Events/Mutation_events">mutation events page</a>, but the use of these events has been deprecated in favour of the lighter <a href="/en-US/docs/Web/API/MutationObserver">Mutation Observer</a> approach.</p>
+
+<p>The <strong>media streams</strong> embedded in the HTML documents might trigger some events, as explained in the <a href="/en-US/docs/Web/Guide/API/DOM/Events/Media_events">media events</a> page.</p>
+
+<p>The <strong>network requests</strong> made by a web page might trigger some events.</p>
+
+<p>There are many other sources of events defined by web browsers for which pages are not yet available in this guide.</p>
+
+<div class="note">
+<p>Note: This Event Developer Guide needs substantial work. The structure needs to be reorganized and the pages rewritten. Our hope is that everything you need to know about events will go under here.</p>
+</div>
+
+<h2 id="Docs">Docs</h2>
+
+<p>{{LandingPageListSubpages}}</p>
diff --git a/files/fi/web/guide/index.html b/files/fi/web/guide/index.html
new file mode 100644
index 0000000000..d87f4e3108
--- /dev/null
+++ b/files/fi/web/guide/index.html
@@ -0,0 +1,58 @@
+---
+title: Web developer guides
+slug: Web/Guide
+tags:
+  - Guide
+  - Landing
+  - NeedsTranslation
+  - TopicStub
+  - Web
+translation_of: Web/Guide
+---
+<p><strong>This article provides how-to information to help make use of specific technologies &amp; APIs.</strong></p>
+
+<div class="row topicpage-table">
+<div class="section">
+<dl>
+ <dt class="landingPageList"><a href="/en-US/docs/Learn/HTML">HTML Learning Area</a></dt>
+ <dd class="landingPageList"><strong>HyperText Markup Language (HTML)</strong> is the core language of nearly all Web content. Most of what you see on screen in your browser is described, fundamentally, using HTML.</dd>
+ <dt class="landingPageList"><a href="/en-US/docs/Learn/CSS">CSS Learning Area</a></dt>
+ <dd class="landingPageList">Cascading Style Sheets (CSS) is a stylesheet language used to describe the presentation of a document written in HTML.</dd>
+ <dt class="landingPageList"><a href="https://developer.mozilla.org/en-US/docs/Web/Guide/Events">Events developer guide</a></dt>
+ <dd class="landingPageList">Events refers both to a design pattern used for the asynchronous handling of various incidents which occur in the lifetime of a web page and to the naming, characterization, and use of a large number of incidents of different types.</dd>
+ <dt class="landingPageList"><a href="/en-US/docs/Web/Guide/AJAX">AJAX</a></dt>
+ <dd class="landingPageList">AJAX is a term that defines a group of technologies allowing web applications to make quick, incremental updates to the user interface without reloading the entire browser page. This makes the application faster and more responsive to user actions.</dd>
+ <dt class="landingPageList"><a href="https://developer.mozilla.org/en-US/docs/Web/Guide/Graphics">Graphics on the Web</a></dt>
+ <dd class="landingPageList">Modern Web sites and applications often need to present graphics of varying sophistication.</dd>
+ <dt class="landingPageList"><a href="https://developer.mozilla.org/en-US/docs/Web/Guide/API">Guide to Web APIs</a></dt>
+ <dd class="landingPageList">A list of all Web APIs and what they do.</dd>
+ <dt><a href="https://developer.mozilla.org/en-US/docs/JavaScript" title="/en-US/docs/JavaScript">JavaScript</a></dt>
+ <dd>JavaScript is the powerful scripting language used to create applications for the Web.</dd>
+ <dt class="landingPageList"><a href="https://developer.mozilla.org/en-US/docs/Localizations_and_character_encodings">Localizations and character encodings</a></dt>
+ <dd class="landingPageList">Browsers process text as Unicode internally. However, a way of representing characters in terms of bytes (character encoding) is used for transferring text over the network to the browser. The <a class="external external-icon" href="http://www.whatwg.org/specs/web-apps/current-work/multipage/semantics.html#charset">HTML specification recommends the use of the UTF-8 encoding</a> (which can represent all of Unicode), and regardless of the encoding used requires Web content to declare that encoding.</dd>
+ <dt class="landingPageList"><a href="https://developer.mozilla.org/en-US/docs/Web/Guide/Mobile">Mobile Web Development</a></dt>
+ <dd class="landingPageList">This page provides an overview of some of the main techniques needed to design web sites that work well on mobile devices. If you're looking for information on Mozilla's Firefox OS project, see the <a href="https://developer.mozilla.org/en/Mozilla/Firefox_OS" title="Boot to Gecko">Firefox OS</a> page. Or you might be interested in details about <a href="https://developer.mozilla.org/en/Mozilla/Firefox_for_Android">Firefox for Android</a>.</dd>
+</dl>
+</div>
+
+<div class="section">
+<dl>
+ <dt class="landingPageList"><a href="https://developer.mozilla.org/en-US/docs/Web/Guide/Performance">Optimization and performance</a></dt>
+ <dd class="landingPageList">When building modern Web apps and sites, it's important to make your content work quickly and efficiently. This lets it perform effectively for both powerful desktop systems and weaker handheld devices.</dd>
+ <dt class="landingPageList"><a href="https://developer.mozilla.org/en-US/docs/Web/Guide/Parsing_and_serializing_XML">Parsing and serializing XML</a></dt>
+ <dd class="landingPageList">The Web platform provides different methods of parsing and serializing XML, each with its own pros and cons.</dd>
+ <dt class="landingPageList"><a href="https://developer.mozilla.org/en-US/docs/Web/Guide/WOFF">The Web Open Font Format (WOFF)</a></dt>
+ <dd class="landingPageList"><strong>WOFF</strong> (<strong>Web Open Font Format</strong>) is a font file format that is free for anyone to use on the web.</dd>
+ <dt class="landingPageList"><a href="https://developer.mozilla.org/en-US/docs/Web/Guide/Using_FormData_Objects">Using FormData Objects</a></dt>
+ <dd class="landingPageList">The <a href="https://developer.mozilla.org/en/DOM/XMLHttpRequest/FormData"><code>FormData</code></a> object lets you compile a set of key/value pairs to send using <code>XMLHttpRequest</code>. It's primarily intended for sending form data, but can be used independently from forms in order to transmit keyed data. The transmission is in the same format that the form's <code>submit()</code> method would use to send the data if the form's encoding type were set to "multipart/form-data".</dd>
+ <dt class="landingPageList"><a href="/en-US/docs/Glossary">Glossary</a></dt>
+ <dd class="landingPageList">Defines numerous technical terms related to the Web and Internet.</dd>
+</dl>
+</div>
+</div>
+
+<h2 id="See_also">See also</h2>
+
+<ul>
+ <li><a href="/en-US/docs/Web/Reference" title="/en-US/docs/Web/Reference">Web Developer Reference</a></li>
+</ul>