動作検証が終わり、不具合の反映がすべて完了したら、利用環境やブラウザの要件に応じて網羅的にブラウザチェックを実施します。フロントエンド実装の品質を高めるための最終的な確認・修正の工程です。
ブラウザチェックシート作成
ブラウザチェックはディレクターもしくはエンジニアが作る【ブラウザチェックシート】を用いて実施します。基本的にエンジニアがチェック作業を行いますが、対象画面数が多かったり、仕様が複雑な画面はディレクターと分担してチェックを実施することもあります。
標準的な対象ブラウザは以下の通りです。
- PC：WindowsのEdge、Chrome、MacintoshのSafari
- スマートフォン：iOS最新版のSafari、Android最新版のChrome
上記をもとにプロジェクトごとの要件に合わせて変更します。
ブラウザチェック項目
ブラウザチェックは大きく「表記統一」、「ソースコード」、「ブラウザ操作・パフォーマンス」、「レイアウトチェック」に項目を分けて実施します。
- 原稿・表記統一
デザイナーが設計時に整備した表記ルールに準じて、画面全体の表記のずれやルールの逸脱がないかを確認して修正します。 - ソースコード
実装したソースコードにエラーがないか確認して修正をします。また、納品物としてはコンパイル処理を管理するタスクランナーや、コンパイルを実装するファイルなども一緒に納品する場合が多いため、ソースコードを整理したり、お客さま向けに補足事項などをまとめます。 - ブラウザ操作・パフォーマンス
画面単位でブラウザの差異による動作検証をして、不具合の修正やパフォーマンスの改善を行います。 - レイアウトチェック
画面の表示崩れを対象のブラウザごとに確認して修正を行います。
納品までは品質を少しでも高めていきますが、多様なブラウザでの完璧な表示に固執するのは時間・コストの面で非現実的なため、ある程度の表示差異、挙動の違いは許容し、重篤な不具合があれば納品後に対応します。
