hileon · March 27, 2012 04:13
diff --git a/cheatsheet.atom b/cheatsheet.atom
 <?xml version="1.0" encoding="utf-8"?>
 <feed
 xmlns="http://www.w3.org/2005/Atom"
 xml:lang="ja-JP">

 <author>
 	<name>Japboy</name>
 </author>
 <category/>
 <contributor/>
 <generator/>
 <icon/>
 <logo/>
 <id>urn:uuid:60a76c80-d399-11d9-b93C-0003939e0af6</id>
 <link rel="self" href="git://gist.github.com/160000.git/cheatsheet.atom"/>
 <rights/>
 <subtitle/>
 <title>Atom  Syndication Format Cheatsheet</title>
 <updated>2003-12-19T11:06:00+09:00</updated>

 <entry>

 <author/>
 <category/>
 <content type="xhtml">
 <div xmlns="http://www.w3.org/2000/xmlns">

 <p>This is the <strong>content</strong>.</p>

 </div>
 </content>
 <contributor/>
 <id/>
 <link/>
 <published/>
 <rights/>
 <source/>
 <summary/>
 <title/>
 <updated/>

 </entry>

 </feed>
diff --git a/cheatsheet.css b/cheatsheet.css
 @charset "UTF-8";

 /**
 * Foundation style
 *
 * Appearance order of CSS properties are depends on:
 * http://lab.youck.org/css-property-order.html
 *
 * @project   Name of Project
 * @version   0.0.3
 * @package   com.github.japboy
 * @author    Yu I.
 * @copyright 2011 by Yu I.
 * @cssdoc    version 1.0-pre
 * @license   Public domain
 *
 * @colordef rgb(255,255,255); white
 */

 /**
 * Stylesheet initialisation
 * @section reset
 */
 @import url("http://yui.yahooapis.com/3.3.0/build/cssreset/reset-min.css");

 /* Minimal reset properties
 * {
    margin: 0;
    padding: 0;
    border: 0;
    background-color: transparent;
    color: rgb(0,0,0);
    line-height: 160%;
    font-size: 100%;
    font-weight: normal;
    font-style: normal;
    text-decoration: none;
 }
 */

 /**
 * The root element
 * @section structure
 * @see     http://www.w3.org/TR/html5/semantics.html#the-root-element
 */
 html {}

 /**
 * Document metadata
 * @section structure
 * @see     http://www.w3.org/TR/html5/semantics.html#document-metadata
 */
 head,
 title,
 base,
 link,
 meta,
 style {}

 /**
 * Scripting
 * @section structure
 * @see     http://www.w3.org/TR/html5/semantics.html#scripting-1
 */
 script,
 noscript {}

 /**
 * Sections
 * @section structure
 * @see     http://www.w3.org/TR/html5/semantics.html#sections
 */
 body,
 section,
 nav,
 article,
 aside,
 h1,
 h2,
 h3,
 h4,
 h5,
 h6
 hgroup,
 header,
 footer,
 address {}

 body {
    padding: 1em;
 }

 h1,
 h2,
 h3,
 h4,
 h5,
 h6 {
    font-weight: bolder;
 }

 /**
 * Grouping content
 * @section structure
 * @see     http://www.w3.org/TR/html5/semantics.html#grouping-content
 */
 p,
 hr,
 br,
 pre,
 dialog,
 blockquote,
 ol,
 ul,
 li,
 dl,
 dt,
 dd {}

 /**
 * Text-level semantics
 * @section structure
 * @see     http://www.w3.org/TR/html5/text-level-semantics.html#text-level-semantics
 */
 a,
 em,
 strong,
 small,
 cite,
 q,
 dfn,
 abbr,
 code,
 var,
 samp,
 kbd,
 sub,
 sup,
 i,
 b,
 mark,
 progress,
 meter,
 time,
 ruby,
 rt,
 rp,
 bdo,
 span {}

 /**
 * Edits
 * @section structure
 * @see     http://www.w3.org/TR/html5/text-level-semantics.html#edits
 */
 ins,
 del {}

 /**
 * Embedded content
 * @section structure
 * @see     http://www.w3.org/TR/html5/text-level-semantics.html#embedded-content-1
 */
 figure,
 img,
 iframe,
 embed,
 object,
 param,
 video,
 audio,
 source,
 canvas,
 map,
 area {}

 /**
 * Tabular data
 * @section structure
 * @see     http://www.w3.org/TR/html5/tabular-data.html#tabular-data
 */
 table,
 caption,
 colgroup,
 col,
 tbody,
 thead,
 tfoot,
 tr,
 td,
 th {}

 /**
 * Forms
 * @section structure
 * @see     http://www.w3.org/TR/html5/forms.html#forms
 */
 form,
 fieldset,
 label,
 input,
 button,
 select,
 datalist,
 optgroup,
 option,
 textarea,
 keygen,
 output {}

 /**
 * Interactive elements
 * @section structure
 * @see     http://www.w3.org/TR/html5/interactive-elements.html#interactive-elements
 */
 details,
 command,
 menu{}

 /**
 * Miscellaneous elements
 * @section structure
 * @see     http://www.w3.org/TR/html5/interactive-elements.html#miscellaneous-elements
 */
 legend,
 div {}
diff --git a/cheatsheet.js b/cheatsheet.js
 "use strict";

 // Script should not have many global objects.
 // One for one script is recommended.
 var APP = {};

 APP.my_property = "I My Me Mine.";

 (function () {
    var a = 1,
        b = 2,
        sum = a + b,
        myObject = {}; // Declare all objects first as one line.

    function doForLoop() {
        var i = 0;
            myArray = [1, 2, 3],
            len = myArray.length; // Length of an array should be cached.
        for (i = 0; i < len; i += 1) {
            console.log(myArray[i]);
        }
    }

    function doForInLoop() {
        var i = 0,
            hasOwn = Object.prototype.hasOwnProperty;
            myHash = {
            one: 1,
            two: 2,
            three: 3
        };
        for (i in myHash) {
            // Loop only own properties but extended properties
            if (hasOwn.call(myHash, i)) {
                console.log(i, myHash[i]);
            }
        }
    }

    function doSwitch() {
        var unknown_numer = 0,
            result = '';
        switch (unknown_number) {
        case 0:
            result = "zero";
            break;
        case 1:
            result = "one";
            break;
        default:
            result = "unknown";
        }
    }

    function compareExactly() {
        var zero = 0;
        if (zero === "") {
            // Never be executed.
        }
    }
 });
diff --git a/cheatsheet.markdown b/cheatsheet.markdown
diff --git a/cheatsheet.opml b/cheatsheet.opml
 <?xml version="1.0" encoding="UTF-8"?>
 <opml
 xmlns="http://www.dlese.org/Metadata/opml"
 xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
 xsi:schemaLocation="http://www.dlese.org/Metadata/opml http://www.dlese.org/Metadata/opml/2.0/opml.xsd"
 version="2.0">

 <head>

 <title>My bookmarks</title>
 <dateCreated></dateCreated>
 <dateModified></dateModified>
 <ownerName>Yu Inao</ownerName>
 <ownerEmail>[email protected]</ownerEmail>
 <expansionState></expansionState>
 <vertScrollState></vertScrollState>
 <windowTop></windowTop>
 <windowLeft></windowLeft>
 <windowBottom></windowBottom>
 <windowRight></windowRight>

 </head>

 <body>

 <outline type="text" text="Feeds">
 	<outline type="link" text="http://foo.bar/rss/feed.xml"/>
 	<outline type="link" text="http://foo.bar/rss.xml"/>
 	<outline type="link" text="http://foo.bar/"/>
 </outline>

 </body>

 </opml>

diff --git a/cheatsheet.rst b/cheatsheet.rst
diff --git a/cheatsheet_html5.html b/cheatsheet_html5.html
 <!DOCTYPE html>
 <!--Cheatsheet for HTML 5
 I've changed mind... HTML doesn't suit for 72 letters limitting in a line.
 Hmmm... I need standards' markup guideline!
 -->
 <html lang="ja-JP" dir="ltr" manifest="./cheatsheet_html5.manifest">
  <head>
    <meta charset="UTF-8">
    <meta name="application-name" content="Name if only this is an application">
    <meta name="description" content="Summary of this page">
    <meta name="generator" content="Name if only this page is generated by a program">
    <meta name="keywords" content="A comma-separated list of keywords that describe this page">
    <meta name="robots" content="A comma-separated list of operators explaining how search engine crawlers should treat the content. 'noarchive' to prevent cached versions, 'noindex' to prevent indexing, 'nofollow' works as the link rel value with the same name, 'NOODP' to block from using Open Directory Project, and 'NOYDIR' to block from using Yahoo directory's descriptions.">
    <meta name="rights-standard" content="content;CC:BY:SA">

    <title>Cheatsheet of HTML 5</title>

    <link rel="author" href="mailto:[email protected]" title="Name of Author">
    <link rel="alternate feed" type="application/rss+xml" href="./foo/bar/feed.rss">
    <link rel="icon" href="./foo/bar/favicon.png">
    <link rel="stylesheet" media="screen, tv" type="text/css" href="./style/Main.css">
    <link rel="stylesheet" media="print" type="text/css" href="./style/print.css">
    <script type="text/javascript" charset="UTF-8" src="./foo/bar/script.js">
    </script>
  </head>

  <body>
    <header>
      <h1>HTML 5 Cheatsheet</h1>
    </header>

    <nav>
      <li>Navigation will be here.</li>
    </nav>

    <article>
      <h1>Article heading</h1>

      <section>
        <h2>Introduction</h2>

        <p>HTML is the language for describing the structure of Web pages. HTML gives authors the means to:</p>
        <ul>
          <li>Publish online documents with headings, text, tables, lists, photos, etc.</li>
          <li>Retrieve online information via hypertext links, at the click of a button.</li>
          <li>Design forms for conducting transactions with remote services, for use in searching for information, making reservations, ordering products, etc.</li>
          <li>Include spread-sheets, video clips, sound clips, and other applications directly in their documents.</li>
        </ul>
        <p>With HTML, authors describe the structure of pages using <em>markup.</em> The <em>elements</em> of the language label pieces of content such as <em>paragraphs,</em> <em>lists,</em> <em>tables,</em> and so on.</p>
      </section>

      <section>
        <h2>Getting started</h2>

        <p>Something will be written here. Bla bla bla bla bla bla...</p>
      </section>
    </article>

    <aside>
      <h1>Aside heading</h1>

      <p>Sub contents will be here.</p>
    </aside>

    <hr>

    <footer>
      <address>Japboy &lt;[email protected]&gt;</address>
    </footer>
  </body>
 </html>
diff --git a/cheatsheet_html5.manifest b/cheatsheet_html5.manifest
 CACHE MANIFEST
 # List files that you'd like to cache on client-side.
 ./cheatsheet_html5.html
diff --git a/cheatsheet_webfont.css b/cheatsheet_webfont.css
 @charset "UTF-8";

 /**
 * Web fonts definition
 *
 * @project   Webfonts
 * @version   0.0.1
 * @package   cheatsheet
 * @author    Yu I.
 * @copyright 2010 by Yu I.
 * @cssdoc    version 1.0-pre
 * @license   CC-BY-SA 3.0 http://creativecommons.org/licenses/by-sa/3.0/
 */

 /**
 * Web fonts
 * @section font
 */
 @font-face {
    font-family: "M+ 1p";
    src: local("M+ 1p"),
         url("http://mplus-fonts.sourceforge.jp/webfonts/mplus-1p-regular.ttf")
         format("truetype");
    font-weight: normal;
    font-style: normal;
 }

 @font-face {
    font-family: "M+ 1p";
    src: local("M+ 1p"),
         url("http://mplus-fonts.sourceforge.jp/webfonts/mplus-1p-bold.ttf")
         format("truetype");
    font-weight: bold;
    font-style: normal;
 }

 @font-face {
    font-family: "M+ 1p";
    src: local("M+ 1p"),
         url("http://mplus-fonts.sourceforge.jp/webfonts/mplus-1p-heavy.ttf")
         format("truetype");
    font-weight: bolder;
    font-style: normal;
 }

 @font-face {
    font-family: "M+ 1m";
    src: local("M+ 1m"),
         url("http://mplus-fonts.sourceforge.jp/webfonts/mplus-1m-regular.ttf")
         format("truetype");
    font-weight: normal;
    font-style: normal;
 }

 @font-face {
    font-family: "M+ 1m";
    src: local("M+ 1m"),
         url("http://mplus-fonts.sourceforge.jp/webfonts/mplus-1m-bold.ttf")
         format("truetype");
    font-weight: bold;
    font-style: normal;
 }
diff --git a/cheatsheet_xhtml-1.1.html b/cheatsheet_xhtml-1.1.html
 <?xml version="1.0" encoding="UTF-8"?>
 <!DOCTYPE html
 PUBLIC "-//W3C//DTD XHTML 1.1//EN"
 "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
 <html
 xmlns="http://www.w3.org/1999/xhtml"
 xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
 xsi:schemaLocation="http://www.w3.org/MarkUp/SCHEMA/xhtml11.xsd"
 xml:lang="en"
 xml:space="preserve"
 dir="ltr" >

 <head>
 <meta http-equiv="Content-Type" content="application/xhtml+xml; charset=UTF-8" />
 <meta http-equiv="Content-Style-Type" content="text/css" />
 <meta http-equiv="Content-Script-Type" content="text/javascript" />
 <meta http-equiv="X-UA-Compatible" content="IE=8" />
 <meta content="Japboy" name="author" />

 <title>{block:PostTitle}{PostTitle} - {/block:PostTitle}{Title}</title>

 <link rel="alternate" type="application/rss+xml" title="RSS" href="{RSS}" />
 <link rel="shortcut icon" href="{Favicon}" />
 <link rev="made" href="mailto:@gmail.com" />
 {block:IndexPage}<link rel="appendix" title="Archive" href="./archive" />{/block:IndexPage}
 <link rel="stylesheet" type="text/css" href="http://yui.yahooapis.com/2.6.0/build/reset-fonts-grids/reset-fonts-grids.css">
 <link rel="stylesheet" media="screen, tv" type="text/css" href="./style/Main.css" />
 <link rel="stylesheet" media="print" type="text/css" href="./style/print.css" />
 </head>

 <body>

 <div class="container" id="head">

 {block:IndexPage}<h1>{Title} <img src="{PortraitURL-30}" /></h1>{/block:IndexPage}
 {block:PostTitle}<h1>{PostTitle}</h1>{/block:PostTitle}

 {block:Description}{Description}{/block:Description}

 </div>

 <hr />

 <div class="container" id="body">

 {block:IndexPage}

 <div class="container" id="main">{block:Posts}

 {block:NewDayDate}<h2>{ShortDayOfWeek} {DayOfMonth} {ShortMonth}</h2>{/block:NewDayDate}{block:SameDayDate}{/block:SameDayDate}

 {block:Text}<div class="post">
 {block:Title} <h3><a href="{Permalink}">{Title}</a></h3>{/block:Title}
 {Body}
 </div>{/block:Text}

 {block:Photo}<div class="post">
 <p><img src="{PhotoURL-250}" alt="{PhotoAlt}" /></p>
 {block:Caption} <p>{Caption}</p>{/block:Caption}
 </div>{/block:Photo}

 {block:Quote}<div class="post">
 <blockquote {block:Source}cite="{Source}"{/block:Source}>
 {Quote}
 {block:Source}<address>{Source}</address>{/block:Source}
 </blockquote>
 </div>{/block:Quote}

 {block:Link}<div class="post">
 <p><a href="{URL}" {Target}>{Name}</a></p>
 {block:Description} <p>{Description}</p>{/block:Description}
 </div> {/block:Link}

 {block:Chat}<div class="post">
 {block:Title}<p><a href="{Permalink}">{Title}</a></p>{/block:Title}
 {block:Lines}
 <ul>
 <li class="{Alt} user_{UserNumber}">
 {block:Label}<span class="label">{Label}</span>{/block:Label}
 {Line}
 </li>
 </ul>
 {/block:Lines}
 </div>{/block:Chat}

 {block:Video}<div class="post">
 {Video-250}
 {block:Caption}<p>{Caption}</p>{/block:Caption}
 </div>{/block:Video}

 {/block:Posts}</div>

 <div class="container" id="sub">

 <p><a href="http://www.l4d.com/">Left 4 Dead</a> is now on Steam! Why don't you get it and play with <a href="http://steamcommunity.com/profiles/76561197991164452/">me</a>? Aye!</p>

 <ul class="toc">
 <li><a href="/archive" tabindex="" accesskey="A">Archive</a></li>
 <li><a href="{RSS}" tabindex="" accesskey="F">Feed</a></li>
 </ul>

 </div>

 {/block:IndexPage}

 {block:PermalinkPage}
 {/block:PermalinkPage}

 </div>

 <div class="container" id="foot">

 {block:Pagination}
 <ul class="snav">
 {block:PreviousPage}<li><a href="{PreviousPage}" tabindex="" accesskey="P">&#171; Previous</a></li>{/block:PreviousPage}
 <li>{CurrentPage} of {TotalPages}</li>
 {block:NextPage}<li><a href="{NextPage}" tabindex="" accesskey="N">Next &#187;</a></li>{/block:NextPage}
 {block:PermalinkPagination} {/block:PermalinkPagination}
 </ul>
 {/block:Pagination}
 {block:PermalinkPagination}
 <ul class="snav">
 {block:PreviousPost}<li><a href="{PreviousPost}s" tabindex="" accesskey="P">&#171; Previous</a></li>{/block:PreviousPost}
 <li>{CurrentPage} of {TotalPages}</li>
 {block:NextPost} <li><a href="{NextPost}" tabindex="" accesskey="N">Next &#187;</a></li>{/block:NextPost}
 </ul>
 {/block:PermalinkPagination}

 <hr />

 <address>&copy; 2008 Japboy</address>

 </div>

 </body>

 </html>
diff --git a/cheatsheet_xhtml5.html b/cheatsheet_xhtml5.html
 <?xml version="1.0" encoding="utf-8"?>
 <!DOCTYPE html>
 <!--Cheatsheet for HTML5
 I would love to follow Python PEP 8 Coding Guide here.
 -->
 <html
 xmlns="http://www.w3.org/2000/xmlns"
 xml:lang="ja-JP"
 xml:space="preserve"
 dir="ltr"
 manifest="./cheatsheet_html5.manifest">
  <head>
    <meta charset="UTF-8"/>
    <meta
     name="application-name"
     content="Name if only this is an application"/>
    <meta
     name="description"
     content="Summary of this page"/>
    <meta
     name="generator"
     content="Name if only this page is generated by a program"/>
    <meta
     name="keywords"
     content="A comma-separated list of keywords that describe this page"/>
    <meta
     name="robots"
     content="A comma-separated list of operators explaining how search engine crawlers should treat the content. 'noarchive' to prevent cached versions, 'noindex' to prevent indexing, 'nofollow' works as the link rel value with the same name, 'NOODP' to block from using Open Directory Project, and 'NOYDIR' to block from using Yahoo directory's descriptions."/>
    <meta name="rights-standard" content="content;CC:BY:SA"/>

    <title>Cheatsheet of HTML 5</title>

    <link
     rel="author"
     href="mailto:[email protected]"
     title="Name of Author"/>
    <link
     rel="alternate feed"
     type="application/rss+xml"
     href="./foo/bar/feed.rss"/>
    <link
     rel="icon"
     href="./foo/bar/favicon.png"/>
    <link
     rel="stylesheet"
     media="screen, tv"
     type="text/css"
     href="./style/Main.css"/>
    <link
     rel="stylesheet"
     media="print"
     type="text/css"
     href="./style/print.css"/>
    <script
     type="text/javascript"
     charset="UTF-8"
     src="./foo/bar/script.js"/>
  </head>

  <body>
    <header>
      <h1>HTML 5 Cheatsheet</h1>
    </header>

    <nav>
      <li>Navigation will be here.</li>
    </nav>

    <article>
      <h1>Article heading</h1>

      <section>
        <h2>Introduction</h2>

        <p>
          HTML is the language for describing the structure of Web pages.
          HTML gives authors the means to:
        </p>
        <ul>
          <li>
            Publish online documents with headings, text, tables, lists,
            photos, etc.
          </li>
          <li>
            Retrieve online information via hypertext links, at
            the click of a button.
          </li>
          <li>
            Design forms for conducting transactions with remote services,
            for use in searching for information, making reservations,
            ordering products, etc.
          </li>
          <li>
            Include spread-sheets, video clips, sound clips, and other
            applications directly in their documents.
          </li>
        </ul>
        <p>
          With HTML, authors describe the structure of pages using
          <em>markup.</em> The <em>elements</em> of the language label
          pieces of content such as <em>paragraphs,</em> <em>lists,</em>
          <em>tables,<em> and so on.
        </p>
      </section>

      <section>
        <h2>Getting started</h2>

        <p>Something will be written here. Bla bla bla bla bla bla...</p>
      </section>
    </article>

    <aside>
      <h1>Aside heading</h1>

      <p>Sub contents will be here.</p>
    </aside>

    <hr/>

    <footer>
      <address>Japboy &lt;[email protected]&gt;</address>
    </footer>
  </body>
 </html>
	<?xml version="1.0" encoding="utf-8"?>
	<feed
	xmlns="http://www.w3.org/2005/Atom"
	xml:lang="ja-JP">

	<author>
	<name>Japboy</name>
	</author>
	<category/>
	<contributor/>
	<generator/>
	<icon/>
	<logo/>
	<id>urn:uuid:60a76c80-d399-11d9-b93C-0003939e0af6</id>
	<link rel="self" href="git://gist.github.com/160000.git/cheatsheet.atom"/>
	<rights/>
	<subtitle/>
	<title>Atom Syndication Format Cheatsheet</title>
	<updated>2003-12-19T11:06:00+09:00</updated>

	<entry>

	<author/>
	<category/>
	<content type="xhtml">
	<div xmlns="http://www.w3.org/2000/xmlns">

	<p>This is the <strong>content</strong>.</p>

	</div>
	</content>
	<contributor/>
	<id/>
	<link/>
	<published/>
	<rights/>
	<source/>
	<summary/>
	<title/>
	<updated/>

	</entry>

	</feed>
	@charset "UTF-8";

	/**
	* Foundation style
	*
	* Appearance order of CSS properties are depends on:
	* http://lab.youck.org/css-property-order.html
	*
	* @project Name of Project
	* @version 0.0.3
	* @package com.github.japboy
	* @author Yu I.
	* @copyright 2011 by Yu I.
	* @cssdoc version 1.0-pre
	* @license Public domain
	*
	* @colordef rgb(255,255,255); white
	*/

	/**
	* Stylesheet initialisation
	* @section reset
	*/
	@import url("http://yui.yahooapis.com/3.3.0/build/cssreset/reset-min.css");

	/* Minimal reset properties
	* {
	margin: 0;
	padding: 0;
	border: 0;
	background-color: transparent;
	color: rgb(0,0,0);
	line-height: 160%;
	font-size: 100%;
	font-weight: normal;
	font-style: normal;
	text-decoration: none;
	}
	*/

	/**
	* The root element
	* @section structure
	* @see http://www.w3.org/TR/html5/semantics.html#the-root-element
	*/
	html {}

	/**
	* Document metadata
	* @section structure
	* @see http://www.w3.org/TR/html5/semantics.html#document-metadata
	*/
	head,
	title,
	base,
	link,
	meta,
	style {}

	/**
	* Scripting
	* @section structure
	* @see http://www.w3.org/TR/html5/semantics.html#scripting-1
	*/
	script,
	noscript {}

	/**
	* Sections
	* @section structure
	* @see http://www.w3.org/TR/html5/semantics.html#sections
	*/
	body,
	section,
	nav,
	article,
	aside,
	h1,
	h2,
	h3,
	h4,
	h5,
	h6
	hgroup,
	header,
	footer,
	address {}

	body {
	padding: 1em;
	}

	h1,
	h2,
	h3,
	h4,
	h5,
	h6 {
	font-weight: bolder;
	}

	/**
	* Grouping content
	* @section structure
	* @see http://www.w3.org/TR/html5/semantics.html#grouping-content
	*/
	p,
	hr,
	br,
	pre,
	dialog,
	blockquote,
	ol,
	ul,
	li,
	dl,
	dt,
	dd {}

	/**
	* Text-level semantics
	* @section structure
	* @see http://www.w3.org/TR/html5/text-level-semantics.html#text-level-semantics
	*/
	a,
	em,
	strong,
	small,
	cite,
	q,
	dfn,
	abbr,
	code,
	var,
	samp,
	kbd,
	sub,
	sup,
	i,
	b,
	mark,
	progress,
	meter,
	time,
	ruby,
	rt,
	rp,
	bdo,
	span {}

	/**
	* Edits
	* @section structure
	* @see http://www.w3.org/TR/html5/text-level-semantics.html#edits
	*/
	ins,
	del {}

	/**
	* Embedded content
	* @section structure
	* @see http://www.w3.org/TR/html5/text-level-semantics.html#embedded-content-1
	*/
	figure,
	img,
	iframe,
	embed,
	object,
	param,
	video,
	audio,
	source,
	canvas,
	map,
	area {}

	/**
	* Tabular data
	* @section structure
	* @see http://www.w3.org/TR/html5/tabular-data.html#tabular-data
	*/
	table,
	caption,
	colgroup,
	col,
	tbody,
	thead,
	tfoot,
	tr,
	td,
	th {}

	/**
	* Forms
	* @section structure
	* @see http://www.w3.org/TR/html5/forms.html#forms
	*/
	form,
	fieldset,
	label,
	input,
	button,
	select,
	datalist,
	optgroup,
	option,
	textarea,
	keygen,
	output {}

	/**
	* Interactive elements
	* @section structure
	* @see http://www.w3.org/TR/html5/interactive-elements.html#interactive-elements
	*/
	details,
	command,
	menu{}

	/**
	* Miscellaneous elements
	* @section structure
	* @see http://www.w3.org/TR/html5/interactive-elements.html#miscellaneous-elements
	*/
	legend,
	div {}
	"use strict";

	// Script should not have many global objects.
	// One for one script is recommended.
	var APP = {};

	APP.my_property = "I My Me Mine.";

	(function () {
	var a = 1,
	b = 2,
	sum = a + b,
	myObject = {}; // Declare all objects first as one line.

	function doForLoop() {
	var i = 0;
	myArray = [1, 2, 3],
	len = myArray.length; // Length of an array should be cached.
	for (i = 0; i < len; i += 1) {
	console.log(myArray[i]);
	}
	}

	function doForInLoop() {
	var i = 0,
	hasOwn = Object.prototype.hasOwnProperty;
	myHash = {
	one: 1,
	two: 2,
	three: 3
	};
	for (i in myHash) {
	// Loop only own properties but extended properties
	if (hasOwn.call(myHash, i)) {
	console.log(i, myHash[i]);
	}
	}
	}

	function doSwitch() {
	var unknown_numer = 0,
	result = '';
	switch (unknown_number) {
	case 0:
	result = "zero";
	break;
	case 1:
	result = "one";
	break;
	default:
	result = "unknown";
	}
	}

	function compareExactly() {
	var zero = 0;
	if (zero === "") {
	// Never be executed.
	}
	}
	});
	<?xml version="1.0" encoding="UTF-8"?>
	<opml
	xmlns="http://www.dlese.org/Metadata/opml"
	xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
	xsi:schemaLocation="http://www.dlese.org/Metadata/opml http://www.dlese.org/Metadata/opml/2.0/opml.xsd"
	version="2.0">

	<head>

	<title>My bookmarks</title>
	<dateCreated></dateCreated>
	<dateModified></dateModified>
	<ownerName>Yu Inao</ownerName>
	<ownerEmail>[email protected]</ownerEmail>
	<expansionState></expansionState>
	<vertScrollState></vertScrollState>
	<windowTop></windowTop>
	<windowLeft></windowLeft>
	<windowBottom></windowBottom>
	<windowRight></windowRight>

	</head>

	<body>

	<outline type="text" text="Feeds">
	<outline type="link" text="http://foo.bar/rss/feed.xml"/>
	<outline type="link" text="http://foo.bar/rss.xml"/>
	<outline type="link" text="http://foo.bar/"/>
	</outline>

	</body>

	</opml>
Inputs		Output
A	B	A or B
False	False	False
True	False	True
False	True	True
True	True	True
	<!DOCTYPE html>
	<!--Cheatsheet for HTML 5
	I've changed mind... HTML doesn't suit for 72 letters limitting in a line.
	Hmmm... I need standards' markup guideline!
	-->
	<html lang="ja-JP" dir="ltr" manifest="./cheatsheet_html5.manifest">
	<head>
	<meta charset="UTF-8">
	<meta name="application-name" content="Name if only this is an application">
	<meta name="description" content="Summary of this page">
	<meta name="generator" content="Name if only this page is generated by a program">
	<meta name="keywords" content="A comma-separated list of keywords that describe this page">
	<meta name="robots" content="A comma-separated list of operators explaining how search engine crawlers should treat the content. 'noarchive' to prevent cached versions, 'noindex' to prevent indexing, 'nofollow' works as the link rel value with the same name, 'NOODP' to block from using Open Directory Project, and 'NOYDIR' to block from using Yahoo directory's descriptions.">
	<meta name="rights-standard" content="content;CC:BY:SA">

	<title>Cheatsheet of HTML 5</title>

	<link rel="author" href="mailto:[email protected]" title="Name of Author">
	<link rel="alternate feed" type="application/rss+xml" href="./foo/bar/feed.rss">
	<link rel="icon" href="./foo/bar/favicon.png">
	<link rel="stylesheet" media="screen, tv" type="text/css" href="./style/Main.css">
	<link rel="stylesheet" media="print" type="text/css" href="./style/print.css">
	<script type="text/javascript" charset="UTF-8" src="./foo/bar/script.js">
	</script>
	</head>

	<body>
	<header>
	<h1>HTML 5 Cheatsheet</h1>
	</header>

	<nav>
	<li>Navigation will be here.</li>
	</nav>

	<article>
	<h1>Article heading</h1>

	<section>
	<h2>Introduction</h2>

	<p>HTML is the language for describing the structure of Web pages. HTML gives authors the means to:</p>
	<ul>
	<li>Publish online documents with headings, text, tables, lists, photos, etc.</li>
	<li>Retrieve online information via hypertext links, at the click of a button.</li>
	<li>Design forms for conducting transactions with remote services, for use in searching for information, making reservations, ordering products, etc.</li>
	<li>Include spread-sheets, video clips, sound clips, and other applications directly in their documents.</li>
	</ul>
	<p>With HTML, authors describe the structure of pages using <em>markup.</em> The <em>elements</em> of the language label pieces of content such as <em>paragraphs,</em> <em>lists,</em> <em>tables,</em> and so on.</p>
	</section>

	<section>
	<h2>Getting started</h2>

	<p>Something will be written here. Bla bla bla bla bla bla...</p>
	</section>
	</article>

	<aside>
	<h1>Aside heading</h1>

	<p>Sub contents will be here.</p>
	</aside>

	<hr>

	<footer>
	<address>Japboy <[email protected]></address>
	</footer>
	</body>
	</html>
	CACHE MANIFEST
	# List files that you'd like to cache on client-side.
	./cheatsheet_html5.html
	@charset "UTF-8";

	/**
	* Web fonts definition
	*
	* @project Webfonts
	* @version 0.0.1
	* @package cheatsheet
	* @author Yu I.
	* @copyright 2010 by Yu I.
	* @cssdoc version 1.0-pre
	* @license CC-BY-SA 3.0 http://creativecommons.org/licenses/by-sa/3.0/
	*/

	/**
	* Web fonts
	* @section font
	*/
	@font-face {
	font-family: "M+ 1p";
	src: local("M+ 1p"),
	url("http://mplus-fonts.sourceforge.jp/webfonts/mplus-1p-regular.ttf")
	format("truetype");
	font-weight: normal;
	font-style: normal;
	}

	@font-face {
	font-family: "M+ 1p";
	src: local("M+ 1p"),
	url("http://mplus-fonts.sourceforge.jp/webfonts/mplus-1p-bold.ttf")
	format("truetype");
	font-weight: bold;
	font-style: normal;
	}

	@font-face {
	font-family: "M+ 1p";
	src: local("M+ 1p"),
	url("http://mplus-fonts.sourceforge.jp/webfonts/mplus-1p-heavy.ttf")
	format("truetype");
	font-weight: bolder;
	font-style: normal;
	}

	@font-face {
	font-family: "M+ 1m";
	src: local("M+ 1m"),
	url("http://mplus-fonts.sourceforge.jp/webfonts/mplus-1m-regular.ttf")
	format("truetype");
	font-weight: normal;
	font-style: normal;
	}

	@font-face {
	font-family: "M+ 1m";
	src: local("M+ 1m"),
	url("http://mplus-fonts.sourceforge.jp/webfonts/mplus-1m-bold.ttf")
	format("truetype");
	font-weight: bold;
	font-style: normal;
	}
	<?xml version="1.0" encoding="UTF-8"?>
	<!DOCTYPE html
	PUBLIC "-//W3C//DTD XHTML 1.1//EN"
	"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
	<html
	xmlns="http://www.w3.org/1999/xhtml"
	xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
	xsi:schemaLocation="http://www.w3.org/MarkUp/SCHEMA/xhtml11.xsd"
	xml:lang="en"
	xml:space="preserve"
	dir="ltr" >

	<head>
	<meta http-equiv="Content-Type" content="application/xhtml+xml; charset=UTF-8" />
	<meta http-equiv="Content-Style-Type" content="text/css" />
	<meta http-equiv="Content-Script-Type" content="text/javascript" />
	<meta http-equiv="X-UA-Compatible" content="IE=8" />
	<meta content="Japboy" name="author" />

	<title>{block:PostTitle}{PostTitle} - {/block:PostTitle}{Title}</title>

	<link rel="alternate" type="application/rss+xml" title="RSS" href="{RSS}" />
	<link rel="shortcut icon" href="{Favicon}" />
	<link rev="made" href="mailto:@gmail.com" />
	{block:IndexPage}<link rel="appendix" title="Archive" href="./archive" />{/block:IndexPage}
	<link rel="stylesheet" type="text/css" href="http://yui.yahooapis.com/2.6.0/build/reset-fonts-grids/reset-fonts-grids.css">
	<link rel="stylesheet" media="screen, tv" type="text/css" href="./style/Main.css" />
	<link rel="stylesheet" media="print" type="text/css" href="./style/print.css" />
	</head>

	<body>

	<div class="container" id="head">

	{block:IndexPage}<h1>{Title} <img src="{PortraitURL-30}" /></h1>{/block:IndexPage}
	{block:PostTitle}<h1>{PostTitle}</h1>{/block:PostTitle}

	{block:Description}{Description}{/block:Description}

	</div>

	<hr />

	<div class="container" id="body">

	{block:IndexPage}

	<div class="container" id="main">{block:Posts}

	{block:NewDayDate}<h2>{ShortDayOfWeek} {DayOfMonth} {ShortMonth}</h2>{/block:NewDayDate}{block:SameDayDate}{/block:SameDayDate}

	{block:Text}<div class="post">
	{block:Title} <h3><a href="{Permalink}">{Title}</a></h3>{/block:Title}
	{Body}
	</div>{/block:Text}

	{block:Photo}<div class="post">
	<p><img src="{PhotoURL-250}" alt="{PhotoAlt}" /></p>
	{block:Caption} <p>{Caption}</p>{/block:Caption}
	</div>{/block:Photo}

	{block:Quote}<div class="post">
	<blockquote {block:Source}cite="{Source}"{/block:Source}>
	{Quote}
	{block:Source}<address>{Source}</address>{/block:Source}
	</blockquote>
	</div>{/block:Quote}

	{block:Link}<div class="post">
	<p><a href="{URL}" {Target}>{Name}</a></p>
	{block:Description} <p>{Description}</p>{/block:Description}
	</div> {/block:Link}

	{block:Chat}<div class="post">
	{block:Title}<p><a href="{Permalink}">{Title}</a></p>{/block:Title}
	{block:Lines}
	<ul>
	<li class="{Alt} user_{UserNumber}">
	{block:Label}<span class="label">{Label}</span>{/block:Label}
	{Line}
	</li>
	</ul>
	{/block:Lines}
	</div>{/block:Chat}

	{block:Video}<div class="post">
	{Video-250}
	{block:Caption}<p>{Caption}</p>{/block:Caption}
	</div>{/block:Video}

	{/block:Posts}</div>

	<div class="container" id="sub">

	<p><a href="http://www.l4d.com/">Left 4 Dead</a> is now on Steam! Why don't you get it and play with <a href="http://steamcommunity.com/profiles/76561197991164452/">me</a>? Aye!</p>

	<ul class="toc">
	<li><a href="/archive" tabindex="" accesskey="A">Archive</a></li>
	<li><a href="{RSS}" tabindex="" accesskey="F">Feed</a></li>
	</ul>

	</div>

	{/block:IndexPage}

	{block:PermalinkPage}
	{/block:PermalinkPage}

	</div>

	<div class="container" id="foot">

	{block:Pagination}
	<ul class="snav">
	{block:PreviousPage}<li><a href="{PreviousPage}" tabindex="" accesskey="P">« Previous</a></li>{/block:PreviousPage}
	<li>{CurrentPage} of {TotalPages}</li>
	{block:NextPage}<li><a href="{NextPage}" tabindex="" accesskey="N">Next »</a></li>{/block:NextPage}
	{block:PermalinkPagination} {/block:PermalinkPagination}
	</ul>
	{/block:Pagination}
	{block:PermalinkPagination}
	<ul class="snav">
	{block:PreviousPost}<li><a href="{PreviousPost}s" tabindex="" accesskey="P">« Previous</a></li>{/block:PreviousPost}
	<li>{CurrentPage} of {TotalPages}</li>
	{block:NextPost} <li><a href="{NextPost}" tabindex="" accesskey="N">Next »</a></li>{/block:NextPost}
	</ul>
	{/block:PermalinkPagination}

	<hr />

	<address>© 2008 Japboy</address>

	</div>

	</body>

	</html>
	<?xml version="1.0" encoding="utf-8"?>
	<!DOCTYPE html>
	<!--Cheatsheet for HTML5
	I would love to follow Python PEP 8 Coding Guide here.
	-->
	<html
	xmlns="http://www.w3.org/2000/xmlns"
	xml:lang="ja-JP"
	xml:space="preserve"
	dir="ltr"
	manifest="./cheatsheet_html5.manifest">
	<head>
	<meta charset="UTF-8"/>
	<meta
	name="application-name"
	content="Name if only this is an application"/>
	<meta
	name="description"
	content="Summary of this page"/>
	<meta
	name="generator"
	content="Name if only this page is generated by a program"/>
	<meta
	name="keywords"
	content="A comma-separated list of keywords that describe this page"/>
	<meta
	name="robots"
	content="A comma-separated list of operators explaining how search engine crawlers should treat the content. 'noarchive' to prevent cached versions, 'noindex' to prevent indexing, 'nofollow' works as the link rel value with the same name, 'NOODP' to block from using Open Directory Project, and 'NOYDIR' to block from using Yahoo directory's descriptions."/>
	<meta name="rights-standard" content="content;CC:BY:SA"/>

	<title>Cheatsheet of HTML 5</title>

	<link
	rel="author"
	href="mailto:[email protected]"
	title="Name of Author"/>
	<link
	rel="alternate feed"
	type="application/rss+xml"
	href="./foo/bar/feed.rss"/>
	<link
	rel="icon"
	href="./foo/bar/favicon.png"/>
	<link
	rel="stylesheet"
	media="screen, tv"
	type="text/css"
	href="./style/Main.css"/>
	<link
	rel="stylesheet"
	media="print"
	type="text/css"
	href="./style/print.css"/>
	<script
	type="text/javascript"
	charset="UTF-8"
	src="./foo/bar/script.js"/>
	</head>

	<body>
	<header>
	<h1>HTML 5 Cheatsheet</h1>
	</header>

	<nav>
	<li>Navigation will be here.</li>
	</nav>

	<article>
	<h1>Article heading</h1>

	<section>
	<h2>Introduction</h2>

	<p>
	HTML is the language for describing the structure of Web pages.
	HTML gives authors the means to:
	</p>
	<ul>
	<li>
	Publish online documents with headings, text, tables, lists,
	photos, etc.
	</li>
	<li>
	Retrieve online information via hypertext links, at
	the click of a button.
	</li>
	<li>
	Design forms for conducting transactions with remote services,
	for use in searching for information, making reservations,
	ordering products, etc.
	</li>
	<li>
	Include spread-sheets, video clips, sound clips, and other
	applications directly in their documents.
	</li>
	</ul>
	<p>
	With HTML, authors describe the structure of pages using
	<em>markup.</em> The <em>elements</em> of the language label
	pieces of content such as <em>paragraphs,</em> <em>lists,</em>
	<em>tables,<em> and so on.
	</p>
	</section>

	<section>
	<h2>Getting started</h2>

	<p>Something will be written here. Bla bla bla bla bla bla...</p>
	</section>
	</article>

	<aside>
	<h1>Aside heading</h1>

	<p>Sub contents will be here.</p>
	</aside>

	<hr/>

	<footer>
	<address>Japboy <[email protected]></address>
	</footer>
	</body>
	</html>