最近今あるサイトをスマートフォンに対応させるべく、コツコツがんばっているわけですが、その際に気になったことや知っておきたいポイントをまとめてみました。基本的な内容も多いと思いますが、ご参考になればと思います。 1. スマートフォンに対応させるには？ ウェブサイトをスマートフォンに対応させるには2つのパターンがあると思います。 PCにもスマートフォンにも対応したページを作成するか、PC用ページとは別にスマートフォン専用ページを作成するかです。 1つ目のPCにもスマートフォンにも対応したページは、Media Queriesを使う場合が多いと思います。 Media Queriesを使うと画面のサイズの違いによって適用するCSSを変更することができます。 例えば、CSS-Tricksというサイトは画面サイズによってレイアウトが大きく変わってます。 Media Queriesについては後で簡単に紹介
先日、CSS Nite in Ginza, Vol.59「DreamweaverによるレスポンシブWebデザインの実装」に出席してきました。 とても勉強になったので復習も兼ねてレスポンシブwebデザインに関して、セミナーで学んだ内容に自分の調べた点を加えてまとめます。 （一部の図はセミナーの資料を元に作成してます。） 始めに：スマートフォンサイト制作の選択肢 スマートフォンサイトを制作するには幾つかの方法があります。 アプリ 独自系 スクラッチ（0からスマートフォンサイト用に構築） jQuely mobileを使用 流用系 現在のデザインをほぼ流用、調整のみ レスポンシブ・デザイン どの方法にもメリットデメリットはあり、どれが最適かは サイトのコンセプトや規模、予算など複合的に考えて選択する必要があります。 今回のエントリーではレスポンシブ・デザインのみにふれます。 レスポンシブwebデザ
レスポンシブ・ウェブデザインって何？
先日、レスポンシブ・ウェブデザインのウェブサイトを集めた「mediaquri.es」を紹介しましたが、周りの人からそもそも「レスポンシブ・ウェブデザイン」が何かということを説明して欲しいと言われました。 レスポンシブ・ウェブデザインとは 「レスポンシブ」は「反応型」とも解釈することができます。何に反応するのかというと、「スクリーンの幅」です。「レイアウト」がデバイスのスリーンの幅に反応して可変をしていくのが「レスポンシブ・ウェブデザイン」です。現在では、iPhone のみならず Android など多様なスクリーンサイズをもったデバイスが出現しています。特定のデバイスのスクリーンサイズに合わせてウェブサイトのレイアウトを作成すると、他のデバイスで上手く表示されない問題などが発生します。デバイスを基準に考えるのではなくて、スクリーンのサイズを元に考えようというのがレスポンシブ・ウェブデザイン
このところのスマートフォンの広がりにより、デザイン部でもWebサイトのスマートフォン対応の必要性をひしひしと感じています。 実際のスマートフォン対応の取り組みとしてはこれからなのですが、その時のために従来のサイトをスマートフォンに対応させる方法、特に今回は閲覧環境に応じてページレイアウトを柔軟に切り替える、レスポンシブ・デザイン レスポンシブ・ウェブデザイン（Responsive Web Design）（ご指摘ありがとうございます。）に関していまさらながら調べてみたので、大枠的なことをふわっとまとめておこうと思います。 レスポンシブ・ウェブデザインって まず「レスポンシブ・ウェブデザインとはなんぞや」と言うところですが、 Webサイトのページレイアウトを閲覧環境（パソコン、iPhone、Android など）に応じて動的に変更させる手法で去年あたりからよく耳にするようになりました。 ブラウ
前回の更新日が見たくない程に時が流れている今日この頃・・・。 ブログを更新するモチベーションが中々上がらなかったんですが、まだ、だらだらでも良いから書いていきたいなと言う気持ちは有るんです。えぇ。 こんだけ更新が滞ってても、Twitterとかで時々ブログ読んでますって言ってもらえたり、最近なら「今日からできる定時で上がるためのWEB制作効率アップ術 | カッシーのWEBる。」で、【HTML5】新規でサイトを作るのに使えそうなの一式。Ver 1 を紹介してもらったりしてうれしい半面、更新して無いなーと、何とも言えない気持ちになったり。 なので、これからはちょろっとでもネタが有れば更新していきたいなーと。 何をモチベーションに更新するかはまだ見つかってないけど＞＜ さて、そんな訳で、今回はスマートフォン向けの新規でサイトを作るのに使えそうな感じの一式です。 【スマートフォン向け】新規でサイトを
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
