モバイルファーストサイト100選 その20 BEANS | ONCA COFFEE
豆へのこだわりについてご紹介しています。ONCA独自のチャートを参考に、「好き」と言える一杯を見つけてください。
群馬県前橋市を中心に数店舗を展開するカフェ「ONCA COFFEE」のホームページです
経営母体はメガネで有名なJINSだそうです。
どうりでかなりお洒落な感じがします。
シンプルながらも凝っていて、
なんとなく金かかっていそうな(笑)サイトですね。
![ONCA COFFEE](https://fifties-blog.genzaburow.com/wp-content/uploads/2024/01/4ebb62ea-486d-4e3a-8eb2-fe7fae5936a8-1024x476.png)
構成
真ん中にメインを置いたスタイルですが、
左はスライダーでイメージ画像を表示、
そして右にはナビゲーション。
このスタイルも素敵ですね。
![ONCA COFFEE](https://fifties-blog.genzaburow.com/wp-content/uploads/2024/01/74de6f7e-863f-4a40-b1df-655f5af076a9-1024x476.png)
リンクはそれぞれ別ページに飛びます。
モバイルサイトだと、別ページに飛ぶと
現在地が分かりにくくなる傾向があると思います。
しかし、ここのサイトはとても分かりやすいです。
ナビの現在地もわかりやすいですし、
左のイメージ部分にも表示されるので、
迷うことはなさそうです。
sp時には、ナビはハンバーガーになりますが、
同時にフッターに画像付きのナビが大きく出現しますので、
ページの遷移がとてもスムーズです。
全くストレスを感じなかったので、
素晴らしいなと思いました。
![ハンバーガー](https://fifties-blog.genzaburow.com/wp-content/uploads/2024/01/2c6cad3f-8e0e-4a3a-a1e5-5162ffa6db3a-520x1024.png)
配色
このサイトの配色はこちら
![配色](https://fifties-blog.genzaburow.com/wp-content/uploads/2024/01/スクリーンショット-2024-01-15-002202.png)
かなり少ないですね。
色を多用しなくても、
これほどにわかりやすく、かっこいいサイトができるんですね。
へ~~ってなりました。
フォント
ゴシック体は Noto Sans JP
本文の明朝体は MS P明朝 が使われています。
ナビなどはすべて画像になっていますが、
ほんの少しだけ手書き風を感じさせるフォントですね。
ナビに使われている下線も
手書き風でおしゃれです。
![sp1](https://fifties-blog.genzaburow.com/wp-content/uploads/2024/01/sp1-252x1024.png)
![sp2](https://fifties-blog.genzaburow.com/wp-content/uploads/2024/01/sp2-218x1024.png)
![sp3](https://fifties-blog.genzaburow.com/wp-content/uploads/2024/01/sp3-1-223x1024.png)
まとめ
全体的にシンプルですが、ものすごく洗練されている印象を受けました。
かっこいい。
こんなセンスはどうやって培うんでしょうね。
私個人はシンプルなサイトが好きなのですが、
シンプルでかっこいいのって、かなり難しいですよね。
そんなことを感じました。
![COFFEE](https://fifties-blog.genzaburow.com/wp-content/uploads/2024/01/jakub-dziubak-XtUd5SiX464-unsplash-1024x684.jpg)