2015年8月31日月曜日

スマホ対応しました。

こんにちわ。
お盆期間中からたくさんの方が来られ、私も楽しい時間を過ごさせてもらいました。
本当にありがとうございました。嬉しかったです。

8月を振り返ると、寒暖差の激しいひと月になりましたね。
上旬は38℃近くまで上がり暑くて死ぬかと思えば、
下旬は20度近くまで下がった日もあり肌寒くて風邪ひきそうになりました。
皆さんは大丈夫でしたか?

さてさて、
今更ですが8月1日からスマホ対応に追われてました。
実は6月と7月と「何だか変だな?」という思いはしてたんですが、
原因を調べてみたらスマホ対応がされてないと
Googleからしっかり検索結果を落とされる仕様だったようで…。
これはまずいと慌ててスマホ対応、そしてHPの全面的な見直しをしました。

見た目のデザインは、隠居窯の世界観を表すために私が自分の心に問いかけ、
何度も自問自答しながら作り上げてきた思い入れのあるデザインですので
ほとんど変わってません。
見た目は変わってませんが中身のソースが大きく変わってます。

flashを廃止

スマホなどでは、flash動画は見れません。
なぜならスマホなどで採用されてるgoogleのandroidというOSが
セキュリティ上の観点から対応してないからです。
このflashの廃止の動きはgoogleをはじめ、世界的な流れになっています。
てことで同じように隠居窯のセキュリティ上の観点からも、
flash動画を廃止しました。(トップページで利用してました)
そしてプライベート用と仕事用の両PCのブラウザでもflashは動かさないように設定しました。
そのうちPCからもアンインストールの予定です。

表示幅768px、480px、320pxに対応

以前はスマホのように画面が狭くなると表示崩れを起こしていたのですが
これに対応するべく3つの幅のcssを用意しました。
(後からこんなに要らなかったかなと思いましたが…w)
その為に画像による見栄えはある程度妥協しまして
「隠居窯がお知らせしたい情報をきちんと知ることができる」という事を重視して
右上にアイコンを配置して、テキストベースでのページ作りに変えて、
本文も見栄えも細やかな微調整をしました。
どうしても実機が無いので、基本的にandroidエミュレータによる確認だけですが…。

データはhttp外へ

隠居窯のHPではお客様の個人情報などの重要な情報は一切置いてないのですが
(お金の決済や、ユーザー会員登録するようなサイトじゃないですしね)
一応、セキュリティ上の観点からHPで表示するページ以外のデータは
全てhttp外へ移動しました。
これによりURL総当たり攻撃のようなファイル探しをしてきても
データファイルにたどり着くことは決してあり得ません。
これはサーバをレンタルしてるからできる事ですね。

プログラム見直し

予約問い合わせメール送信プログラム、カウンタープログラム、営業日カレンダープログラムを
変数名からアルゴリズムからフローから全てですね、
本当に大変でしたがそのままにしておけなくて見直ししました。
普通に利用してもらってる分には何も変わりはないのですが
セキュリティ上の観点から内部では大きく変わってます。
また、全ページにカウンターを設置しました。
今月下旬からトップページ以外はゼロからのスタートですし、
一定時間内の同一ページ表示ではカウントしませんので、
のんびりとした進行になると思われます。

HTMLソース見直し

まぁこれを書くと恥ずかしいのですが、
今までhtmlのidとclassの定義を適当に考えてまして
idは一意指定、classは複数指定可という前提を無視して
idでもclassでもガンガン重複した名前付けをしてたんです^^;
これをhtmlドキュメント準拠に則って名前付けをすべて見直しました。

体験日はカレンダーから選択

予約問合せ画面でカレンダーから日付選択できるようになりました。
これはjQueryというJavascript言語で作られたプログラムを利用して動いています。
営業日カレンダー表示があるのに日付は数字入力というのが
常々、心に引っ掛かってはいたんですが今回対応しました。
同じように常々、ラジオボタン、チェックボックスによる選択状態が
非常に見難い、分かりづらいと感じてました。
これの選択肢をオレンジ枠で囲って認識しやすくしました。

apple-touch-iconの作成

これはiPhoneだけなのかな?
実機を持ってないので分かりませんが何やらiPhoneでホーム登録をすると
登録サイトからapple-touch-icon.pngをダウンロードするようになってる模様…。
このpng画像がアイコン画像になるんだそうです。
今までこれが無かったのでサーバーのエラーログにいっぱい載ってまして
折角なので作ってみました。
iPhone持ってない方の為にリンク貼りますが↓これです。
隠居窯のapple-touch-icon
背景をタータン・チェックにして、文字を窪ませて(盛り上がってるように見えますが凹ませました)
中央にスポットライトを当てたら何だか高級感あふれる感じに…w
この古民家工房とちっとも合ってないですがたまには良いかな、こういうのもw

ひとまずこんなもんかな。

今回1か月、html5やスタイルシート、javascript、jquery、perlなどを勉強した結果、
今現在の素晴らしいIT文明に触れたら、やりたい事がいっぱい脳裏に浮かんでくるので
時間は掛かっても少しずつ充実させていきたいですね。

まずはお盆期間中に来てくれたお客様の作品を順次仕上げていかないと!
でも天気が悪くて焼き上がりが遅れそうです。
完成までしばらくお待ちくださいませ~。

0 件のコメント:

コメントを投稿