works制作実績
クリエイターズファクトリー様
Basic認証
ユーザー名:works
パスワード:test
サイトについて
架空の事業サイトをコーディングするスクール課題です。
XDでデザインカンプが用意されており、デザインカンプを見ながらコーディングしました。
コードの答えはなく自力で作成しています。
このサイトはSCSSを使用し、構造はFLOCSSをベースにしています。
デザインカンプは、『トップページ』、『スクール説明会について』、『ブログ』の3ページだけでしたので、デザインがあるページのみコーディングをしています。
制作期間
コーディング:4日
制作範囲
コーディング
使用ツール
VS Code
使用言語
HTML/SCSS/Java Script
コーディングで意識したところ
まずは、デザインカンプを見て、共通のパーツなどを探し出して、コンポーネントページにまとめました。
コンポーネントページはこちら
余白のつける位置も、Block要素に余白をつけずに、Element要素に余白をつけて、コンポーネントの独自性を保つように意識しています。
今回のWebサイトを制作する前に、jQueryを勉強したので、初めてjQueryを使用してハンバーガーメニューやアコーディオンメニューの実装をしました。
またハンバーガーメニューやアコーディオンメニューを実装する際に、簡単にではありますがWAI-ARIAのaria属性を使用し、今回初めてアクセシビリティの対応もしました。わからないところは、本や、Google検索をして調べながら実装しております。