ランディングページ

こだわりポイント

高速・軽量・軽快

User Experienceを低下させないよう画質に最大限配慮し高品位な画像の圧縮行った。また、PCやスマートフォンのデバイスの画面幅に応じて画像の読み込みの最適化を行った。それにより、大きなサイズの画像を多く使いながらもPage Speed Insights においてパソコンでは最高の100、モバイルではそれに肉薄する97のハイスコアを達成した。

javascript・CSSの読み込みの最適化

画像の圧縮とともにscriptの読み込みの最適化を行うことで、メインビジュアルが表示されるまでの時間を短縮した。また、webフォントが読み込まれるまでの間、代替のデバイスフォントで描画させることにより、テキストが表示されない時間が極力短くなるように配慮した。

BEMによるマークアップ

ポピュラーな命名規則であるBEM を用いてマークアップをすることで、コードの可読性、拡張性、運用保守性を高めコード品質を追求した。

※注意点

ポートフォリオ用のランディングページのため、リンク先には飛びません。