レスポンシブWEBデザインワークフロー

レスポンシブWEBデザインワークフロー

SPONSORED LINK


従来までは、fireworksやphotoshopでデザインカンプを作成し、画像をスライスして、コーディングするという流れでしたが、
レスポンシブWEBでは、モバイル、スマホ、タブレット、PCと複数のレイアウトが存在するため、それら全部のデザインカンプを作ることは、時間的にかかりすぎるため、画像や素材などを先に作り、すぐにコーディングしながらCSSでデザインするという流れになります。

これって、慣れていないとはじめは大変そう。。

でも、今後やってゆかないといけないでしょうね。
スマホやタブレットでネットそ見る人は、幅広い年齢層に見られるので、絶対必要ですね!

1、まず、手書きのワイヤーフレームを描きます。
スマホ用、タブレット用、PC用の3種類を簡単に手書きします。
(キレイに書く必要はありません、ザーッとわかる程度で大丈夫です。また、タブレットとPCは同じレイアウトとするなら2種類でもOKです。)
2、次に、サイトのヘッダー、ロゴマーク、文章、写真、グローバルメニュー、フッターなど必要になるコンテンツ、素材を作って行きます。
3、

ポチッ☆とクリックお願いします!
↓ ↓ ↓

  • にほんブログ村 IT技術ブログ ホームページ・サイト制作支援へ

コメントは受け付けていません。

サブコンテンツ

TOP