日清食品グループ

日清食品グループのコーポレートサイトのデザインやCSSの記述などを分析した結果を掲載中。有名大手一流企業のWEBサイトはどのように作られているか知りたい時や、企業のホームページ制作で困ったときにチェック!

日清食品グループのウェブサイト。製品情報をはじめ、CMやキャンペーンなどの情報が満載です。ほかにも、お客さまに安心してお召し上がりいただくための「食の安全」に対する取り組みも紹介しています。

タイトル・テキスト設定

See the Pen HITACHI by keisuke414 (@keisuke414) on CodePen.

font-family

‘メイリオ’,Meiryo,’ヒラギノ角ゴ Pro W3′,’Hiragino Kaku Gothic Pro’,’MS Pゴシック’,Arial,Helvetica,sans-serif

H1タグのフォント設定

24px相当
bold
#777777

H2タグのフォント設定

17.6px相当
bold
#575757

H3タグのフォント設定

16px
bold
#737373

H4タグのフォント設定

15.36px相当
bold
#333333

Pタグのフォント設定

14.4px相当
#333333

「px相当」はrem,em,%などの設定をしているものを、pxに換算した場合の数値です。

感想

日清食品グループのサイトを見て感じた点です。

まず全体的な印象ですが、コーポレートカラーを基調とした色遣いがシンプルですっきりとした好印象のサイトです。

次にヘッダーメニューですが、使い勝手が良いです。

見出しのデザインですが、これもコーポレートカラーを取り入れたシンプルなデザインでわかりやすく見やすいデザインになっています。

全体のデザイン:★★★★★

UI:★★★★★

画像:★★★★★

フォント:★★★★★

SEO:★★★★★

参照

使用技術

CMS

Contentful

ウィジェット

Twitter

Facebook

アナリティクス

 Google Analytics

JavaScriptフレームワーク

GSAP

その他

parcel

Amazon S3

CDN

Amazon Cloudfront

アドネットワーク

Twitter Ads

タグマネージャー

Google Tag Manager

PaaS

Amazon Web Services

Social login

Facebook Sign-in

ドメイン情報

不明

サーバー情報

使用サーバー

AWS

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です