メンテナンス覚え書き


◆2013年8〜10月のメンテナンスのあらましについて

◎目的

従来はPCとガラケーでの動作確認をしていたが、近年のスマホやタブレットの普及が著しいため、それらでの利便性を向上させたいと考え、タッチデバイスや小画面への対応(ナビゲーションの改善、見え方の改善、軽快性の向上)を主目的としたメンテナンスを実施したもの。
なお、トップページの基本デザイン(3カラムでのリキッドデザイン)は変更なし。

◎やったこと・成果

軽快性の向上・メンテナンス性の向上
・・・メリットの少ないスクリプト等の整理をするとともに、CSSファイルを細分化(装飾用とナビゲーション用)した。CSSファイル細分化が逆に読込速度を悪化させたようなので、トップページはHTMLへの再インライン化を図った。また、無駄に大きなサイズの画像を縮小化するとともに、主として画像について明示的にブラウザキャッシュ活用を図った(.htaccessを編集)。

見栄えの改善
・・・tableの罫線をすっきりさせた。

タッチデバイス・小画面対応
・・・各ページに、常時表示される「先頭に戻る」リンクを設置→マウスでは正常動作するが、タッチデバイスでの動作が安定しない。PCやガラケーでは表示されないため気付かなかったが、もしかするとFC2無料Webサーバー利用に伴う広告画像挿入が動作を阻んでいる(?)。

◆ナビゲーション改善の副作用

常時表示される「先頭に戻る」リンクの設置のためにHTML4.01Strict化を迫られ、とりあえずトップページのコード整合性を高めている過程でガラケー(CSS非対応)での文字色変更が無効になってしまった。残念。

◎利用ツール

Google ウェブマスターツール、Google Analytics、Google PageSpeed Insights、Firebug Add-ons for Firefox、Another HTML-lint gateway など。
※「Google Analytics」はアクセス解析ツール。解析対象のページに貼り付けてあるトラッキングコード(現状ではトップページのみ)はjavascript。javascriptが動かない場合にWebサーバーサイドで動作するコード(PHP、Perl、JSP、ASPXのいずれか)も用意されているが、FC2無料Webサーバーでは利用できないようで残念。
※「Firebug」はFirefox専用ツールで、使い始めたばかり。CSSの適用関係などがリアルタイムに目視でき、CSSを分かっていない当方が試行錯誤しながらデザインするに最強なツールかも。


北条(きたじょう)商工会 HOMEへ

inserted by FC2 system