Static Site Basic 03

タスク名mgm-design (Task26)のランディングページ1ページの静的サイト制作。

デザインファイル

👉 mdm-design

PC	SP

作業要件

• デザインファイル(AI)を確認し、EJS/SCSSでマークアップします。 参考サイト：
  • EJS - Embedded JavaScript templates
  • SCSS 学習ガイド | 標準的なWeb学習
• FLOCSS ルールに従って CSS を設計し、コーディング時に再利用に注意してください。
• YoutubeとGoogleマップの部分はiframeでコーディングされています。

課題と要点

• 画像ファイルを書き出す場合は、1pxのオフセットに注意してください。 特にIllustratorは印刷物デザインで使用されることが多いため、ピクセルグリッド（mmやptで指定）が合わない場合があります。 その際、ピクセルプレビューを使用し、出力される画像ファイルに「1px」の差が生じないように注意してください。
• FLOCSS の規則に従って、後で追加のサブページが作成された場合にクラス名が競合しないように CSS クラスに名前を付けます。
• コーディング中にプロパティdisplay: flex を乱用しないでください。 水平ブロック要素の場合は、display: inline-block または float: left を使用するだけで十分な場合があります。 これらのプロパティを意識して使用してください。