[[LaTeX入門]] /
[[最初の例>LaTeX入門/最初の例]] /
[[簡単な数式 (1)>LaTeX入門/簡単な数式(1)]] /
[[簡単な数式 (2)>LaTeX入門/簡単な数式(2)]] /
[[各種パッケージの利用>LaTeX入門/各種パッケージの利用]] /
[[レポート>LaTeX入門/レポート]] /
HTML と LaTeX の比較 /
[[複雑な数式>LaTeX入門/複雑な数式]] /
[[図表>LaTeX入門/図表]] /
[[図表の配置>LaTeX入門/図表の配置]] /
[[相互参照とリンク>LaTeX入門/相互参照とリンク]] /
[[文献引用]] /
[[索引作成]] /
[[LaTeX マクロの作成>LaTeX入門/LaTeXマクロの作成]] /
[[スライドの作り方（jsarticle 編）>LaTeX入門/スライドの作り方（jsarticle編）]] /
[[応用的な使い方>LaTeX入門/応用的な使い方]]
[[応用的な使い方>LaTeX入門/応用的な使い方]] /
[[発展編>LaTeX入門/発展編]]

----


* HTML と LaTeX の比較 [#g8b7bce6]

Web ページを記述する際に使われるのが，HTML とよばれるマークアップ言語です。
ここで HTML と LaTeX の特徴を比較し，LaTeX の理解につなげましょう。

#contents


** HTML と LaTeX の共通点 [#w65cad6d]

LaTeX も HTML も「普通のテキストの中に文書整形の命令を埋め込む」という点で共通しており，この2つに対応関係を見ることが出来ます。
したがって，LaTeX を知っている人なら，HTML を覚えて Web ページを書くことも簡単に出来ると思います。

HTML と LaTeX には次のような対応関係があります。

|''HTML''                  |''LaTeX''|
|<!DOCTYPE html>&br;<html lang="ja">|\documentclass[uplatex,dvipdfmx,ja=standard]{bxjsarticle}|
|<!DOCTYPE html>&br;<html lang="ja">|\documentclass…|
|<head>                    |プリアンブル開始|
|<meta charset="UTF-8">    ||
|<title>...</title>        |\title{題名}|
|                          |\author{著者}|
|                          |\date{日付}|
|<link rel="stylesheet" type="text/css" href="hoge.css">|スタイルシートに対応するものはドキュメントクラスとパッケージ&br;\usepackage{newtxtext,newtxmath}|
|</head>                   |プリアンブル終了|
|<body>                    |\begin{document}|
|                          |\maketitle|
|<h1>...</h1>              |\section{節見出し}|
|<h2>...</h2>              |\subsection{小節見出し}|
|<h3>...</h3>              |\subsubsection{小々節見出し}|
|<p>...</p>                |段落の区切りは \par または空行で表す|
|...<br>...                |段落の途中の強制改行は \\&br;（TeX では強制改行はあまり使わない）|
|<blockquote>...</blockquote>|\begin{quote}...\end{quote}&br;頭を字下げしない引用|
|<blockquote>...</blockquote>|\begin{quotation}...\end{quotation}&br;頭を字下げする引用|
|<ul>&br;<li>...&br;<li>...&br;</ul>|\begin{itemize}&br;\item ...&br;\item ...&br;\end{itemize}&br;単なる箇条書き|
|<ol>&br;<li>...&br;<li>...&br;</ol>|\begin{enumerate}&br;\item ...&br;\item ...&br;\end{enumerate}&br;番号つき箇条書き|
|<!-- ... -->              |% パーセントから行末までコメント|
|<pre>...</pre>            |\begin{verbatim}...\end{verbatim}&br;そのまま出力|
|</body>                   |\end{document}|
|</html>                   ||

** HTML と LaTeX の相違点 [#f715fbb2]

逆に，HTML と LaTeX の大きく異なる点として「LaTeX はマクロの作成によって semantic に記述できる」ことが挙げられます。
LaTeX マクロの作成方法は後で [[LaTeX マクロの作成>LaTeX入門/LaTeXマクロの作成]] で扱います。

買い物リストを例に考えると，HTML では次のように視覚レイアウトを直接記述するだけになってしまいます。

 <ol>
  <li>
   <dt>品目</dt>
     <dd>書籍</dd>
   <dt>タイトル</dt>
     <dd>［改訂第6版］LaTeX2e 美文書作成入門</dd>
     <dd>［改訂第9版］LaTeX 美文書作成入門</dd>
   <dt>本体価格</dt>
     <dd>3,200 円</dd>
     <dd>3,300 円</dd>
  </li>
  <li>
   <dt>品目</dt>
     <dd>DVD</dd>
   <dt>タイトル</dt>
     <dd>No Name</dd>
   <dt>本体価格</dt>
     <dd>4,000 円</dd>
  </li>
 </ol>

これを semantic web の概念((W3C の Timothy John Berners-Lee が提唱したものです。参考：[[Semantic Web:http://www.w3.org/standards/semanticweb/]]))に基づいて XML で記述すると，次のようになるはずです。
 <ShoppingList>
  <product type = "書籍">
    <title>［改訂第6版］LaTeX2e 美文書作成入門</title>
    <price unit = "yen">3,200</price>
    <title>［改訂第9版］LaTeX 美文書作成入門</title>
    <price unit = "yen">3,300</price>
  </product>
  <product type = "DVD">
    <title>No Name</title>
    <price unit = "yen">4,000</price>
  </product>
 </ShoppingList>

全ての要素を semantic に記述する必要はありませんが，LaTeX は HTML に比べて意味的な論理構造を記述するのに適しています。