どこにも分類できなかったコンテンツの置き場所です。
古い情報が多く、改定予定もないのでご注意を!

2017/09全面改訂の狙い

2017/09/21

目標

クロスブラウザー対応

前回の全面改訂(書評XML化)から14年が経過し、その間に大きな環境変動がありました。
当時はIE全盛時代。HPもIEにさえ対応しておけば良かったのですが、いまやブラウザーシェアではChromeが6割近くを占め、MicrosoftでさえWin10でEdgeに移行しています。 我が家でも私のメインPCはIEなので問題ないですが、家内のPC(Edge)やタブレット(Safari)では書評のページが動きません。と言う訳で今回の改定の第一の目標は、
※Top5のブラウザー=Chrome、IE、Firefox、Edge、Safariでちゃんと動く

HTML5/CSS3対応

改定前のHPは14年前なので、当然ですがHTML4/CSS2で作っていました。
定年前に勤めていた会社ではシステム統制があり、IE11、HTML4、CSS2が基本でしたから、HTML5やCSS3については存在は知っていても中身までは知らなかったのです。改めて調べてみると、なるほど娘(HPのデザインにも関わっている)が「遺物のようなHP」というのもうなずけます。いや、Frameが禁止されてたなんて。。。。
もちろんHTML4/CSS2でも支障は無いのですが、どうせ作り直すならHTML5/CSS3対応にしようと考えました。

脱MS-Access

このHPの書評は以下のように作成しています。

  1. MS-Access(データベースソフト)に入力。Access内で複数の出力形式(クエリ)を作成。
  2. Access機能で出力形式ごとのXMLファイルをエクスポートしてサーバーにアップロード。
  3. クライアント上でjavascriptを使いXMLファイルをXSL(スタイルシートの一種)で変換しHPに表示
  4. 3.がIEにしか対応できていないので、2.のXMLをXSLで変換したHTMLをPC上で作成しアップロード。

問題はMS-Accessです。今は使えてますが、ライセンスの問題でもうすぐ使えなくなりますし、新たに購入するには非常に高価なソフトです。OpenOfficeなど代替のデータベースソフトも探しましたが良いものは無く、Excel化が最も有望と考えました。

達成状況~2017/09時点

※ブラウザー対応はEdgeを除き完了しました。一方、脱Accessは中断しました。
 (どうもiOSーAppleのiPhone/iPod touch/iPad用のOSーとの相性が悪いようなので確認中です)

JQuery(JavaScriptライブラリ)を多用しました。Jqueryがブラウザ対応を吸収してくれるので、あまりブラウザー判定を使用することなくコードを組むことができました。
また、これまで複数のXML(日本語、翻訳、最近読んだ本)や複数のXSL(好きな作家紹介で作家別に作成)を使って居たのですが、これを一本化できました。つまり、このHP上には全書評データを入れた一つのXMLファイルとそれをHTMLに変換する一つのXSLファイルしかなく、Script側で選択/ソート条件条件を与えて表示するように変更しました。
Edgeについては問題個所は特定できている(XSLファイルにjavascriptで選択条件をセットするところ)のですが、対応策が見つかりません。仕方ないので、上記の4.の変換したHTMLの提供を継続することにしました。

HTML5/CSS3対応につてもほぼ完了です。
最初は戸惑いましたが、実際に使ってみると色々便利です。ただ、付け焼刃の知識でやってますので完全にかと問われると自信は有りません。でも、少なくとも趣旨に沿った形にしたつもりです。
なお、旧来からのコンテンツもできる限りHTML5/CSS3対応しましたが(というより、せざるを得なかったのですが)完璧ではありません。な~~んちゃってHTML5/CSS3です。

脱Accessはかなり時間がかかりそうなので、一旦中断です。
実を言うと、今使っているデータベースは1テーブルのシンプルなもので、これをExcel化するのは簡単です(上に書いた1XML化によってこれまで使っていたクエリーさえ不要になったし)。しかし、どうにも半端なシステム屋としてはデータベースの正規化(リレーショナルな著者・書籍・書評の3テーブル)を目指したく、Excel2013あたりから使えるようになったBIツール(PowerQueryなど)を使えば出来そうな事までは確認しました。しかし、結構な時間がかかりそうなので、一旦は今の形でリリースすることにしました。

今後の予定

まずは今回の改定の補正作業です。
今回の改定ではほぼ全ページを変換しました(HTML5/CSS3対応)。注意してやりましたが小さなミスが残っていると思います。気づいたところからその修正をして行きます。
次はEdge対応です。何とか対応策を見つけて、4.の対応を止めてしまいたいと思います(実際にはひと手間なのですが)。

Next Stepは脱Access化というかデータベースの正規化です。
一応、出来そうだという目途は立っているのですが、やれば今回作成したJavaScript/JQueryにも影響が出そうです。どこまでをデータベース側で処理し、どこからをJavaScript/JQueryで処理するのかをよく考えながら、じっくりと進めていきたいと思います。