見出し画像

noteを可能な限り改造して個人ブログ風にしてみる

noteではできることが基本的に限られていて、書いてみると思ったより見た目が簡素だなと思いました
なので自分なりにある程度工夫して個人ブログ風にしてみました

注意、自分が解説系の物が多いのでそれに特化した改造になってます)


現状

無料noteで主にできることは

  • 画像の挿入

  • URLの埋め込み(文字、画像等)

  • 太文字、斜線

  • 中央寄せ、右寄せ

  • 目次

  • 大見出し、小見出し

  • 箇条書き(番号付き/なし)

  • 引用

  • コード用

  • 区切り線

です(使ってない奴は省略してます)、できることは多いけど思ったよりは簡素になりがちです


対策

リッチにみえる画像を作って張る、絵文字を使う

シンプルだけど印象的にできます、noteは兎に角色がないので見た目で注視しずらく、文字だらけだと読破性が落ちます

画像をさすことで文章を小節単位で区切り読破性を上げます
(たぶん)

具体的には


🟦1_絵文字+色彩ラインで見出しを強調する

こんな感じで絵文字で文章先頭を強調して画像でアンダーラインを作ります

WordPressのアイキャッチは1.91:1らしいのでだいたい1000x523の中で調整するとうまくいくと思います、自分は1920x10(横フルHDにあわせて)作ってます

絵文字は以下のサイトから参考にさせてもらってます
絵文字のサイト

🔹小見出しはこんな感じ

小見出しのほうは絵文字のアイコンやアンダーラインを小さいものにするといいと思います

自分はアンダーラインは1920x6で作ってます

先頭にアイコン風の絵文字を入れることで見出しも少しポイントを置いて見やすくなると思います

雰囲気はこんな感じ

🟦2_吹き出しや解説を画像で張る

文字だらけだと兎に角読みづらいです、吹き出しや解説を入れた画像を張ることで文章の切れ目をわかりゃすくします大体3行以上になると読みづらいので、

noteの横幅の文字は媒体によって変わるのでだいたいスマホに合わせた横
マックス22文字程度になるようしながら吹き出し分にあわせて調節してます

noteは白背景なので最背面が白背景でも気にならない点は画像編集するうえで楽ですね


🟦3_表を作って張る

資料やスペック的なことは表を作るといいと思います、自分はLibreOfficeで作ります、LibreOfficeだとコピペでそのまま直接noteに張ることができます

雰囲気はこんな感じ

表も同様に画像なので媒体によってサイズが変わる点に注意して文字サイズを調整します


🟦4_赤文字を張る

こんな感じで

前後を太文字中央に置くと強調できると思います


🟦5_画像の間に隙間を開ける

画像と画像の間に線や空白用文字を入れてスペースを確保することで読みやすくします

空白用スペースの文字が載ってるところ

🟦まとめ

かなりごり押しですが多少は雰囲気を変えられると思います
よかったら皆さんの工夫方法とかも教えてくださいw


🟥チャンネル

youtubeでガジェットレビュー動画やってます、よかったらチャンネル登録等お願いします


いいなと思ったら応援しよう!