Readブログ

元すき家店員二十歳の情報学生のつぶやき

MENU

【ブログ運営ではこれが大事?】スマホサイズの重要性を解説!

f:id:nao-read:20220308202402p:plain

はじめまして、なお(@nao_read0101)です。

 

みなさんブログは何で見ていますか?

 

自分は空いた時間などにTwitterからほかの人のブログをスマホでのぞきに行ったりしてます。

そうです。。スマホでです。

 

今回はスマホ表示に関しての記事を少し話していこうと思います。

 

 

 

レスポンシブ対応

レスポンシブ対応とは

PCなのかスマホなのか、Webサイトを利用する機器によってディスプレイの大きさが変わるため、どんな画面サイズでもわかりやすい画面表示に対応させることです。

これによりどのような機器でも自分のブログなどを見てもらうことができます。

 

スマホで見る人が圧倒的に多い!?

 

f:id:nao-read:20220304183751p:plain


本ブログのデバイス別セッション数

 

なんとスマホのセッション数が約90%を占めていました!!

 

つまりPCで投稿したときの画面とみられている画面は違うのです。。。

 

スマホサイズデザインに力を入れろ!!

PCで書いている人は投稿する前にスマホサイズで表示したときの確認をしてみるといいかもしれないです。

 

自分が読者だったらどのような構成が見やすいか?

 

どの項目を上に配置したらよく見えるか?

 

自分なりに分析して読者に寄り添ったブログを作っていきましょう。

 

HTML ? CSS ?? 直し方がわからない!!

他人の記事を参考にしよう!

調べてみて検索順位が上に出てくる人のブログや、Twitterのフォロワーが多い方のブログを参考にするといいといいと思います。

 

実際に自分も様々な方の記事を参考にしています。

流れとしては以下の通りです。

 

  1. ほかの人のサイトから参考にしたいデザインを探す
  2. 参考にしたい部分をある程度のイメージで検索してみる
  3. その部分を紹介している人の記事からHTML、CSSを持ってくる

 

実際にこのオレンジ枠も「番号付きリスト おしゃれ  css」で検索をかけて探してきました。

みなさんも参考にしてみてください。

 

 

まとめ

今回はスマホデザインの重要性を紹介させていただきました。

実際もうWordPressなどのテーマを選んだ時にある程度スマホのデザインもできているので直す必要などないかもしれませんが、逆にそこで少し自分で手を加えて、 周りに差をつけていきませんか?

 

是非みなさん参考にしてみてください。

 

ミニ記事にする予定でしたが思ったより長くなってしまい申し訳ないです。。。

今後このようなミニ記事を不定期に書いていこうと思うので是非見に来てください。

 

前回の記事で次はGoogle AdSenseについて書くといったのですが衝動的に書いてしまいました。。。
次こそは書くので気になっている方がいましたらもう少しお待ちください。。
また、私の記事のここを参考にしたいという方がいましたらソースコードなどお渡ししますので、DMやお問い合わせにてご連絡ください。