comments trackbacks you may also like

FC2ブログテンプレートをワンカラムレイアウトにしてデメリットにやっと気付いた…

2019年11月21日
FC2ブログ日記(カスタマイズの所感など)
0
#FC2ブログ #FC2ブログテンプレート #ワンカラムレイアウト #ブログカスタマイズ #ウェブデザイン #FC2ブロガー #ブログ運営 #記事1行あたりの文字数 #テキストエリア幅 #ブログ日記

FC2ブログゆうらりハッピースマイル』の管理人Mです。ご訪問いただき、ありがとうございます。


実は現在、ブログデザインのことで少し悩んでいるのだけれど、あれこれと自分の頭で思考を凝らしてみても一向に解決策が見つかりません(汗)


ブログ テンプレート レイアウト ウェブデザイン


その悩みとは、僕が使用する現在のワンカラムテンプレートについて。僕にとって、ワンカラムのレイアウトを採用したのは、FC2ブログ史上初だったと記憶しています(スマホ版テンプレートは除く)。


左右のプラグインが消えたことで、横幅がグンと広くなった点についてはとても気に入っているんですけどね…。


ただし1点だけ、すごく気になる点があるんです。それは、パソコン画面からこのブログを見た時に、記事の一行がものすごーく長いんですよ(汗)僕自身、ブログを読んでいて本当に見づらい。

ブログの記事一行あたりの文字数は何文字くらいが適正?

ブログの個別記事一行あたりの文字数は、PC画面の場合だと、だいたい35文字くらいに収まるようにと考えてきました。


なぜなら、頭を動かさないでちょうど視界全体に一行が収まるくらいが文章を読みやすいとされているからです。


これについては人によって意見もさまざまだと思います。たしか、「ほぼ日イトイ新聞」の場合は、20文字くらいを適正に考えてると語っているインタビューを目にした記憶があります。

ブログテンプレートのレイアウトをワンカラムデザインにした場合のデメリットは?

今まで僕が採用してきたFC2ブログテンプレートは、2カラムのものが多かったんです。2カラムだと、記事のテキストエリアは最大で800px前後がほとんど。一行あたりの文字数も、だいたい許容範囲内に収まっていたように思います。


ところが、現在のワンカラムだと、記事幅が最大で1000pxもあるんですヨ( ̄▽ ̄;)


レスポンシブデザインですから、スマホ画面なら問題ないんですけど…。タブレット画面で見ると「ちょっと横に広いかな?」と違和感が少し。そしてパソコン画面で見ると、「文章一行が横に長すぎるぞー!」となる訳です(汗)


下の2つを比べてみて下さい(PC画面で見て下さいね)。


テキストエリアを1000px目一杯使った場合

和尚さんと弟子

【クイズ】あるお寺に、和尚さんとその弟子が住んでいました。和尚さんがトイレで用を足した後に、紙がないことに気付きました。和尚さんは、大声で弟子を呼び、紙を持って来てくれるように頼みました。弟子は和尚さんに何と答えたでしょうか?


テキストエリアの幅を600pxに縮めた場合

和尚さんと弟子

【クイズ】あるお寺に、和尚さんとその弟子が住んでいました。和尚さんがトイレで用を足した後に、紙がないことに気付きました。和尚さんは、大声で弟子を呼び、紙を持って来てくれるように頼みました。弟子は和尚さんに何と答えたでしょうか?


ブログテンプレートのレイアウトをワンカラムデザインにすると、横幅が広く使えるメリットの反面、文章が読み難くなるデメリットもあったんですね。


何枚だ―?

僕のカスタマイズしたいことリスト

今、この記事をお読みになっている読者の方は「横幅が気になるなら、カスタマイズで狭く調整すれば済む話しでしょ?」とお考えになるかも知れません。実際の僕もそれを踏まえつつ、ずっと悩み続けているわけです。


でも、せっかく横幅の広いワンカラムを採用したというのに、記事幅を狭くしてしまうのはちょっと違うよな…。


ちなみに、僕のやりたい願望リスト化すると次のとおり。


  1. 画像は、目一杯のサイズを大きく貼りたい。
  2. 文章に限っては、一行を30~35文字程度に収めたうえ、センタリングかつ左寄せで表示させたい。

上に書いたことを実現させるには、何通りも方法が思い付きました。テキスト部分を、class名で指定したdiv要素で囲ってcssで制御したり、JavaScriptを使ったり…。

結局、ワンカラムテンプレートで文章の一行が長すぎる問題を解決できず…

胃がん宣告を告げられた時の表情

しかし、いずれの案もしっくりとはせず、いくら考えても解決に至らず終わりました(汗)


理由としては、「あちらを立てればこちらが立たず」の諺がピッタリと当てはまる結果になりまして…。


すなわち、画像やテキストエリアを思惑通りにカスタマイズ出来たとしても、すでに設置済みのパーツ(左寄せになってる)との兼ね合いや、あらたにブログカードなどを貼り付けた場合の表示位置をどうするか?などの問題が。


全体のバランスを考えたときに、どうしてもアンバランスな感じが否めなかったんです(~_~;)

おわりに/発想の転換もアリかも?

呑気な少年 ドラゴンボール 孫悟空


結局、積極的にどうこうするのはやめることにしました。


あまり個別記事に何かを施すと、いざテンプレを替えようとした時に、思わぬ修正作業が必要となる悪影響を招きかねませんからね(^_^;)


とりあえず、今回は発想の転換もアリかな?と思いまして。


きっと、PC画面で文章を読んだときに一行が読みづらいのは気のせいだ!


しばらくは、気付かなかったことにします。


▼関連記事

【追記】FC2ブログ期間限定配布テンプレート「Ample」に変更‼︎カスタマイズに悪戦苦闘したけど素敵で満足♪

FC2ブロガーのMです。とうとうやってしまいました。FC2ブログのテンプレート製作者Akiraさんがブログ記事を更新されたんで気になって覗いてみたんです。すると…。Ample - ブログ内期間限定配布Ampleテンプレートはレスポンシブウェブデザインです。パソコン・タブレット・スマートフォン等全デバイス間共通でお使いいただけます。「スマートフォン版の表示設定」を「無効にする」に設定してご利用ください。設定ページ...vanillaic...

【FC2ブログテンプレート】Ampleのヘッダー画像、ランダム表示数を追加したけど文句ある?

FC2ブロガーのMです。ご訪問いただきありがとうございます(^^)今回は、FC2ブログのテンプレートについての話しを。Akiraさんが期間限定(すでに終了しました)で公開された「Ample」に変更した僕は、このテンプレートがとても気に入っています(^^)Ample - ブログ内期間限定配布「配布終了」Ampleテンプレートはレスポンシブウェブデザインです。パソコン・タブレット・スマートフォン等全デバイス間共通でお使いいただけます。「ス...

FC2ブログのヘッダー画像を徐々に表示させるアニメーションのカスタマイズ

FC2ブログのヘッダー画像に、ちょっとした小ワザを使ったカスタマイズを施してみました。今回やったことは、ブログのヘッダー部分に設定してある画像がアニメーション効果によって徐々に表示されていくというカスタマイズです。▼デモはこちら。ブログのトップページへ画像が画面内に入ると、アニメーションが始まるんですね。一度、画像が見えなくなるまでスクロールしてから再び戻りますと、何度でもアニメーションが動作します。...

\チェック/

【ランキングに挑戦中】

いつも応援クリック↓
ありがとうございます

にほんブログ村

関連記事
M
この記事を書いた人: M
ブロガー/FC2公式おすすめブログ認定/企業家/投資家/Fashion研究家/不動産コンサルタント/会社経営/将棋六段/おうちごはん男子部/料理を悪戦苦闘修行中/ヘッドスパとスイーツをこよなく愛する46歳/人生なんて気持ち次第‼︎きっと何くるないさ〜(´ー`)
FC2ブログオフィシャルおすすめブログ認定バナー日本ブログ村 プロフィール

この記事が気に入ったら
いいねとシェアしよう!

data-matched-content-ui-type="image_card_stacked" data-matched-content-rows-num="6,2" data-matched-content-columns-num="1,5"
現在の人気記事はコチラ!

コメント(0)

There are no comments yet.
未分類 (0)
シン・胃がん闘病記 (31)
┣  AVANT: 癌の余命宣告~共存 (20)
┗  セントラルドグマ: 父親の胃癌 (11)
胃がん(ブログ、闘病記録、胃癌ニュース、私の症状など胃ガン情報全般) (5948)
┣  胃がんブログ (285)
┣  よりぬき 胃がんブログ (16)
┣  胃がん闘病記・日記 (5586)
┣  酒場放浪記 (10)
┣  胃がん手術後の食事記録 (6)
┣  胃切除後の料理など (35)
┗  がん治療のクラウドファンディング (10)
胃がん History (85)
┣  ステージ3B 多発性高度リンパ節転移胃癌 (57)
┗  胃がん再発「転移性肝がん」で余命宣告 (27)
がん のこと(ガン情報全般) (512)
┣  がんブログ (290)
┗  がんニュース (222)
胃がん 障害年金ブログ (71)
┣  障害年金 - 準備編 (23)
┣  障害年金 - 審査から年金受給まで (12)
┣  障害年金 - 審査請求・不服申立 (26)
┗  障害年金 - 再審査請求 (10)
Amazon (ニュース、お得なセール情報など) (142)
┣  Amazonセール (2)
┗  📱kindleセール (139)
おもしろグッズ (11)
今日のエッセイ (114)
ニュース・芸能・話題 (778)
┗  転職・キャリアアップ (21)
占い・心理テスト (6)
恋愛・人間関係 (29)
終活ブログ (12)
グルメ (103)
┣  低糖質レシピ (25)
┗  お酒の飲み方 (2)
胃切除後の食事・レシピ (670)
┣  ご飯・おかゆ・和食 (174)
┣  おかず (139)
┣  味噌汁・スープ (74)
┣  カレー関係 (66)
┣  パン・洋食 (63)
┣  麺類 (112)
┗  その他、簡単レシピなど (39)
ブログ (244)
┣  FC2ブログ・便利ワザ・アイテム・HTML・SEO対策など (187)
┣  FC2ブログ日記(カスタマイズの所感など) (10)
┣  Google Adsense (アドセンス) (8)
┣  趣味や将棋のこと (31)
┗  ファッション (8)
iPhone の使い方・アプリなど (32)
司法書士 (26)
┣  仕事・実務や登記のこと (1)
┗  事件ファイル (25)
COLLECTION (27)
┣  家電 (11)
┣  ホーム&キッチン (4)
┣  ビューティー&ケア (5)
┣  QOLの改善&ヘルスケア (2)
┗  お酒 (5)