今日の分の進捗報告です。
今日は、主に調査と仕様の再考察の段階で終わりそうです。
今さらながら、サイトTOPページ、目次ページとも、先日書いたJpegファイルのみを用いた仕様で構築つもりでいましたが、再び、先日一旦諦めたGIFファイルを併用する方式（背景画像にはJpegファイル、文字部分には透過GIFファイルを使用）に可能性があることに気付きました。
というのは、改めてCSSの仕様を復習した際、Javascriptを一切用いなくとも、CSS部分のみで文字や画像の半透明指定ができることに気付いたことです。
（参考ページ：http://simpleism.net/blog/2009/12/translucent-by-javascript。特に前半のコード）
以前、サイトのデザインについて勉強を始めた初期の頃、これらのページは一度拝見して勉強していたのですが、その頃のうる覚え知識の上では、上のサイトの後半にあるような、Javascriptコードの中で特定の画像や文字（タグ）に対して半透明指定をするという理解でいました。
しかし、考えてみれば、それはあくまで動的に半透明指定を行っているだけであり、固定的に初めから特定の画像や文字を半透明指定するだけなら、純粋にCSSの中で指定できるのですよね。非常に初歩的なことなのですが。その点、なぜか勘違いしていました。
先日の記事で、文字部分だけ画像ファイルとして独立させるなら、背景の透明指定が可能なPNGファイルまたはGIFファイルを用いるとよいが、前者はブラウザ側の対応に問題があり、後者はぼかしの入った影を文字に入れるのに対応できない（影のぼかし部分を結局半透明指定にしなければならない）ことから、どちらも却下という旨書きました。
しかし、たまたまですが、影ぼかしのある文字は、ロゴなどの固定的に表示している文字部分のみであることに改めて気付いたため、それら固定文字部分は従来通り背景画像に埋め込み一つのJpegファイルとして扱い、動的にロールオーバー等で変わる部分（影ぼかしの無い文字）を透過GIFファイルとして扱えば良いのでは、との結論に改めてなりました。
動的に変わる文字の背後には半透明黒色の角丸の四角をあてていますが、これはそれこそ上述のCSSで半透明指定をしてしまえば良いこと。
ということで、改めて、動的文字部分をGIFファイルとし、CSSで半透明指定をする方式でページを書き直すことにしました。これにより、ユーザー側の画面（ウィンドウ）サイズに合わせて何パターンもJpegファイルを用意する必要がなくなり、Javascriptコードも単純化できるなど、当方の負担がおかげさまで減ることになります。（何パターンも作り出す前に気付いた良かった。。。）
何より、ユーザー側の画面（ウィンドウ）サイズに合わせて任意の縮尺にサイズ変更できるようになり、デザイン面での自由度、柔軟性もその分上がることになります。
早速書き換えを今晩・明日で実行したいと思います。
また書き換えてみたらみたで何か予想外の問題が出るかもしれませんが、何とかこの方法で実現したいと思います。具体的に、今一番気になるところとしては、pタグやaタグのbackground-imageの指定をしない代わりに、imgタグを新たにそれらのタグの間に挿入することになるため、望む通りに動作できるか？などです。
また、つい先ほど、携帯とＰＣとのページの振り分け方法や携帯電話各社の電話機上でのブラウザ対応状況などについて、色々と調べてみました。
振り分けについては、サーバ側でＰＨＰなどでプログラムを組んで振り分けるのが最も確実のようですが、Googleサイトではそれは困難のようです。ユーザー（クライアント）側で振り分ける有効な方法も考案されていますが、一部の携帯機種（旧Vodafoneなど）などではPC側に振られてしまい、完璧ではないようです。今後登場しうる機種の仕様も想定すると、こちらの方法はもう少し研究させていただくことが必要かと思っています。
（参考：http://upup.blog3.fc2.com/blog-entry-184.html→参考にさせていただいているのに、すみません）
別の方法として、Javascriptに対応しているか否かで分けることも一つかなと思っています。今のところ、携帯でJavascriptに対応しているのは、DoCoMoのi-modeブラウザ2.0のみのようですので、こいつを例外的にPC側と割り切ってみなせば、概ね携帯とPCとを自動的に振り分けることは可能になります。（参考：http://q.hatena.ne.jp/1263370168）
…って書いていたら、こんな有益な情報を得ました。最新の情報のようです。：
http://smkn.xsrv.jp/blog/2010/08/redirect-from-pc-to-mobile-by-useragent/
これなら、ほぼ行けそうですね！
ただ、逆にJavascriptオフのPC環境が携帯とみなされてしまうという大きなデメリットもありますが…（もっとも、実際にオフにしている方は少ないでしょうが）。また、通信負荷という点は非常に大きな考慮点ではあるのですが、最近はどんどん携帯もＰＣ並みに機能向上しているので、携帯からアクセスが来たからと言って、自動的に携帯向けページに振り分けるのも適切ではないのかなとも思ってはいます。これらの点は検討課題です。
以上長くなりすみません。話は戻りますが、せっかく新URLにページを開設したのに、いつまでも白紙のままでは恰好もつきませんので、追って急ぎアップロードしたいと思います。
0 件のコメント:
コメントを投稿