マーカーネット株式会社

WEB制作ブログ WEBデザイン、HTMLコーディング、PHP、スマートフォン制作などWEB制作全般に役立つ情報を発信していきます。

android iPhone WEBサービス WEBデザイン WEB制作

デザイナーの常識!? いいデザインと悪いデザインの見分け方 スマホサイト編

投稿日:2015年9月7日 更新日:

こんにちは、デザイナーのAです。

いいデザインと悪いデザインの見分け方 その(1)
いいデザインと悪いデザインの見分け方 その(2)
いいデザインと悪いデザインの見分け方 その(3)
いいデザインと悪いデザインの見分け方 その(4)

これまで、いいデザインと悪いデザインの見分け方についてご紹介してきましたが

今回はスマホサイトについて、ご紹介したいと思います!

2015年現在、スマホからのアクセス率が50%を超える企業もみられるようになってきました。

まだスマホ対応していないサイトをお持ちの方、これからスマホサイト制作を検討する方、必見です!

 

image02

リキッドデザインに対応している

一般的に横幅が320pxの端末が多いのですが、320px×480pxの端末を横にすると480px×320pxになります。
横幅を固定しない(=リキッドレイアウト)になっているかがポイントです。

 

 

image03

指で操作しやすいインターフェース

・リンクのサイズ
・隣接するリンクとの距離

押しやすさを意識されているかどうかが2つ目のチェックポイントになります。

※テキストリンクには下線や色がついているか(分かりやすい処理がされているか)
※リンクの領域が44px以上になっているか

 

操作性の悪いサイトはユーザーの離脱率を促進します。

 

 

image04

情報整理が適切に行われている。

サイト内のコンテンツの配置=優先順位の位置づけは適切かどうか。
スマホサイトの場合、外出先で必要とされるコンテンツを重視することをおススメいたします。

 

 

image05

Flashが静止画もしくはHTML5に変換されているか

iOSではFlashPlayerがないため、タブレットやスマホからFlashを閲覧することはできません。
Flashコンテンツがある場合、HTML5に変換する必要があります。

 

 

image06

極力画像を抑えたサイトになっているか

スマートフォンユーザーは3G回線で利用する場合も非常に多いです。
Wi-fiと比べると転送速度は大分落ちるので、サイトの表示速度をあげるためには、画像読み込みの負荷の軽減=画像データを極力減らす必要があります。
ボタンなども画像にするのではなく、背景画像やCSS(スタイルシート)とテキストで対応することが望ましいとされています。

いかがでしょうか?

マーカーネットでは、お客様が何を求めているのか、何が必要なのかをじっくりヒアリングし、
最適なサイト制作を行わせていただいております。

株式会社マーカーネットにホームページ制作・WEB制作の依頼をお願いしたい方は是非こちらからどうぞ!

-android, iPhone, WEBサービス, WEBデザイン, WEB制作

執筆者:


comment

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

関連記事

WEB制作において低コスト、低予算でレコメンド機能を導入する

WEB制作において低コスト、低予算でレコメンド機能を導入する

Amazonは昨年12月「予測出荷」と呼ばれる特許を取得しましたね。 これはユーザーが「購入」をクリックする前に商品を発送するしくみです。 米インターネット通販最大手のアマゾンは昨年12月、いわゆる「 …

参考になるスマホサイト

皆さん・・・ こんばんは・・・・ webデザインを新人デザイナーKです・・・ 何故私がこんなに落ち込んでいるかというと・・・最近、5kgも太っ”#$#”$!!! ことではなく! 最近、スマホのデザイン …

ブクマするならコレ! 素材探しで迷わない、商用利用可能な素材サイト

ブクマするならコレ! 素材探しで迷わない、商用利用可能な素材サイト

こんにちは! Webデザイナー初心者のKです! 本日はWeb制作をされている方なら誰しもがぶちあたるであろう、 著作権について、色々と熱く語ります!! ・・というのは、長ーーーくなるので!! 商用利用 …

CSS3のみで吹き出しを作成してみました!上下左右どこでも大丈夫!

凝ったデザインなどには吹き出しなどを作成したりします。 ですが、内容を画像ではなくテキストにしたい場合があると思います。 吹出し画像を文字数に合わせて調節したり、分割して組み立てたりするのは大変ですよ …

先取り!2015年に流行るWEBデザインのトレンドは!?

先取り!2015年に流行るWEBデザインのトレンドは!?

こんばんわ!あと1カ月で2014年も終わりを迎えます。。 この時期に気になるのは来年のWEBデザインの流行です! 毎年、新しいデバイスが発売され、めまぐるしい進化を遂げるWEB業界は先読みして情報を掴 …