HTML

3 posts

HTMLでのルビ付けプログラム

ブログの更新が滞っていて、「PDF教材をHTMLに変換する」という記事を書いてから、もう一年近くになります。

その時はプログラムの内容を殆ど何も書かなかったので、
今回はPythonで書いたプログラムの内容と、
それを機に、同じことをTypescript(Javascript)、GO、C++で書いてみたので、これらの言語の比較・感想を書いてみます。

最初に、ルビ付けプログラムの基本的考え方をみます。

簡単にいえば、辞書を用意しておいて、文書の中で当該漢字が出てくれば、その漢字をルビづけのHTML文字列で置き換えればいいのです。

文字列がコンピュータの中でどのように扱われているかは結構複雑で難しい問題ですが、
現在のプログラミング言語では、低レベルの仕組みを熟知していなくても、プログラミングできるようになっています。

文書の中で特定の文字を探し出し、他の文字と置換する関数(仕組み)は、大抵は2種類用意されています。

一つは文章の中に、示された文字列が完全に一致する文字列が含まれているかどうを探すいわば原始的探索で、もう一つはもっと複雑な質問に答える正規表現というものです。

正規表現のお馴染みのものはワイルドカードで、たとえば文書ファイルをみつけるために「*」を使って、「*.txt」と書いて拡張子が[txt]の文書にマッチするものをすべて探し出します。

昔私がPerlを頻繁に使用していたのは、Perlの正規表現がとても強くまた使いやすかったからです。

現在プログラミング言語としてのPerlは人気がなくなりましたが、最近のプログラミング言語は皆Perlを見習って、正規表現の充実を図っています。

今回の作業は、しかし、正規表現を使うまでもないと思います。

続きを読む

PDF教材をHTMLに変換する 2

「学校」にフリガナをつけると下のようになります。

学校 がっこう

手書きや、印刷では「学校」の文字の上に専用の小さいかなを付けているのでしょうが、
WEBではどのようになっているのでしょうか。

WEBでフリガナをつけるには次のような記号列が必要です。
(以下の文を仮にHTML文ということにします)。

<ruby> <rb>学校</rb> <rp>(</rp> <rt>がっこう</rt> <rp>)</rp> </ruby>

これをブラウザ(Micosoft EgeとかChrome)が解釈して、上のように「学校」の上にルビをつけます。

上のHTML文で「(」と「)」で囲まれた部分は、ブラウザが正しくルビが付けられなかったとき、
かっこでかなをつけることになります。

 

さて、教材でカナが付けられたているところは、
全部上のようなHTML文にしなければいけません。

続きを読む

PDF教材をHTMLに変換する 1

長い間プログラムを書いていなかったのですが、
児童用のPDF教材をWEB用に書き換える手伝い仕事で、
短いプログラムを書きました。

 

PDFをそのままWEB画面に貼り付けるのではなく、
内容はそのままに、新たにWEBのサイトを作るのです。

与えられた材料は、PDFファイルだけです。

主な作業は次のようなものです。

① PDFから文字と画像を取り出す。

② 画像と文字をHTMLファイルに書き込む。

③ 一部の漢字にはルビを振り、
PDFと同じようなレイアウトをし、
ボタンを押すと動画を表示するようにする。

 

そもそもPDFがあるということは、
恐らく、アドビ・イラストレータかInDesignを使っているのでしょうから、
電子データがあるのでしょう。
ということは、その電子データから直接画像なり、文章なりを抽出すれば、
全く簡単で正確な情報が得られるのに、どうしてこうなったのでしょうか。
著作権が問題だったのでしょうか。

 

まず①の仕事。
当然、手作業で書き写すわけにはいきません。

画像と文字を抽出するのに、
無料のソフト、確か画像抽出ではPDFTools、文字抽出にはABBYY FineReaderを使いました。

私は、古いAdobe Acrobatを持っていますので試したのですが、
これより上記のソフトの方がよく働いてくれました。

続きを読む