Generate Chapters (#1252)

Co-authored-by: bazzadp <[email protected]>

src/templates/en/2019/chapters/css.html

@@ -439,9 +439,7 @@ <h3 id="popular-z-index-values"><a href="#popular-z-index-values" class="anchor-
   <figcaption id="fig21-caption"><a href="#fig-21" class="anchor-link">Figure 21.</a> Most frequently used <code>z-index</code> values.</figcaption>
 </figure>
 <figure id="fig-22">
-  <div class="really-big-number">
-    999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999 !important
-  </div>
+  <div class="really-big-number">999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999 !important</div>
   <figcaption><a href="#fig-22" class="anchor-link">Figure 22.</a> The largest known <code>z-index</code> value.</figcaption>
 </figure>
 <h2 id="decoration"><a href="#decoration" class="anchor-link">Decoration</a></h2>

src/templates/es/2019/chapters/css.html

@@ -439,9 +439,7 @@ <h3 id="valores-populares-de-z-index"><a href="#valores-populares-de-z-index" cl
   <figcaption id="fig21-caption"><a href="#fig-21" class="anchor-link">Figura 21.</a> Los valores de <code>z-index</code> más utilizados.</figcaption>
 </figure>
 <figure id="fig-22">
-  <div class="really-big-number">
-    999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999 !important
-  </div>
+  <div class="really-big-number">999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999 !important</div>
   <figcaption><a href="#fig-22" class="anchor-link">Figura 22.</a> El valor de <code>z-index</code> más grande conocido.</figcaption>
 </figure>
 <h2 id="decoración"><a href="#decoración" class="anchor-link">Decoración</a></h2>

src/templates/ja/2019/chapters/cms.html

@@ -186,7 +186,7 @@ <h3 id="リソースの総使用量"><a href="#リソースの総使用量" clas
 </figure>
 <p>上の図6と7では、デスクトップCMSページの中央値は86のリソースと2.29MBの重さをロードしていることがわかります。モバイルページのリソース使用量は、83のリソースと2.25 MBと、それほど大きくはありません。</p>
 <p>中央値は、すべてのCMSページが上か下かの中間点を示しています。つまり全CMSページの半分はリクエスト数が少なく、重量が少ないのに対し、半分はリクエスト数が多く、重量が多いということになります。10パーセンタイルではモバイルとデスクトップのページはリクエスト数が40以下で重量が1MBですが、90パーセンタイルではリクエスト数が170以上で重量が7MBとなり、中央値の3倍近くになっています。</p>
-<p>CMSのページは、ウェブ全体のページと比較してどうでしょうか？ <a href="./page-weight">ページ重量</a>の章では、リソースの使用量についてのデータを見つけることができます。中央値では、デスクトップページは74リクエストで1.9MBを読み込み、ウェブ上のモバイルページは69リクエストで1.7MBを読み込みます。中央値では、CMSページはこれを上回っています。また、CMSページは90パーセンタイルでウェブ上のリソースを上回っていますが、その差はもっと小さいです。要するに、CMSページは最も重いページの1つと考えられます。</p>
+<p>CMSのページは、ウェブ全体のページと比較してどうでしょうか？　<a href="./page-weight">ページ重量</a>の章では、リソースの使用量についてのデータを見つけることができます。中央値では、デスクトップページは74リクエストで1.9MBを読み込み、ウェブ上のモバイルページは69リクエストで1.7MBを読み込みます。中央値では、CMSページはこれを上回っています。また、CMSページは90パーセンタイルでウェブ上のリソースを上回っていますが、その差はもっと小さいです。要するに、CMSページは最も重いページの1つと考えられます。</p>
 <figure id="fig-8">
   <div class="table-wrap">
     <div class="table-wrap-container">

src/templates/ja/2019/chapters/css.html

@@ -439,9 +439,7 @@ <h3 id="人気のあるz-index値"><a href="#人気のあるz-index値" class="a
   <figcaption id="fig21-caption"><a href="#fig-21" class="anchor-link">図 21.</a>最も頻繁に使用される<code>z-index</code>値。</figcaption>
 </figure>
 <figure id="fig-22">
-  <div class="really-big-number">
-    999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999 !important
-  </div>
+  <div class="really-big-number">999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999 !important</div>
   <figcaption><a href="#fig-21" class="anchor-link">図 21.</a>最も頻繁に使用される<code>z-index</code>値。</figcaption>
 </figure>
 <h2 id="デコレーション"><a href="#デコレーション" class="anchor-link">デコレーション</a></h2>

src/templates/ja/2019/chapters/fonts.html

@@ -574,7 +574,7 @@ <h2 id="見えない文字との戦い"><a href="#見えない文字との戦い
 <p>
   私はこれが時間の経過とともに忍び寄ってくることを想定しています、特に今は<a href="https://www.zachleat.com/web/google-fonts-display/">Google Fontsがすべての新しいコードスニペットに <code>font-display</code> を追加しています</a>が彼らのサイトからコピーされています。
 </p>
-<p>Google Fontsを使っているなら、スニペットを更新しよう！　Google Fontsを使っていない場合は、<code>font-display</code>を使いましょう！ <code>font-display</code>についての詳細は <a href="https://developer.mozilla.org/ja/docs/Web/CSS/@font-face/font-display">MDN</a> を参照してください。</p>
+<p>Google Fontsを使っているなら、スニペットを更新しよう！　Google Fontsを使っていない場合は、<code>font-display</code>を使いましょう！　<code>font-display</code>についての詳細は <a href="https://developer.mozilla.org/ja/docs/Web/CSS/@font-face/font-display">MDN</a> を参照してください。</p>
 <p>どのような<code>font-display</code>値が人気あるのか見てみましょう。</p>
 <figure id="fig-11">
   <a href="/static/images/2019/fonts/fig11.png">

src/templates/ja/2019/chapters/markup.html

@@ -69,9 +69,7 @@ <h2 id="方法論"><a href="#方法論" class="anchor-link">方法論</a></h2>
 <p>各ページの要素の名前は、JavaScriptの初期化後DOMより収集されました。</p>
 <p>現実の要素出現数を確認することは標準の要素であっても有用ではありません、検出されたすべての要素の約25%は<code>&lt;div&gt;</code>です。 そして、約17%が<code>&lt;a&gt;</code>で、11%が<code>&lt;span&gt;</code>となっており、これらは10%以上を占める唯一の要素たちです。 言語は<a href="https://www.youtube.com/watch?v=fCn8zs912OE">一般的にこのようなもの</a>ですが、これと比較してみると驚くほど少ない用語が使われています。 さらに、非標準の要素の取り込みを検討してみると、１つのサイトが特定の要素を1000回も使用しているために、とても人気があるように見えてしまい、大きな誤解を招く可能性があります。</p>
 <p>そのような方法を取らず、私達はHixieの元の研究のようにホームページに各要素が少なくとも1回は含まれているサイトの数に着目しました。</p>
-<p class="note">
-  注意: この方法は潜在的なバイアスが無いとは言い切れません。 人気のある製品は複数のサイトで使われています。これにより個々の作成者は意識していない非標準のマークアップが導入されるでしょう。 したがって、この方法は一般的なニーズに対応するのと同じように、作成者の直接的な知識や意識的な採用を意味しないことに注意する必要があります。 調査中に、このような例はいくつか見つかりました。
-</p>
+<p class="note">注意: この方法は潜在的なバイアスが無いとは言い切れません。 人気のある製品は複数のサイトで使われています。これにより個々の作成者は意識していない非標準のマークアップが導入されるでしょう。 したがって、この方法は一般的なニーズに対応するのと同じように、作成者の直接的な知識や意識的な採用を意味しないことに注意する必要があります。 調査中に、このような例はいくつか見つかりました。</p>
 <h2 id="上位の要素と概説"><a href="#上位の要素と概説" class="anchor-link">上位の要素と概説</a></h2>
 <p>2005年、Hixieはページ中に最もよく使用されていて、頻度の少ない上位要素を調査しました。 トップ３は <code>html</code>、<code>head</code>、<code>body</code>でした、これらはオプションなので省略されてもパーサーによって作成されており、彼は興味深いと述べています。 パーサーによる解析後のDOMを使って調査すると、データは普遍的に表示されます。なので、４番目に使用頻度の高い要素からはじめました。 以下は、その時点から現在までのデータの比較です。(ここでは面白いので出現数を含めました)</p>
 <figure id="fig1" data-markdown="1">