はるなぴログ

ブログ・WEBサイト作成技術研究

Webデザイン

斜体(イタリック体)による強調は日本語には合わないWebデザインだ!

はてなブログで強調表示の表現をCSSカスタマイズしてみます。 はてなブログテーマInnocentの強調表示 斜体(イタリック体)による強調は日本語には合わない 外部CSSファイルにカスタマイズ内容を記述する 強調表示の使い過ぎに注意 はてなブログテーマInnoce…

著作権フリー画像をPixabayやぱくたそから使う時の注意点

著作権フリー画像をPixabayやぱくたそなどの無料素材サイトから使う時の注意点について書きます。 著作権フリー画像サイトというのは実は間違って理解されています。商用利用OKをうたっていてもどんな画像でも自由に使える訳ではなく注意が必要です。特に女…

【CSSコピペOK】ブログの見出しデザインをカスタマイズ

見出しのデザインをCSSでカスタマイズしてみます。 ボックス風の見出しに吹き出しを付けたりチェックボックス画像を用いたりしておしゃれなデザインを追求してみました。 サンプルCSSをつけましたので自由にコピペしてご使用ください。 H2の見出しデザイン …

ブログの文字が小さいのでフォントサイズをCSSで大きくしてみた

ブログの文字サイズって小さいことが多いと思いませんか? 今回は一行の文字数とフォントサイズ、行間、文字間隔など、読者が読みやすいCSS設定について考えていきます。 1行の最適な文字数を元にブログの読みやすさについて深堀りしてみました。 デフォルト…

【2019年版】クリックされやすいリンク色を極める!

クリックされやすいリンクの色はどんな色でしょうか? 大抵のリンクは青色をしていますが、その青色も調べてみると実にさまざまな種類があることが分かりました。 主だった検索エンジンやブログサービスなどの青色リンクの色を比較して独自テーマ制作の参考…

オリジナルテーマ制作のためにCSS開発環境を整える

オリジナルテーマを制作するにあたり、まずCSSの開発環境を整えます。 はてなブログでのテーマ制作とはすなわちイコールCSSの開発だからです。 今回はNode.jsを使ってCSSの開発環境を整備していきますので、その手順を備忘録として記録しておきます。 Node.j…

はてなブログテーマを比較してみる

はてなブログでオリジナルテーマを作成するにあたり、はてなブログの既存テーマを調べて比較してみます。 テーマには公式テーマとオリジナルテーマがありますが、テーマストアから人気順に10テーマずつピックアップして比較します。 人気テーマは更に詳細に…

自作テーマの対象ブラウザ範囲を考える

今回は自作テーマの対象ブラウザをどこまでの範囲とするかについて考えてみます。 具体的には自作テーマでIE11対応を切っていくことができるのかどうかについて調査して分かったことを書きます。 なぜInternet Explorer 11サポートが問題になるかというと、I…

【2018年版】メディアクエリのブレークポイントを考える

はてなブログで自作テーマを制作するにあたりメディアクエリを考えてみます。 2018年現在のベストなブレークポイントを考えてみようというわけです。 今使っているテーマはInnocentですが、このテーマは細かくメディアクエリのブレークポイント設定をしてい…

はてなブログでオリジナルテーマ自作の構想を練る

はるなぴログも大分テーマのカスタマイズが進んできました。 そこで今回は、はてなブログでオリジナルテーマ自作の構想を練ってみたいと思います。 はてなブログテーマInnocentの問題点は何か? 自作してみたいオリジナルテーマの内容を考えてみる Innocent…