\副業初心者が選ぶべきクラウドソーシングサービス4選/

Cocoon(コクーン)トップページのデザイン例25選!

※当サイトはアフィリエイト広告を利用しています

ブログで稼ぐ

ブログ5カ月目のtsenです。

このブログはCocoon(コクーン)という無料のワードプレステーマを使用しています。

Cocoon(コクーン)は、無料とは思えないほどの高機能テーマで

その1つに、スキンという便利な機能があって初心者でもそれっぽいデザインが作れるし、

スキンを変えればデザインチェンジも簡単にできちゃいます。

なので、一口にCocoon(コクーン)とはいっても、実はデザインは人によって様々です。

そこで、今回は私のTwitterでCocoon(コクーン)テーマを利用してブログをやっている方を募集し

デザイン事例を紹介してみたいと思います。

同じスキンを使っていても、全然違う見た目になっていたりして面白いですよ~。

スポンサーリンク

Cocoonのデザインベースはスキンで変更可能

Cocconのスキン一覧

Cocoon(コクーン)を使ったことがない方のために、

まずは、スキンって何?というところを説明しておきます。

Cocoonの設定画面で、スキン一覧というものがあり、これをぽちっと変えるだけで

簡単に色味やデザインチェンジができてしまう機能です。

どんなデザインになるのかは、

このピクチャーマークの部分にカーソルを置くとサンプル表示がされます。

コクーンデザイン
コクーンのデザインサンプル

ちなみに、当ブログは、Fuwari -褐色(かちいろ)-というスキンを使わせてもらっていますが

このサンプル表示を見ても分かるように、当ブログとちょっと表示が違いますよね。

つまり同じスキンであっても、そこから色々とカスタマイズできるので、

個人によって、それぞれ個性が出ます。

私は、上のメニューバーを紫にしたり、ブログタイトルのロゴが結構派手色だったりしているので

このサンプルとも違うデザインに見えると思います。

Cocoon(コクーン)トップページのデザイン例25選!

では、早速Cocoon(コクーン)トップページのデザイン例を実際に見ていきたいと思います!

使用スキン:なし

使用スキンなしというのは、特定のデザインベースがなく、

1からご自身でヘッダーやメニューバーなどの色味を設定している形になります。

もやチャレ

コクーンデザイン例1

使用スキン:SILK

さよなら、さめたごはん

Cocoonデザイン例

使用スキン:ミックス

ツナグ旅

コクーンデザイン例7

おかに日記

使用スキン:Veilnui Simplog

けいかブログ

Cocoonデザイン例

FIRE GAME

Cocoonデザイン

使用スキン:Bizarre-food(ホワイトラーメン)

秩父のWeb屋さん

Cocoonトップページデザイン例

使用スキン:アリス

おきくの日常ブログ

使用スキン:Season

kurumico.com

コクーンデザイン例12

ワーママの転職|転職ポーチ

コクーンデザイン例21

まとめて情報ポッケ

使用スキン:Fuwari

NURSE≠ME

コクーンデザイン例15

天国に一番近い個人旅行

使用スキン:bizarre-food

きれいの理由

コクーントップページ

シンタローコード

Cocoonデザイン例

Simple Navy

イピリカ主夫リーランスブログ

使用スキン:COLORS

えりこの家計ブログ

まとめ

いかがでしょうか?

皆さん、個性があってとっても素敵なデザインですよね。

同じスキンでもカラーが違うだけでも、結構印象が変わりますが、

ヘッダー画像や背景などによって、かなりデザインが変わりますよね!

Cocoon(コクーン)でブログを作っている方や、これから作ってみたい方の
トップページデザインの参考になれば幸いです。

ここまで読んでいただきありがとうございました。