0

現場でのカンバスサイズの設定

デザイナーのfです。

さて、フォトショップでWebデザインを始めよう。という時、白いカンバスサイズをいくつにしたら良いでしょうか?会社によって事情も異なり、正解はありませんが、当社では、最近は2500pxにし、その中にさらに幅960pxのガイドを引き、960をコンテンツと想定してデザインしています。

 

実は、デザイナーになる前に、 Webスクールで「モバイルファーストでデザインせよ」と学んできた経緯があります。ホームページはかつてパソコンで閲覧されるもので、それを想定して作られてきましたが、今はスマホやタブレットが使われる人口が上回りました。 PCの画面サイズで作ったサイトを今まで通り納品し、それを流用してスマホ版を別途作る…という流れが予算的にやりやすいので多くはこの方法がとられてきました。

 

「モバイルファースト」は逆の発想で、スマホサイトを最小限の要素で作る→タブレットやPCでは画面サイズに余裕がでるので、広告などスマホに入りきらなかった要素を足していく。という流れです。これは一つのhtmlでcssはリキッドレイアウトにするので、進行と公開はスマホ・PC同時になるパターンです。

 

しかし、お客様は新サービスの発表やイベントに合わせてホームページを早く見たい。専門的な知識がなくても自分で更新できるようにしたい。と、ニーズが様々です。cmsを組み込むことも多くなっています。 Cmsは更新システム以外にも、PC版を手軽にスマホに変換してくれるライブラリも登場しました。そこで、現場では結局、cmsを利用したスマホ最適化の手法が採用されています。これなら、早々にPCサイトを公開しておいて、あとでスマホ版に着手できます。PCサイトでデザインの方向性がはっきりするので、スマホ用デザインが作りやすくなります。

 

そういう事情で、現状ではPCサイトのタスクとスマホサイトを完全に分けており、「今回はスマホサイト」という指示が出たら横幅を640pxで作っています。

haba