本日、はてなブログ無料テーマ「さくら」を公開しました。「こもれび差し込む森の木の葉」、「ひので」に次ぐ3作目となります。インストールはこちらからどうぞ。サンプルサイトはこちらです。
このテーマの特長
1.「ひので」に続き、写真から色を抽出
前作「ひので」につづき、実際に撮ったさくらの写真から色を抽出し、落とし込んでいます。左上の緑は花の隙間から見える葉っぱ、右上から左下にかけてのピンクのグラデーションは桜の花びらから抽出したもの。
2.画面いっぱいに表示されるファーストビュー
ブログのトップページを開くと、画面いっぱいにファーストビューが表示されます。ブログの入り口となるトップページ。ブログタイトルと説明文のみを配置し、ブログの入り口にふさわしいデザインとしました。
他のページはヘッダーの高さを抑え、スムーズに記事へ読み進むことができるようにしています。
3.丸みを帯びたフォント
フォントは丸みを帯びた「ZEN 丸ゴシック」を使用。角のない丸みを帯びたフォントで、さくらが持つやわらかく、かわいらしいイメージにしています。Webフォント Google Fonts を使用しているため、異なるデバイス・OS間でも同じフォントで表示されます。
また、文字と文字の間を広く取り、小さなデバイスでも記事が読みやすいようにしました。
4.アクセントには桜の花と花びら
記事のタイトル部分には、アクセントとして桜の花を使用することで一目で記事のはじまりが判別できるようにしています。
サイドバーの各項目には桜の花びらを使用し、記事タイトルとの差別化を図った上で各項目の区切りを一目で判別できるようにしました。
5.もちろんレスポンシブ対応
過去のテーマ同様、勿論レスポンシブに対応しているのでスマホ・PC・タブレットなどありとあらゆる端末で快適にブログを閲覧できます。折り畳みスマホ?そんなもの知りません((
6.対応環境
PC版Chrome、SP版Chrome、SP版Brave、SP版Yahoo、SP版SkyLeapで動作を確認しています。
前作のひのででも同様の事象がありましたが、SP版のChrome、Braveではスクロール時に画面下に白帯が発生します。恐らく各ブラウザのアドレスバーによるものですが、CSSのみでは対応が難しいので、そういう仕様ということでご了承ください。
SkyLeapはDeNAが提供しているスマホ限定のブラウザですが、上のような事象は確認していませんので、もし白帯が出てくるのが嫌だという人はSkyLeapで閲覧するといいと思います。SkyLeapのインストールはこちらからどうぞ。
以上、はてなブログテーマ「さくら」のご紹介でした。テーマははてなブログユーザーなら誰でも無料でインストールして利用することができるので、気になった方はぜひ使ってみてください。