【自分で更新できる企業サイト】の大きな”ウリ”のひとつである

「ひとつのホームページでスマホ専用のホームページも自動生成される事！」

「ＰＣサイトを更新すれば自動的にスマホサイトに反映」

これは【自分で更新できる企業サイト】のホームページ作成技法として”レスポンシブデザイン”を採用しているから可能となった最新トレンドのスタイルなのですが、それでは”レスポンシブデザイン”とは何か・・・？

解説しようと思っていた矢先・・・、日ごろお世話になっておりますAll Aboutさんからまさにその分りやすい解説がコラムが発行されましたので、語弊ないよう全文まるごとご紹介致します（感謝）

＜テーマ＞
『レスポンシブデザインの作り方(1) ～レスポンシブデザインとは？～』

＜講　師＞
All About ホームページ作成ガイド
西村 文宏（ニシムラ フミヒロ）

……………………………………………………………………………………………

こんにちは。All About ホームページ作成ガイドの西村文宏です。

最近は、パソコン以外にもスマートフォンやタブレットなど、
様々な画面サイズの機器が普及してきました。

また、パソコン用のディスプレイでも、
大きなものから小さなものまで様々な製品が販売されています。

そのため、ウェブサイトの閲覧に使われる画面サイズも、
極端に広いものから極端に狭いものまで、様々な場合があります。

そのような状況では、どれくらいの画面サイズを想定して
ウェブページをデザインすれば良いのかが決めにくくなります。

従来は、「パソコン向けサイト」とは別に
「モバイル向けサイト」を作ることで解決できていました。

しかし、今では、モバイル端末だからといって
画面が狭いとは限りませんし、パソコンだからといって、
画面サイズの範囲が一定以内に収まっているとは限りません。

そこで登場した考え方が「レスポンシブデザイン」です。

レスポンシブデザインとは、閲覧者の画面サイズに応じて、
適用するスタイルシートを変化させる仕組みのことです。

閲覧者の端末の種類は問わず、画面サイズだけを基準にして
デザイン（適用するスタイルシート）を選択します。

環境に応じて変化するのはスタイルシートだけなので、
端末の種類ごとにウェブサイトを分けたりはしません。

単一のウェブサイトで、様々な画面サイズに対応させます。

例えば、SONYのウェブサイトで
レスポンシブデザインが採用されています。

以下のページを見てみてください。

……………………………………………………………………………………
http://www.sony.jp/ (※SONY製品サイト)
http://www.sony.com/index.shtml (※SONY USAサイト)
……………………………………………………………………………………

上記のウェブサイトでは、ブラウザのウインドウを
画面いっぱいに広げてみた場合と、
ものすごく狭くしてみた場合とで、
自動的に各所のデザインが変化することが分かります。

例えば、ウインドウの横幅を650px未満にした場合と、
それ以上にした場合とで比較してみてください。

広い画面で閲覧すると、大きなバナー画像と共に、
製品一覧が縦横に配置されたり、
「タブ」が横方向に広がって表示されます。

狭い画面で閲覧すると、バナー画像が小さくなると共に、
製品一覧が縦方向のみに配置されたり、

「タブ」が「プルダウンメニュー」に変化したりします。

このように、「端末の種類」ではなく
「閲覧者の画面サイズ」によってレイアウトを変更させ、
単一のウェブサイトであらゆる機器に対応させるデザインが、
レスポンシブデザインです。

スクリプトは一切使わずに、
スタイルシートだけで実現できるため、
とても手軽です。

これからウェブサイトを作るなら、
ぜひ、レスポンシブデザインを採用してみてください。

レスポンシブデザインを作るために
必要なスタイルシートの書き方については、
次回にご紹介いたします。

…………………………………………………………………………………………… Pendtiphovidis

東京・箱崎にある日本IBM本社に行ってきました。

弊社のある練馬区から箱崎までは西武池袋線に乗って終点池袋駅まで行き、丸の内線・大手町駅で半蔵門線へ乗り換え、水天宮前駅で降りれば、その地は箱崎となります。

箱崎といえば、首都高速の渋滞ポイント、箱崎ジャンクションや、海外旅行へ行く際の拠点となる東京シティエアターミナル T-CATが有名ですが、日本IBM本社も箱崎にあります。コンピュータ業界の人なら、箱崎といったらまず真っ先にこのIBM社屋を思い出すのではないでしょうか！水天宮前駅から徒歩数分の都内でも有数のフロア面積を誇るとても大きなビルです。

前置きが少し長くなりましたが、日本IBM本社へ伺った目的は、同社のデータベース製品である「ＤＢ２」のセミナーへオブザーバーとしてお声掛けを頂いた為でした。

「DB2 10 エバリュエーション・ガイドブック」技術解説セミナー

データベースというのは、コンピュータのソフトウェアシステムの一部の部品ですので、ホームページをお持ちのユーザー様には馴染みのないもので、意識するものでもありません。

しかし実はデータベースは、ブログの裏側のシステム部分で必ず使われているもので、また、ときに一般的なホームページでも使われていたりします。

そして、弊社ホームページ製作サービス【自分で更新できる企業サイト】でも使われています。

データベース製品は今回のIBM社以外にもいくつかのメーカー製品があり、【自分で更新できる企業サイト】では「PostgreSQL（ぽすとぐれすきゅーえる）」や「MySQL（マイエスキューエル）」というデータベースを採用しております。

新規営業の際には、時々、少しコンピュータシステムにお詳しいお客様から聞かれます。「データベースは何を使っていらっしゃいますか？」と・・・

どこのデータベースを使っているから良い悪いというものでは無いのですが、たまに尋ねられるご質問ですので、ここにお答えしておきます。さらに言及すれば、【自分で更新できる企業サイト】では「WordPress」というCMSを使っております。 Croatian to English dictionary