[{"data":1,"prerenderedAt":342},["ShallowReactive",2],{"navigation_docs":3,"-frontend":190,"-frontend-surround":339},[4,136,150,183],{"title":5,"path":6,"stem":7,"children":8},"Frontend","\u002Ffrontend","1.frontend",[9,13,39,76,109,130],{"title":10,"path":6,"stem":11,"order":12},"フロントエンド ガイドライン","1.frontend\u002Findex",1,{"title":14,"path":15,"stem":16,"children":17},"HTML","\u002Ffrontend\u002Fhtml","1.frontend\u002F1.html\u002Findex",[18,19,23,27,31,35],{"title":14,"path":15,"stem":16},{"title":20,"path":21,"stem":22},"コードスタイル","\u002Ffrontend\u002Fhtml\u002Fcode-style","1.frontend\u002F1.html\u002Fcode-style",{"title":24,"path":25,"stem":26},"見出しタグ","\u002Ffrontend\u002Fhtml\u002Fheading","1.frontend\u002F1.html\u002Fheading",{"title":28,"path":29,"stem":30},"img タグ","\u002Ffrontend\u002Fhtml\u002Fimg","1.frontend\u002F1.html\u002Fimg",{"title":32,"path":33,"stem":34},"パスとリンク","\u002Ffrontend\u002Fhtml\u002Flink","1.frontend\u002F1.html\u002Flink",{"title":36,"path":37,"stem":38},"品質管理","\u002Ffrontend\u002Fhtml\u002Fquality","1.frontend\u002F1.html\u002Fquality",{"title":40,"path":41,"stem":42,"children":43},"CSS","\u002Ffrontend\u002Fcss","1.frontend\u002F2.css\u002Findex",[44,45,49,52,56,60,64,68,72],{"title":40,"path":41,"stem":42},{"title":46,"path":47,"stem":48},"命名規則・コンポーネント設計","\u002Ffrontend\u002Fcss\u002Farchitecture","1.frontend\u002F2.css\u002Farchitecture",{"title":20,"path":50,"stem":51},"\u002Ffrontend\u002Fcss\u002Fcode-style","1.frontend\u002F2.css\u002Fcode-style",{"title":53,"path":54,"stem":55},"Web フォント","\u002Ffrontend\u002Fcss\u002Ffonts","1.frontend\u002F2.css\u002Ffonts",{"title":57,"path":58,"stem":59},"記述順番","\u002Ffrontend\u002Fcss\u002Forder","1.frontend\u002F2.css\u002Forder",{"title":61,"path":62,"stem":63},"プロパティのルール","\u002Ffrontend\u002Fcss\u002Fproperties","1.frontend\u002F2.css\u002Fproperties",{"title":65,"path":66,"stem":67},"Tailwind CSS","\u002Ffrontend\u002Fcss\u002Ftailwind","1.frontend\u002F2.css\u002Ftailwind",{"title":69,"path":70,"stem":71},"値のルール","\u002Ffrontend\u002Fcss\u002Fvalues","1.frontend\u002F2.css\u002Fvalues",{"title":73,"path":74,"stem":75},"CSS 変数（カスタムプロパティ）","\u002Ffrontend\u002Fcss\u002Fvariables","1.frontend\u002F2.css\u002Fvariables",{"title":77,"path":78,"stem":79,"children":80},"JavaScript","\u002Ffrontend\u002Fjs","1.frontend\u002F3.js\u002Findex",[81,82,85,89,93,97,101,105],{"title":77,"path":78,"stem":79},{"title":20,"path":83,"stem":84},"\u002Ffrontend\u002Fjs\u002Fcode-style","1.frontend\u002F3.js\u002Fcode-style",{"title":86,"path":87,"stem":88},"エラーハンドリング","\u002Ffrontend\u002Fjs\u002Ferror-handling","1.frontend\u002F3.js\u002Ferror-handling",{"title":90,"path":91,"stem":92},"ライブラリの利用","\u002Ffrontend\u002Fjs\u002Flibraries","1.frontend\u002F3.js\u002Flibraries",{"title":94,"path":95,"stem":96},"HTML への読み込み","\u002Ffrontend\u002Fjs\u002Floading","1.frontend\u002F3.js\u002Floading",{"title":98,"path":99,"stem":100},"モジュール","\u002Ffrontend\u002Fjs\u002Fmodule-structure","1.frontend\u002F3.js\u002Fmodule-structure",{"title":102,"path":103,"stem":104},"命名規則","\u002Ffrontend\u002Fjs\u002Fnaming","1.frontend\u002F3.js\u002Fnaming",{"title":106,"path":107,"stem":108},"パフォーマンス最適化","\u002Ffrontend\u002Fjs\u002Fperformance","1.frontend\u002F3.js\u002Fperformance",{"title":110,"path":111,"stem":112,"children":113},"画像・メディアリソースガイドライン","\u002Ffrontend\u002Fmedia","1.frontend\u002F4.media\u002Findex",[114,115,119,123,127],{"title":110,"path":111,"stem":112},{"title":116,"path":117,"stem":118},"アクセシビリティ","\u002Ffrontend\u002Fmedia\u002Faccessibility","1.frontend\u002F4.media\u002Faccessibility",{"title":120,"path":121,"stem":122},"画像フォーマット","\u002Ffrontend\u002Fmedia\u002Fformats","1.frontend\u002F4.media\u002Fformats",{"title":124,"path":125,"stem":126},"ファイル命名規則","\u002Ffrontend\u002Fmedia\u002Fnaming","1.frontend\u002F4.media\u002Fnaming",{"title":106,"path":128,"stem":129},"\u002Ffrontend\u002Fmedia\u002Foptimization","1.frontend\u002F4.media\u002Foptimization",{"title":131,"path":132,"stem":133,"children":134},"開発環境テンプレート","\u002Ffrontend\u002Fenvironment","1.frontend\u002F5.environment\u002Findex",[135],{"title":131,"path":132,"stem":133},{"title":137,"path":138,"stem":139,"children":140,"page":149},"Deploy Release","\u002Fdeploy-release","2.deploy-release",[141,145],{"title":142,"path":143,"stem":144},"デプロイ","\u002Fdeploy-release\u002Fdeploy","2.deploy-release\u002Fdeploy",{"title":146,"path":147,"stem":148},"リリース","\u002Fdeploy-release\u002Frelease","2.deploy-release\u002Frelease",false,{"title":151,"path":152,"stem":153,"children":154},"Git","\u002Fgit","3.git",[155,159,163,167,171,175,179],{"title":156,"path":152,"stem":157,"order":158},"Git ガイドライン","3.git\u002Findex",3,{"title":160,"path":161,"stem":162},"ブランチ戦略","\u002Fgit\u002Fbranch","3.git\u002Fbranch",{"title":164,"path":165,"stem":166},"CI\u002FCD運用","\u002Fgit\u002Fcicd","3.git\u002Fcicd",{"title":168,"path":169,"stem":170},"コミットメッセージとタグ","\u002Fgit\u002Fmessage","3.git\u002Fmessage",{"title":172,"path":173,"stem":174},"Pull Request運用","\u002Fgit\u002Fpull-request","3.git\u002Fpull-request",{"title":176,"path":177,"stem":178},"リポジトリ運用","\u002Fgit\u002Frepository","3.git\u002Frepository",{"title":180,"path":181,"stem":182},"GitHub権限・セキュリティ","\u002Fgit\u002Fsecurity","3.git\u002Fsecurity",{"title":184,"path":185,"stem":186,"children":187,"order":189},"AI 利用ガイドライン","\u002Fai","4.ai\u002Findex",[188],{"title":184,"path":185,"stem":186,"order":189},4,{"id":191,"title":10,"body":192,"description":322,"extension":333,"links":334,"meta":335,"navigation":336,"path":6,"seo":337,"stem":11,"__hash__":338},"docs\u002F1.frontend\u002Findex.md",{"type":193,"value":194,"toc":321},"minimark",[195,200,204,220,225,230,236,239,243,246,249,252,255,258,261,272,274,277,314,318],[196,197,199],"h2",{"id":198},"検証対応ブラウザ","検証・対応ブラウザ",[201,202,203],"p",{},"標準サポート対象は次のとおりとします。",[205,206,207,211,214,217],"ul",{},[208,209,210],"li",{},"Chrome（リリース時点での最新版）",[208,212,213],{},"Edge（リリース時点での最新版）",[208,215,216],{},"Safari（Desktop \u002F iOS のリリース時点での最新版とその 1 つ前のマイナーバージョン）",[208,218,219],{},"Android Chrome（リリース時点での最新版）",[221,222,224],"note",{"to":223},"https:\u002F\u002Fics.media\u002Fentry\u002F250422\u002F","Chromium を基盤とする Chrome と Edge を標準サポートとすることで、実装上の整合性を確保しつつ国内ユーザーの多くをカバーできます。",[226,227,229],"h3",{"id":228},"firefox-の取り扱い","Firefox の取り扱い",[201,231,232,233],{},"Firefox は Chrome・Safari・Edge に次いで利用率の高いブラウザですが、日本国内におけるシェアは概ね数パーセント（多くても概ね 5% 程度）に留まります。",[234,235],"br",{},[201,237,238],{},"シェアの低さに対して、Firefox を正式なサポート対象に含めるとテストや回避策のコストが発生するため、コストとカバー率のバランスを考慮して判断してください。",[221,240,242],{"to":241},"https:\u002F\u002Fgs.statcounter.com\u002F","アクセス解析で Firefox のシェアが業務上無視できない値（例：3% 以上）である場合や公共性や金融サービスなど、ブラウザの多様性が事業要件となる場合は Firefox（最新 3 バージョン）をサポート対象に追加することを検討します。",[226,244,245],{"id":245},"レガシーブラウザ",[201,247,248],{},"Internet Explorer は公式サポートが終了しているため、新規サイトのサポート対象外とします。また、Edge の IE モードも新規実装では原則サポート対象から除外します。",[226,250,251],{"id":251},"実装時の確認方法",[201,253,254],{},"新機能採用の可否は Can I use や MDN の互換性情報を参照し、必要であれば StatCounter 等で自サイトのブラウザ利用状況を確認してください。",[196,256,257],{"id":257},"ユーザビリティ",[201,259,260],{},"パソコンやウェブの操作が慣れていない方でも、なるべくストレスなくサイト内を遷移していただけるように、次のような考え方とルールに従って制作を行ってください。",[205,262,263,266,269],{},[208,264,265],{},"文字色は背景と十分なコントラストを確保し、文字サイズは原則 10px 以上とします。",[208,267,268],{},"テキストリンクは下線や色の違いで、リンクと分かるようにします。マウスオーバー時も同様に区別できるようにしてください。",[208,270,271],{},"ボタンは陰影やアイコンなどでクリックできることが分かるようにします。マウスオーバー時も認識しやすくしてください。",[196,273,116],{"id":116},[201,275,276],{},"アクセシビリティ（A11Y）: 視覚・聴覚・運動・認知等に制約のある利用者が使いやすい実装を心がけてください。実装段階で最低限確認すべき項目は次のとおりです。",[205,278,279,291,294,297,300],{},[208,280,281,282,286,287,290],{},"画像には適切な ",[283,284,285],"code",{},"alt"," を付与（装飾は ",[283,288,289],{},"alt=\"\"","）",[208,292,293],{},"主要な操作はキーボードのみで実行可能に（Tab 順、Enter\u002FEscape の挙動）",[208,295,296],{},"フォーカスが視認できること（アウトラインや代替スタイル）",[208,298,299],{},"テキストと背景のコントラストは WCAG AA（最小 4.5:1）を目安に",[208,301,302,303,306,307,306,310,313],{},"意味のある要素はセマンティックに（",[283,304,305],{},"button",", ",[283,308,309],{},"label",[283,311,312],{},"nav"," 等）",[196,315,317],{"id":316},"seo検索エンジン最適化","SEO（検索エンジン最適化）",[201,319,320],{},"title タグや meta description、見出し構造など、基本的な SEO 対策を行なってください。",{"title":322,"searchDepth":323,"depth":323,"links":324},"",2,[325,330,331,332],{"id":198,"depth":323,"text":199,"children":326},[327,328,329],{"id":228,"depth":158,"text":229},{"id":245,"depth":158,"text":245},{"id":251,"depth":158,"text":251},{"id":257,"depth":323,"text":257},{"id":116,"depth":323,"text":116},{"id":316,"depth":323,"text":317},"md",null,{},{"order":12},{"title":10,"description":322},"8gN4tCmORoVySQ5sY14npB2WcIl6mcHNgfgGifgV9FU",[334,340],{"title":14,"path":15,"stem":16,"description":341,"children":-1},"セマンティック・アクセシビリティ、一貫性、メンテナンス性を重視したHTMLマークアップのガイドライン",1780099574803]