miguel-perez/demo.md

## demo.md

      
    Raw
  

              demo.md
            
          
    Setting up document encoding for i18n

Questions? Hit me up: @Tayokoart

  
## index-correct.html
<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8"> <!-- Setting up the document's encoding. --->
        <title>Category</title>
    </head>
    <body>
        <div class="wl-language-select">
            <p class="link" href="login-register.html" title="Select Language">Select Language <span class="ico"></span></p>
            <div class="drop">
                <!--
                    1. List language name in their own language.
                    2. Use lang, dir, and hreflang as needed.
                    3. UTF-8 encoding will allow us to aviod html character escapes.
                    4. Don't lose the user's place on the site when switching languages.
                --->
                <ul class="list">
                    <li class="item"><a href="/index.html" class="link">English</a></li>
                    <li lang="es" class="item"><a href="/es/index.html" hreflang="es" class="link">Español</a></li>
                    <li lang="ja" class="item"><a href="/ja/index.html" hreflang="ja" class="link">日本語</a></li>
                    <li lang="ar" dir="rtl" class="item"><a href="/ar/index.html" hreflang="ar" class="link">العربية</a></li>
                </ul>
            </div>
        </div>
    </body>
</html>

## index-incorrect.html
<!-- Avoid html escapes for all non syntaxt or invisible characters -->
<ul class="list">
    <li class="item"><a href="/en/index.html" class="link">English</a></li>
    <li class="item"><a href="/es/index.html" class="link">Espa&ntilde;ol</a></li>
    <li class="item"><a href="/ja/index.html" class="link">&#x65e5;&#x672c;&#x8a9e;</a></li>
    <li class="item"><a href="/ar/index.html" class="link">&#x0627;&#x0644;&#x0639;&#x0631;&#x0628;&#x064a;&#x0629;</a></li>
</ul>
	<!DOCTYPE html>
	<html lang="en">
	<head>
	<meta charset="UTF-8"> <!-- Setting up the document's encoding. --->
	<title>Category</title>
	</head>
	<body>
	<div class="wl-language-select">
	<p class="link" href="login-register.html" title="Select Language">Select Language <span class="ico"></span></p>
	<div class="drop">
	<!--
	1. List language name in their own language.
	2. Use lang, dir, and hreflang as needed.
	3. UTF-8 encoding will allow us to aviod html character escapes.
	4. Don't lose the user's place on the site when switching languages.
	--->
	<ul class="list">
	<li class="item"><a href="/index.html" class="link">English</a></li>
	<li lang="es" class="item"><a href="/es/index.html" hreflang="es" class="link">Español</a></li>
	<li lang="ja" class="item"><a href="/ja/index.html" hreflang="ja" class="link">日本語</a></li>
	<li lang="ar" dir="rtl" class="item"><a href="/ar/index.html" hreflang="ar" class="link">العربية</a></li>
	</ul>
	</div>
	</div>
	</body>
	</html>
	<!-- Avoid html escapes for all non syntaxt or invisible characters -->
	<ul class="list">
	<li class="item"><a href="/en/index.html" class="link">English</a></li>
	<li class="item"><a href="/es/index.html" class="link">Español</a></li>
	<li class="item"><a href="/ja/index.html" class="link">日本語</a></li>
	<li class="item"><a href="/ar/index.html" class="link">العربية</a></li>
	</ul>