サイトデザイン

Web サイトのデザインに関する勉強メモです。いわゆるブラウザ依存やサーバーサイド処理からSEO などを考察します。
更新日 2016-02-13

ブラウザについて

Windows PCにおけるスタンダードは間違いなくInternetExplorer です。近年はスマホやタブレットも多く、その多くが異なる ブラウザです。これらを統一する流れがHTML5 なのですが、依然としてブラウザ毎に微妙に違いがあります。 デザインに凝るほどに、個々のブラウザの特性を確認しながらの作業となります。

AJAX(JavaScript)

AJAX と言われる技術が脚光を浴びています。動的なページをJavaScript によって実現する為の汎用ライブラリです。ブラウザの実装に 依存する故に潜在的な問題点が指摘されるJavaScript ですが、この違いを吸収できるように考慮されて作成されています。

CSS

今やサイトデザインでは欠かせない機能であり、両者とも実装が済んでいます。しかし、表示してみると随所に違いが現れます。ビュジアルに 関する違いは一番の頭を悩ませる問題です。両ブラウザでテスト表示しながらの開発を強いられるでしょう。
HTML5 になり、デザインはCSS に任せられるようになりました。

Flash

グリグリ動くアニメーションを提供するActiveX コンポーネントですが、パソコン以外の端末機器の発展に伴い各メーカーの思惑に翻弄されています。 しかし依然として技術面、開発面ではFlash 一択だったりします。

サーバーサイド処理

いわゆる動的サイトを提供する手段の一つで、サーバーがクライアントにページ内容を配信する段階で個別に変更を施したり、ページそのものをランタイムに 生成する手法です。

CGI

Perl 言語との組み合わせで開発の敷居が低いの特徴で、未だに多くが利用されています。ただシステム特有のボトルネックがあるために、現在では有望ではありません。

Java

Java で書き上げたWeb アプリで提供されます。主にLinux サーバーで運用されるシステムです。Struts といったフレームワークやTomcat といった サーバーサイドJava コンテナがあり、総じてお勧めです。全部無料ですが習得にはそれなりに労力が必要です。

.NET フレームワーク

C# で馴染みの.NET フレームワーク。AJAX と組み合わせる事でリッチなウェッブアプリケーションを使い慣れたVisualStudio を用いて開発できます。 ただし習得にはやや時間がかかるでしょう。

ウェブデザイン

サイトデザインの肝です。ブラウザのみならず、SEO や実運用性も考慮にいれなけばなりません。

ビジュアル

特に商用サイトなどでは文字だけでは成り立ちません。静止画はもちろんFlash といった動画は効果的です。

SEO

Search Endgin Optimize の略で、検索エンジン向けの最適化を意味します。キーワード等はもちろん、サイト内の各ページの相互リンクなども重要です。

フレーム

フレームは昔から存在するHTML の技術で、これを利用するのは立派な手法です。問題があるとすれば、ユーザーが特定の表示をお気に入りに残せない事と、 SEO 的に不利という事でしょう。最近は敬遠されがちです。
フレームを使ったトリッキーな技としては、フォームからのレスポンスをtarget 属性に設定したフレームに出力する方法があります。ショッピングカートをこれで 実装すると、合計金額やカートの中身を表示したフレームページをレスポンスとするデザインができます。

HTML5

HTML5 はSEO 的なメリットもあります。不明瞭な点や未実装もありますが、今後広く使われれくる模様です。