レスポンシブwebデザインって何だろう? 分かりやすく教えます。

前回無料でダウンロードできるレスポンシブwebデザイン対応のテンプレート「テンプレートキング」

の記事(関連URL:http://midorin01.sakura.ne.jp/info/archives/1636)を紹介したので、

そのついでにレスポンシブwebデザインについて色々書いておきたいと思ったので、

記事にしました。

 

レスポンシブwebデザイン対応と非対応では何が違うのかと言う事について書いて行きたいと思います。

 

 

☑レスポンシブwebデザインって何?

 

レスポンシブwebデザインと言うのは、

イメージとしてはこんな感じです。

レスポンシブwebデザインのイメージ

☑実際に画像で確認してみよう!

 

PCとスマートフォン、そしてタブレットそれぞれの画像を比較してみると、

こんな感じの違いがあります。

 

◆パソコン(横幅900px程度)


レスポンシブwebデザイン_PC表示

が基本ですね。

ヘッダがあってメニューバーがあって、パンくずリスト、

そして記事本文の横にサイドバーがあるタイプです。

 

 

◇タブレット(横幅600PX程度)


 

タブレットだとこんな感じです。

レスポンシブwebデザイン_タブレット表示


 

あまり違いが分からないかもしれませんが、

サイドバーが消えてます。

 

サイドバーはどこに行ったのかと言うと、

記事本文の下に自動的に移動しています。

 

サイドバーで商材を紹介しているサイトをよく見ますが、

スマホからの購入を意識しているのかもしれませんね。

 

 

◆スマートフォン(横幅300PX程度)


 

スマートフォンは画面が小さいので、

かなり小さめです。

 

私のサイトは記事を書くのに夢中になっててスマホ対策に文字サイズなどを変えていなかったため、

かなり見にくい感じになっちゃってます。(苦笑)

 

レスポンシブデザイン _スマホ


 

初期状態のまま使用していたのですが、

正直これはかなり読みにくいなって思います。

 

レスポンシブwebデザイン対応テンプレートとは言っても、

この感じだと自分でカスタマイズしなければ読みにくいブログになってしまう事間違い無しですね。

 

おまけにスマホ画面で自分のサイトのプレビューを見てみた所、

何とアップしている画像のサイズが小さいと言う欠点を見つけました。

 

この辺も要検討しながらカスタマイズして行く必要がありますね。

 

 

☑分かった事

 

HTMLとかCSSについては全くの素人なので

カスタマイズは原則しない方向だったのですが、

 

穹音「正直これはまずい(汗)」

 

とかなり危機感を覚えている私です。

 

HTMLやCSSを勉強する必要はありませんが、

事態に応じて調べる能力だけは付けておいた方がよさそうです。

 

 

 

☑メリットとデメリット

 

googleが推奨している以上、適応させなければいけないのですが、

どうやらこのデザインは初心者にとって良い事ばかりではないようです。

 

そこで、メリットとデメリットについてまとめておきたいと思います。

 

 

◆メリット


 

・それぞれのデバイスで見やすさを意識した設計を用意してくれているため、読者ウケがいい。

・googleが推奨しているため、SEO対策に効果があると思われる。

 

 

◆デメリット


 

・PC用に作られたHTMLをスマートフォンで処理するため、読みこみの遅さに難がある。

・PCのプレビューと異なる事がよくある。

 

 

こんな感じで割と使いこなすのが難しいレスポンシブwebデザインですが、

これを使いこなせばスマホユーザーの受けが良くなるため、

アクセス数増加に役立つ事間違い無しです。

 

 

 

 

 

 

コメント

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

筆者紹介

穹音春海
    【穹音春海】

1995年に生まれた凡人です。

貧乏な家庭に生まれ、子供の頃からお金に困った生活をしていました。

高校の時に初めて人生を逆転するために有名国立大学を目指して勉強する事に決めましたが、理想はなかなか上手く行かないもので、勉強しても偏差値が伸び悩み、程遠い学力で第一志望に挑むも、結局ボーダーすら突破できず人生終了しました。

自宅浪人中は実質ニートな上、お金に困ってるわけですから、勉強しながらも稼げる方法を探しました。

そしてたどり着いたのが、

・学歴なし
・資格なし

の自由な世界でした。

覚える事もセンター試験より少ないうえ、パソコン1台で稼げるので、今では自由気ままな生活を送っています。

その方法を教える事で生計を立てていますから、
聞きたい事があればなんなりと質問してくださいね。

名刺

名刺

穹音の企画

チーム穹音



穹音の企画



穹音の企画02


推奨商材

『情報商材の白チャート的存在』


>>詳細はこちら


物販アフィリで稼ぐための初めの一歩

風花初芽


『書いた文章が伝わっていない方へ』


ミリオンライティングのイメージ

>>詳細はこちらをクリック


『メール1通で100万円稼ぐ現実的な方法とは』


>>詳細はこちらをクリック


『ツールに言われた事だけやってれば稼げる再現性の高いノウハウ』

ass[answer sheet system]

詳細はこちらをクリック

推奨無料商材

ダウンロード数100を突破してます。

宇崎恵吾のコピーライティングレポート

宇崎恵吾のコピーライティングレポートの詳細はこちらをクリック。


期間限定で
1000円⇒0円
まだ手に入れてない方は
早めに手に入れてください。

自由な人生を手に入れる教科書の詳細はこちらをクリック

特典を受け取れなかった方へ

特典が送付されてない、特典を受け取る事が出来なかったという方は、

「注文日」
「注文ID」

をご記入の上、コメント、またはメールを送ってください。
確認が取れ次第特典をメールに送付させていただきます。

推奨テンプレート

穹音春海愛用のテンプレート


FMテンプレート

>>詳細はこちらをクリック


「最高のSEOを誇る本格派テンプレート」


>>詳細はこちらをクリック

穹音春海のメール相談

ブログランキング(日本ブログ村)

日本ブログ村 ランキング


オススメポイントサイト

モッピー!お金がたまるポイントサイト

友達紹介のシステムと
2ティアシステムで
不労所得も可能に!?

詳しく知りたい方はこちらをクリック

アーカイブ

カテゴリー

▲トップへ戻る