ひさしぶりの投稿となりました、「美麗トップページ」。
更新忘れてるんじゃ？と思われた方も多いのではないでしょうか。
特に大した理由もなく、ただひたすらに忙しかっただけです（言い訳）
以前の紹介記事はコチラ
しかし、今回紹介するブログはそんな忙しい中でも紹介したい、とても洗練されたサイトです。
では、なぜそんなお洒落なサイトになっているのでしょうか？
理由を考えて行くことで、あなたのサイトのヒントにしてくださいね。
RUKI BOOKS
今回紹介するサイトはこのサイト
簡単に言えば「書評ブログ」。でも絶対に内容をネタバレしない、その本を総合的に評価するサイトであえて運営者は「書評」という言葉を使用しません。
今回は紹介しませんが、記事の書き方もお洒落。その本がどういう本なのか、評価や図解で説明してくれます。とても読みやすく、わかりやすいので参考になります。
また、「レコメンド３」と銘打って、そのジャンルの本を３冊紹介。同じジャンルでも方向性や解釈が違うことがありますよね。その３冊を読んでおけばとりあえずそのジャンルの方向性を網羅できるという取り組みもされています。
運営者
RUKI BOOKS 管理人
年間120冊程度の本を読む
好きなもの：本屋、図書館、カフェ、コーヒー、夏、朝
趣味：投資、アクアリウム
座右の銘：ユーモア、誠実さ
るきさんは年間120冊も本を読む読書家です。そんなるきさんが評価してくれるのだから、おもしろくないわけがないですよね！
るきさんは私が運営するデザインコミュニティ、「ブログデザイン部」にも所属してくれています。
もともとセンスをお持ちだったのですが、最近はデザインにも非常に興味を持たれて、デザイン本を読まれたりと勉強をすすめ、めきめきとデザイン力をつけてきている期待の新星です。
そんなるきさんが、楽しみながら作ったサイトを紹介していきます。
RUKI BOOKSがお洒落な理由 ６選
まずはサイトを確認していただきたい！
実際に伺って頂きたいのですが、動画もご用意しましたのでご参照ください。
サイトはこちらからどうぞ。
目を引くメインビジュアル
サイトを開いてまず目を引くのが、大切そうに本を抱きかかえる女性と「本が好き。」というキーワード。
これだけで、RUKI BOOKSがどういうサイトなのか一目瞭然。
さらに、女性だけが左から右へスライドしてくるアニメーションを使用することで、思わず手を止めてしまうような仕組みになっています。
チェックポイント
サイトの内容に合わせた写真とテキストでどういうサイトなのか表現
アニメーションを使用することで目を止めさせる
アニメーション
次に目を引くのがアニメーション。
見出しやイラスト、記事などが上からどんどん降ってきます。
アニメーションは思わず見てしまう特性があるため、滞在時間を伸ばす効果があります。
読者に見てもらいたい部分にアニメーションを入れることで、手を止めてもらえます。
るきさんは存分にアニメーションを使って表現されていますね。
チェックポイント
アニメーションは読者の手を止める効果がある！
透過素材を使用する
るきさんはアニメーションしてくるイラストや見出しなどをすべて透過素材で行っています。
- 透過素材とはイラストや文字の背景が透明になっている素材の事。
基本的に.png形式の画像になる。
透過素材にすることで、背景の色違いの場所でも違和感なく美しくアニメーションしてくることができます。
また、デザイン変更で背景色などが変わっても、そのまま使用できる場面が増えてくるのでとてもおすすめの手法です。
透過素材は「Canva Pro」で簡単に作成する事が出来ます。出来上がった素材を背景を透過してダウンロードするだけです。
また、人物などの切り抜きも簡単にできますので、こちらの記事をご参照ください。
チェックポイント
透過素材だとアニメーションが美しい
見出しなどを透過素材にしておくと、背景色が変わってもそのまま使用できる
おしゃれなアイキャッチ
るきさんは非常にデザインセンスをお持ちです。アイキャッチもほぼアドバイスなしで素敵な作品を作られています。
アイキャッチもある程度の統一感をもって作成されているため、権威性のアップにつながっています。
上のアイキャッチは「レコメンド３」カテゴリー用にるきさんにプレゼントしたテンプレートです。ご自身でそっくりに作られて実際に使用してくれています。
この様なアイキャッチのテンプレートプレゼント企画などもブログデザイン部では行っています。興味がある方はぜひ、入部をご検討ください。
チェックポイント
アイキャッチを統一することで権威性があがる
イラストの統一
RUKI BOOKSではサイト内のイラストを統一されています。
イラストを統一することで、サイト自体の権威性が上がる効果があります。統一感が出ることでしっかりと管理されたサイトだという印象になり権威性があがります。
RUKI BOOKSでは、ゆるくて人気の無料素材サイト「Linustock」を使用されています。
単色ですが、少し抜けた感じのイラストが揃っています。このイラストにテキストを加えることでなんとも言えない味がでる効果があります。
あなたもぜひ使用してみてはいかがでしょうか。
チェックポイント
イラストを統一することで権威性が上がる
SWELLを活用
RUKI BOOKSがさらなる進化
RUKIBOOKSはさらなる進化を遂げ、さらにお洒落に変貌しています。
その実態はぜひあなたの目で。モフモフ・ウネウネしています。
SWELLのフルワイドブロックの液状境界を「ウネウネ」させる方法は、ヤモヲさんの「POINT OF VIEW」の記事をご覧ください。あなたもウネウネできちゃいますよ！
まとめ RUKI BOOKSがお洒落な理由
- メインビジュアルの女性とテキストでサイトアピール
- アニメーションで読者の目を引く
- 透明素材を使用してアニメーションを綺麗に
- アイキャッチがお洒落
- イラストを統一して権威性アップ
- SWELLで簡単、お洒落にデザイン
いかががでしたでしょうか。
るきさんのデザインアイデアをあなたも真似してお洒落なサイトを作ってみませんか？
ぜひ実際にRUKI BOOKSへ伺ってみてくださいね。
どんぐり所長のおすすめツール
どこでも、どんなデバイスでも順位チェック
ブログ記事の順位を確認していますか？どんなキーワードが上下しているのか知る事はブロガーでは必須と言えます。
ほとんどの方がダウンロード型の順位チェックツールを使用されていますが、私はコレ。「Nobilista」。クラウド型のチェックツールです。
クラウド型とは、ネット上にあるサーバーにデータが保存されている順位チェックツールです。従って、お家のパソコン以外でも情報にアクセスできちゃうんです。これが想像以上に快適で、一度体験すると戻れなくなっちゃう。詳しい記事を書いていますので是非読んでみてください。
実は私、Nobilistaの公式アンバサダーをさせて頂いています。使いだしたら超気に入ってしまって、気づいたらアンバサダーになっていました。そんな私が、おすすめする「Nobilista」。今なら7日間無料でお試しができます。クレジットカードなどの情報を入れなくても試せるので、ぜひあなたにも試してほしい。
＼場所を選ばない快適さを体験して／
Nobilista公式サイト
当サイト推奨 デザインツール
当サイトでは、ブログ初心者でも簡単・無料で美麗なデザインが作成できる、オンライン画像作成フォーム「Canva」を推奨しています。数万点の素材やフォントが用意されていて、選ぶだけで簡単にプロ並みのデザインを作成する事ができます。これから先、会社員の仕事でも使用する事になるかもしれないほど普及が広まっています。覚えるなら早い方がいいですよ！
当サイトのデザインは、SWELLで再現可能
私はSWELLを2年使用してきました。現在４つのサイトでSWELLを使用しています。
SWELLを使用する理由は、簡単・綺麗・速い。
実際このトップページも、SWELLの標準機能だけでデザイン。
お洒落なブログを作りたいあなたにピッタリのWordPressテーマです。
私が実際に使用して実感したSWELLの特徴は以下。
- 完全ブロックエディタ対応
- 直感で使える操作性
- 便利な専用ブロックを多数用意
- お洒落なトップページが簡単に作れる
- 最速レベルのページスピード
- 一度購入すれば複数サイトに何度でも使用可能
- ユーザーの利便性を考える熱意の運営者
- SWELLを紹介すればアフィリエイト報酬が貰える（購入者のみ参加可）
- 販売価格 ￥17,600（税込）
唯一の欠点は価格の高さ。しかしそれは、SWELLがハイクオリティだから。
そして、運営者がとびきりの対応をしてくれる必要経費。
SWELLにはアフィリエイトプログラムがあり、紹介すれば利益を得ることもできます。
よく、「アフィリエイトがあるから紹介しているんでしょ。」と言われますがこれは違います。
惚れ込んだWordPressテーマに、たまたまアフィリエイトがあっただけ。
あなたもSWELLを体験すれば、きっと紹介したくなります。
＼圧倒的な操作性を体験せよ／
あなたも今日からSWELLER！
お気軽にコメントください