MD-Blog_Web Creative

タブレットのレイアウトデザインは、画面の大きさから、スマホサイトとは違いPC向けのサイトデザインが向いてると考えられています。
でも、ユーザの操作方法はスマートフォン向けのルールに近い。そして縦・横で見え方が変わってしまう。ただ単純にPCサイトをつくる気分でデザインをすると、かなり使いにくいサイトになってしまいます。

ては、どうすれば、キレイで使いやすいサイトになるのか？

情報量が多いサイトなどは、情報を絞り、機能を分かりやすく配置した、使いやすいUIデザインが必要となります。
最近注目されている「レスポンシブWEBデザイン」を用いたページでは、文字やアイコンに強弱をつけて、情報を最小限に抑えるミニマルデザインでシンプルにデザインされるケースが多いです。

＃レスポンシブWEBデザインについてはこちらのサイトが分かりやすかったです！
参考：http://www.seojapan.com/blog/responsive-web-design

これなら、縦・横のどちらで見ても、画面サイズが小さくなっても、分かりやすさ・機能も失われず、カッコいいデザインができますね。

それでは実際にページデザインを考えるにあたって、以下に基本的なTipsを挙げておきます。

• ■画面サイズ 特別な指定がない限り、iPadに合わせた1004px想定が良さそう！
• ■フォントサイズ タブレットユーザーが読みやすいと感じるフォントサイズは、16px！

■ボタンサイズ

44px以上が推奨！
でも最近では、押しやすさを重視する為、もう少し幅を取る事が主流になってきている！

■タッチ操作

タッチした際、ボタンが変化したり、ブロック要素全体にリンクすることで、
分かりやすさ、使いやすさを向上させることが大事！

以下のページが大変参考になります！ - http://mdlab.jp/project/tablet/01.html - http://www.aiship.jp/knowhow/archives/9267 - http://www.mdn.co.jp/di/articles/2657/?page=19

Cover image by mikemccaffrey via Flickr.