![[PukiWiki]](image/tomarufront.png "[PukiWiki]")
テキストを作るときには、まずは \( \LaTeX \) で作成する。 \( \LaTeX \) source file をコンパイルして、 PDFファイルを作る。 これが正本。
同じ \( \LaTeX \) source file を TTH で処理して、 htmlファイルを作成する。 これが、htmlコンバート版の元ファイル。 この、html ファイルを少し触って完成させる。
このやり方が作り易いと思ったのでした。
\( \LaTeX \) source file の作り方は……（省略）。 このあたり にメモはある。
$ uplatex source; dvipdfmx source
これで PDFファイルが完成。
\( \LaTeX \) source file から htmlファイルを作成するのには いくつかプログラムがあって、例えば、htlatex は TeX Live に 元々入っている。 しかし、htlatex は、いい感じの PDFファイルが出来るように 調整した \( \LaTeX \) source file をそのまま処理するのは不得意 （事実上不可能）。 ずっと以前は latex2HTML を使っていたのだけれどインストールが面倒で （今はマシンが違うのでインストールし直さなければならなかったのです）。
そこで、今回、別なプログラムを使ってみた。
それが、TTH。
ホームページは↓
http://hutchinson.belmont.ma.us/tth/
プラズマ物理学を専門としている Ian H. Hutchinson さん （http://www.psfc.mit.edu/people/faculty/ian-h-hutchinson または http://hutchinson.belmont.ma.us/hutchinson/ian.html Plasma Science and Fusion Center, Massachusetts Institute of Technology）の作。
数式も簡単な方法で html に変換してくれる。 また、html の文法が厳しくなるに従って、タグがややこしいのはイヤだよね〜、 との考えもあって、デフォルト設定では <head> と <body> のタグさえ出力しない。 でも、これくらいはほしいという人（←ワタシも、です）にはと、-w1 オプションを付ければ出力するよ、として下さっている。ありがたや。
http://hutchinson.belmont.ma.us/tth/distribution.html にある link to download list から Windows executable（zip圧縮）をダウンロード
解凍し、tth_exe フォルダ毎、/usr/local/bin/ に置いた。
exeファイル本体は
/usr/local/bin/tth_exe/tth.exe
にあるので、path を通す （Windows10 では再起動しなくてよい*1）。
PDFファイルと一緒に作成すればいいので
$ uplatex source; dvipdfmx source; tth -w1 source
でおっけい
\( \LaTeX \) で hyperref を使ってリンクを作っておくと、 きちんと <a href="○○"> としてページ内リンクや外部リンク を作ってくれる。 目次から小見出しへ、また本文から文献やフッタに飛びます。
TTH で処理して作った htmlファイルには図は取り込まれず （<img src="○○"> などにはならず）、 図へのリンクが作成される （ <a href="○○">Figure</a> となる）。 そこで、クリック（タップ）不要の１枚物（？）の htmlファイルにするためには、 図のリンクを <img src="○○"> に変更しなくてはならない。 この置換は簡単。 これだけ修正すれば最低限はOK。
クラスなしCSSフレームワークとして Water.css を利用すると 読み易さが向上する。 使ったのは lightテーマ（light.css）。
Moodle に置かれたテキストをPCで読むなら、または、印刷して読むのなら、 PDFファイルは適切だと思うのだけれど、 スマートフォンで読むにはあまりよろしくない。 そこで、単純な htmlファイルを作っておけば、一応は読めるけれども、 今度はPCでは読みづらい。
Moodle に置いた htmlファイルは、 ほぼ単独で読めるものを作っておく必要があるので （Moodle は html の環境を作らないため）、 クラスなしCSSフレームワークは便利なのです。 いくつか試したところ、Water.css はなかなかよかったので これを使うことにした。
Moodle に置いた htmlファイルを スマートフォンで開くと、 少し右のマージンが大きくなってしまうので、 少し拡大したほうが読み易くなるのが玉に瑕。 でも、それ以外は、素のhtmlファイルよりずっとよい。 何より、レシポンシブル対応になる。 文字の大きさや英語のフォントなど全体もいい感じになるし、 また、table は１行毎に色が白と薄いグレーの縞々になるし、 quote もカッコいい。
Water.css のデモは↓
https://kognise.github.io/water.css/
ソースファイルは↓から取得
https://github.com/kognise/water.css
htmlファイルの <head> と </head> の間に
<link rel="stylesheet" href="light.css">
と書き、htmlファイルと同じディレクトリに light.css を置けばよい。 Moodle なら、ほかの図のファイルと一緒にアップロードすればよく、 ディレクトリ構造を気にする必要がない。
| Today:1 | Yesterday:1 | Total:1634 since 13 May 2020 |
