works制作実績

クリエイターズファクトリー様

Basic認証

ユーザー名:works
パスワード:test

サイトについて

架空の事業サイトをコーディングするスクール課題です。
XDでデザインカンプが用意されており、デザインカンプを見ながらコーディングしました。
コードの答えはなく自力で作成しています。
このサイトはSCSSを使用し、構造はFLOCSSをベースにしています。
デザインカンプは、『トップページ』、『スクール説明会について』、『ブログ』の3ページだけでしたので、デザインがあるページのみコーディングをしています。

制作期間

コーディング:4日

制作範囲

コーディング

使用ツール

VS Code

使用言語

HTML/SCSS/Java Script

コーディングで意識したところ

まずは、デザインカンプを見て、共通のパーツなどを探し出して、コンポーネントページにまとめました。
コンポーネントページはこちら
余白のつける位置も、Block要素に余白をつけずに、Element要素に余白をつけて、コンポーネントの独自性を保つように意識しています。
今回のWebサイトを制作する前に、jQueryを勉強したので、初めてjQueryを使用してハンバーガーメニューやアコーディオンメニューの実装をしました。
またハンバーガーメニューやアコーディオンメニューを実装する際に、簡単にではありますがWAI-ARIAのaria属性を使用し、今回初めてアクセシビリティの対応もしました。わからないところは、本や、Google検索をして調べながら実装しております。