- CODING FACTORY TOPICS
- Vol.128 2019年6月号
今月は品質管理部の設立から現在までを振り返ります。コーディングファクトリーの制作現場の変化とともに品質管理部の検証にどのような変化があったか、また今後の課題とははなにか、考えてみました。
検証内容の変化
品質管理部は設立から数えると10年近くコーディングファクトリー(CF)の制作物の検証を行ってきましたが、特にここ2年ぐらいで、検証内容に変化が出てきました。
過去~現在を振り返り、その時代ごとの検証の特徴についてまとめてみました。
レスポンシブWebデザイン(以下、RWD)が出てくる前(~2013)
いわゆるピクセルパーフェクトの案件が主流であり、検証でもデザインとブラウザとの突き合わせが重要視されていました。
現在と比べ、ブラウザ間でCSS3への対応にはまだ幅があり、ブラウザ固有の「クセ」が出やすい分、クロスブラウザチェックにおいては注意すべき点がわかりやすいという面がありました。
フィーチャーフォン(ガラケー)の検証では、端末によって画像とテキストのサイズの比率がまったく変わってくるようなこともあり、どこまで調整可能か線引きが難しく、当時のCFでも対応できるコーダーは少ない状況でした。
スマートフォンが登場した当初は、スマホサイトの挙動として何を基準にすればよいか、どこまで調整可能なのかをコーダーとともに模索していた時期でした。
複数デバイスに対応する場合は、PCとモバイルが別ソースであるためにそれぞれに内容を確認する必要があり、検証には時間を要しました。
また、社内もデータ管理のクラウド化が進んでおらず、アナログな方法で対応していた部分も多くありました。各ページを印刷し検証結果を手書きした紙をコーダーとやりとりしていたので、時間も手間もかかっていました。
RWD制作初期(2014~2016)
レスポンシブWebデザインが普及しはじめると、PC・スマートフォンが別々のソースから1ソースになり、テキストや画像などの検証にかける時間が短縮されました。その一方で、検証環境は増え続け、結果的に1ページあたりの検証工数は増加傾向にありました。
このころにはガラケーの検証がほぼ完全に無くなり、カドマル、ドロップシャドウといった画像で実装していた部分もCSS3のみで実装可能になってきました。サイドメニューの横にメインコンテンツが並んだ2カラム・3カラムのサイトを1カラムにリニューアルするような案件が増えたのも、この時期だったと思います。
スマートフォンのランドスケープ、あるいはタブレットでのPC表示を検証したときのことですが、メニューがマウスを使用する前提の設計になっていたために、タップで操作できないという現象が出たことがありました。マルチデバイスに対応する際にどのようなことに注意しなければならないか、さまざまな経験を積み重ねていく時期でもありました。
現在(2017~2019)
閲覧環境の多様化にともない、リキッドレイアウトが増えたことで、検証はデザインとの単純な突き合わせではなくなり、ある特定の幅のデザインからウィンドウ幅を変えた場合のレイアウトを汲み取ることが必要になってきています。
モダンブラウザが主流になり、ブラウザごとの表示の差異は縮小してきたと感じられますが、SVGやWeb フォントの使用が一般的になってきているため、これらについては差異に注意をしながら検証を行っています。
特にAndroidにおいては、発売される機種が増えたことと、OSをバージョンアップせず使い続けるユーザーがいることもあって、さまざまなバージョンが混在することとなり、閲覧環境がとても複雑になっています。
ここ数年は、品質管理部でも検証結果を記すチェックバックや案件資料などの管理を紙ベースからクラウドベースに移行したため、社内の意思疎通は昔よりスムーズになってきています。
今後の課題
Webサイトの目的が情報発信だけにとどまらず、機能や規模なども多種多様になってきたこともあり、数年前ならA4用紙1枚に仕様を記載して事足りるケースが多かったのですが、現在は検証前にコーダーと確認すべき項目が増え、検証工数だけでなくコミュニケーション工数も膨らんできています。だからこそ、品質管理部もプロジェクト全体を俯瞰して、
- ① プロジェクトの流れや各領域の状況を理解すること
- ② 仕様決めに関わり、サイトへの理解を深めておくこと
この2つに取り組むことが、コーダーとのコミュニケーションを円滑にし、品質を保つうえでも重要になってくると考えています。
最後に
普段は社内で制作する案件に対して行っている検証ですが、お客様向けにも検証サービスを提供しております。
Webサイトの概要や仕様は案件によってさまざまです。ご要望に沿った検証を行いますので、ぜひ御社の品質担保にお役立てください。