チェックの確認方法

• [x] チェック済み・・・その項目は合格
• [ ] 未チェック・・・その項目は不合格（要修正）

基本条件

• [x] スマホファーストでコーディングできている
• [x] CSS設計手法にはFLOCSSが採用されている
• [x] remでコーディングできている
• [x] ブレークポイントは768pxの１箇所だけ
• [x] BASIC認証の設定ができている
• [x] noindex,nofollowの設定ができている
• [x] 品質チェックリストが提出できている

赤笛合格ライン（「採用情報、記事セクション」のみ）

• [x] ピクセルパーフェクト

  • [x] 「PerfectPixel（Chromeのプラグイン）」で確認

    なんか違うぞ・・・？？

    ↓もさくっちがコーディングしたやつ

    

    ↓デザイン

    

  • [x] どうしてもズレてしまう場合や、保守性を優先して敢えてピクパしなかった部分については、提出の際に報連相できる

• [x] フォントの反映
  • [x] 「WhatFont（Chromeのプラグイン）」で確認

蒼笛合格ライン（「採用情報、記事セクション」のみ）

• [x] 表示崩れ
  • [x] インナー幅以上
  • [x] ブレイクポイント+1px
  • [x] ブレイクポイント-1px
  • [x] 375px
  • [x] 320px
• [x] ホバーアクション

  • [x] リンク挿入が想定される箇所がきちんとaタグになっている

    枠の部分も含めてカード全体がクリック領域になるといいです👍

    

  • [x] ホバー時の動きが指示通りになっている

  • [x] ホバー時の動きは、ふわっと変化する（transition設定ができている）

    線と丸の部分がふわっと変化しないです！

    ↓わかりやすいようにtransitionを1sにした状態

    画面収録 2023-03-03 19.36.47.mov

  • [x] ホバー時のカーソルはポインターになっている

• [x] jQueryで実装した動き
  • [x] 不自然な動きがない**（今回は該当箇所なし）**
• [x] 画像

  • [x] 画像最適化（最適な形式で書き出されているかどうか）

    写真などはjpg、背景透過が必要なもの・イラストなどはpng、ロゴなどベクター画像にすべきものはsvg

  • [x] Retinaディスプレイ対応のため画像は2倍書き出し→圧縮して表示