モバイルファーストサイト100選　その21　小笠原海洋センターさんと考えるウミガメの未来│フェリシモ　

小笠原のウミガメを絶滅させないために。海基金付きのグッズができました。お買い物でウミガメを保護し、海に返す活動を支援！

ECサイト、フェリシモのプロモーションサイトです。
ウミガメ保護のためのコラボレーション商品の紹介ですね。

https://www.felissimo.co.jp/gopeace/ogasawara/

まず目に入るウミガメのアニメーションがとてもかわいいです。

構成

メイン部分は真ん中配置で、背景に乗っかている配置ですね。
背景部分はアニメーションだけで、リンク等はありません。
ページ内リンクも無く、ヘッダーナビとフッターナビは
フェリシモの他サイトへと飛ぶようになっています。

サイト内のコンテンツからは、
全てほかのサイトへと飛んでいますので、
このページ単体では完結しないのでしょうね。

たくさんあるサイト軍の一つ、という位置づけなのかもしれません。

配色

このサイトで使われている配色はこちら

海を思わせる色ですね。
サイト内では写真がたくさん使われていますが、
それらも青系のものが多くて、
全体に合わせていますね。

メイン背景の薄いところが一部透過になっていて、
少しだけ背景が見えたりします。
細部へのこだわりなのでしょうか。
こういう点は参考にしたいところです。

フォント

使用フォントは　A1 Gothic。
ナビゲーション部分だけ　游ゴシック のようです。

h１以外は画像にしているところは無いようですね。
見るよりも、読ませることを
目的にしているのかと思われます。

まとめ

ＰＣ時の背景のアニメーションが
ゆっくりと動き続けていて、
のどかで、なんだか癒されます。

SP 時にこののどかさが
見られなくなってしまうのが
ちょっと残念ですね。

あと見出しの下線のあしらいとか、
細部がこだわりがあって、
素晴らしいなと思いました。

こういった細かいところまで気を使えるように
なりたいと思います。