11月2日 ナイスプレスのスマホサイトをリニューアルしました

スマホサイトをリニューア

NICEPRESS(ナイスプレス)のスマホサイトをリニューアルしました。

スマホサイトには、何種類かのデザイン手法がありますが、
NICEPRESS(ナイスプレス)は、専用に作ります。

スマホの画面で見やすくTOPを変えたり、下層ページを読みやすくします。

本日は、TOPデザインのテスト的な意味も含めてのリニューアルです。

お客様にご提供するために、どうしたら訴求力が増すか、色々なデザインを試します。
ソリッドデザイン
ウェブレイアウトの基本にして王道の固定幅デザイン!
横幅を固定幅でデザインし、デバイスが変わっても見え方が変化しないウェブページデザインの基本。
どんなデバイスであっても、つねに同じレイアウトであることは、ユーザーインターフェースに一貫性があり、ブランドイメージの強調という側面もあります。

リキッドデザイン
ウィンドウの横幅に合わせて改行する流動的なデザイン!
リキッドデザインは、その名のとおり文章やコンテンツがリキッド(液体)のように可変するレイアウトのことです。
ウィンドウの横幅に合わせて改行位置が自動的に変わるため、画面解像度の異なるデスクトップ機やAndroidデバイスには最適とされています。

レスポンシブデザイン(User Agent切り替え型)
確実な表示が可能だが、デバイスごとにHTMLが必要!
ブラウザーがサーバーに対して情報を自己申告する「User Agent」はiPhone/iPadといった機種の種類やOSのバージョンのほか、これらの情報に合わせてURLを移動するスクリプトを組み込んでい ます。
つまり、デスクトップ/モバイル用など複数のHTMLを用意していれば、ウェブサイト側が自動的に表示を切り替えることができます。

レスポンシブデザイン(Media Query切り替え型)
HTMLが1種類のシンプル設計 横幅に合わせてデザイン変更!
Media Queryとは、スクリーンの横幅に合わせて読み込ませるCSSを切り替えるレイアウトです。
切り替え時にHTMLを変更する必要がないため、URLは変わら ずWordPressで構築したサイトは1回の更新で済みます。
ただし、最初にウェブサイトを設計するときにしっかりとしたHTML構造と柔軟なCSSの構築 が求められるため、最も上級者向けのレイアウトと言えます
1102_01

1102_02

スマートフォンでは主にフリック入力を利用され、アルファベットはあまり使われません。
例えば、「Google」よりも「グーグル」や「ぐーぐる」で検索 するユーザーが多い。また、パソコンに近い使い勝手のため、半角スペースを空けて複数検索するユーザーもいます。

フィーチャーフォンには弱かった「サジェスト機能」による検索も多い。
例えば、「印刷」と入力すると「印刷 グラフィック」のように検索エンジンが積極的に提案してくれる。サジェストは、ユーザーの検索クエリを基に作成されるので、ワード調査を行った上でキーワー ドを選定し、戦略的セルフSEOを行うことが求められます。

 
ブログ一覧へ