Aug 24, 2015

リニューアル事例(レスポンシブウェブデザイン)

最近とても多い依頼があります。
それは・・・、既存のウェブサイトをスマートフォン対応にしたいというご依頼です。
 
そこで、最近よく耳にする『レスポンシブウェブデザイン』。
以前にも書いた通りで、一つのサイトをアクセスするデバイスの画面サイズによってレイアウトを変更するというものです。
1種類のコンテンツ(HTML)のみでいいので、管理するのも非常に便利です。
 
スマホ用サイトを別に作っていると、例えばブログを更新するにもPC用とスマホ用と2回しないとダメなんで・・・(RSS等で読み込む場合は別です)。
 
そんなわけで、最近リニューアルしたサイト事例です。(デザインは基本的に引き継ぐという依頼でした)
 
以前はPCサイトがそのままスマートフォンに表示されていました。
字も小さくて見にくいですね。
リニューアル前にスマートフォンで見た場合です
 

 
リニューアル後はこんな感じです。
まずはパソコンで見た場合。
 

 
そして、リニューアル後にスマートフォンで見た場合は、
 

 
フォントサイズや画像等がスマートフォンに適したサイズになりました。
 
また今回のリニューアルでは、TOPページの新着記事一覧にサムネイル画像を追加したとの事でしたので、記事内の一番上の画像がサムネイルとして表示され、写真が無い場合はオーナー様の写真が自動的にサムネイルになるようにしました。
 
ただ既存のサイトをそのまま使ってレスポンシブデザインに変えるのは少々困難で(レイアウトやCSS等の関係で)、一から作り直す場合が多いんです。
なので、リニューアルをご検討の方は、デザイン面も含めてレスポンシブウェブデザインへリニューアルすることをおすすめします!
 
ご相談等は無料でお聞きしております、ぜひお気軽にご連絡ください。
 
 

LINEで送る

関連記事