合格者の声Successful interview
HTML5プロフェッショナル
認定試験 レベル1 認定者
HTML5を積極的に活用
することで、スキル向上とともに
新たな領域に挑戦したい。
株式会社クリエイティヴ・リンク
システム部 デザイナー
小林 京子さん
きっかけ
Webデザイナーとして8年、
AFP通信のニュースサイトを担当して
5年のキャリア
クリエイティヴ・リンクでは、AFPBB Newsなど、世界三大通信社のひとつであるAFP通信のニュースサイトを運営している会社です。具体的には、フランスのAFP通信の元のデータを日本語に翻訳して、毎日約300枚の写真とともに配信しています
現在、私はデザイナーとしてシステム部に所属し、毎日の記事の更新を始めとして、リニューアルや新しいカテゴリの追加、またそれらの使い勝手を良くするために改善などのデザインやコーディングを担当しています。
デザイナーの仕事としては、編集部が記事をアップするためのテンプレートを作成することですが、その他にもオリンピックやワールドカップなど時節ごとの特集記事については個々に対応します。また、素材はAFPのものを使っていますが、サイトとしてはニュースの他にもファッション系など4つのカテゴリに分かれているので、それらのメンテナンスもデザイナーの仕事です。
ポートフォリオ以外に自分のスキルを
アピール出来る
資格が欲しかった
HTML5プロフェッショナル認定レベル1は、2014年9月に受験し、取得しました。資格の話は、試験がリリースされる前から個人的に情報を収集していたRSSや「HTML5プロジェクト」のGmailグループからメーリングリスト情報を得ていました。
そんなおり、ちょうど同じシステム部の方がデータベース関連の資格を取得されたんですね。また、Webデザイナー向けの雑誌にHTML5プロフェッショナル認定試験の案内広告が載っていて、それに触発されて「私も取ってみようか」と思い立ったのが受験のきっかけです。
HTML5は、モバイル機器やIoTの推進とともに、すでにエンジニアやプログラマだけでなく、営業の方々も知っているキーワードとなっています。また、それまでWebデザイナーのスキルを測るための要素のほとんどはポートフォリオで、資格取得はとくに重視されていませんでしたが、HTML5プロフェッショナル認定は、Webデザイナーにとって、ポートフォリオ以外で自分のスキルをアピールできる資格だと感じたことも取得したいと思う背景にはありましたね。
HTML5の活用について
デザインのフルリニューアル実施とともに
HTML5を本格的に活用
私がWeb業界に入った8年前は、まだテーブルデザインが全盛でした。そこからdivタグに変わった頃にコーディングを学び始めたのですが、私自身は、テーブルよりdivで囲んだり、H1やH2のタグを使うマークアップの方が理解しやすく、HTML5にはすぐに馴染めました。
実際にHTML5を使い始めたのはクリエイティヴ・リンクに入社してからです。AFP通信のサイトは、他のメディアサイトに比べて写真が豊富であることが特徴で、高品質の画像を多用し、ビジュアルを重視したデザインとなっています。入社2年目の終わりに外部のメディアと連携できる仕組みを構築するため、大規模なリニューアルが実施されました。
その際、テンプレートだけでなく、基礎となる配信システムの構築も変えることになったのですが、当時はまだHTML5はまだ一部のマークアップを変える程度にしか使われていませんでした。本格的にHTML5が使われたのは、2014年の春に行われたデザインのフルリニューアルの実施からでした。リニューアルにあたっては、編集にかけられる時間が短いため、シンプルでありながら印象的となるようデザインにも気を使いました。
HTML5最大のメリットは
「マークアップの改善」
HTML5では、文書型宣言やtypeなどの記述が簡潔になったため、head内をシンプルに書くことができ、ソースがスッキリします。そのため余計なタグは減り、タイトル、ナビゲーション、補足情報など、情報の優劣を明確にして文書構造を作ることができます。また、ソースがシンプルになればサイトも軽くなり、サイトパフォーマンスを高めることができます。これによりSEO上適切に内部施策を向上させることもできるのです。
また、section,article,header,footer,aside,nabタグなどの新たなタグが増えたため、より文書構造が本質的になります。プラグインを使わずHTML/CSS/JS/で作ってマルチデバイスでの最適なパフォーマンスを実現することが可能ですし、フォームタグの機能が増えたため、JavaScriptにさえも頼らなくて良いなどの点が大きいかと思います。
一方、ニュースサイトは様々な環境の方々に閲覧されます。今後は、動画や音声の再生、画像の動的な描画機能などのマルチメディア機能が充実させ、ニュースサイトをさらに進化させるためには、やはりHTML5はとても有効だと思います。
試験に向けた取り組み
サンプルを交えての説明でとても
わかりやすかったLPI-Japanのセミナー
HTML5プロフェッショナル認定レベル1を受験するにあたっては、これまでのWebやメーリングリストでのHTML5についての日常的な情報収集に加えて、LPI-Japanが認定している参考書等を読んだり、試験ポイントを解説するLPI-Japan主催「技術解説無料セミナー」に参加するなどして勉強しました。
集中的に勉強したのは受験前の一週間ぐらいでしたね。具体的には、サイトや教科書を読み、実際にソースを書いてみるという地道なものです。勉強に使ったのは、たいてい休みの日や通勤時間などですが、当社では就業時間の1時間を資格取得のために使える制度もあり、それも最大限に利用しました。
時間には不自由しなかったのですが、一方で試験対策について相談する相手が身近にいないことが唯一不安でした。外部のセミナーに参加したのはそのためでもあります。セミナーは延べ4回ぐらい参加しましたが、出題範囲の大まかなチェックや重要ポイントのピックアップ、試験に向けた意識と対策など、サンプルを交えての説明でとてもわかりやすかったのでお勧めします。
受験してみた感想
知識が深められ仕事の幅も広がった
試験を受けるために学習したことで、これまでWebデザイナーとして仕事をしてきた自分の知識を再確認できました。また、試験は出題範囲も広く、実際の仕事ではなかなか学べなかった分野の知識を深める意味でも、受験勉強は役に立ったと思います。
具体的には、コーディングについてはデザイナーなので熟知していますが、普段、仕事であまり触れることがないネットワーク・サーバ関連技術についての知識は浅かったので、そのあたりを教科書ベースでいちばん勉強しました。これらの知識は、デザインをフロントだけで行うのではなく、バックにある環境も含めて創造していくために必要な知識だと実感しました。
また、実際の仕事の上でもバックヤードのプログラム組み込みまでを担当するようになり、仕事の幅も広がりました。以前は、イメージを作ることがデザイナーの主たる仕事でしたが、今は、モバイル端末の普及によってスマートフォンなどでの操作感も重視されます。
それとともにファッションサイトのような「かっこいい」デザインだけでなく、シンプルで機能性に富んだ立体かつ動的なWebデザインが求められるようになってきました。そこがいちばんの変化であり、デザイナーの仕事として最も面白い部分だと感じます。
今後の目標
最も重視されているのはモバイル対応
次は、ぜひレベル2の取得にも挑戦したいと思っています。ただ、レベル2受験者向けのセミナーにも参加した事がありますが、こちらはかなり難度が高いと感じました。また、JavaScriptも日常的に使っているのですが、すべて自分が一からコードを書いているわけではなく、テンプレートを利用してアレンジするケースも多いので、それについては今後の私の課題です。
一方で、PC用とモバイルフレンドリーなデザインの構築ではかなりの部分で違いがあるため、HTML5を活用しながらもそれぞれへの最適化を検討する必要があります。現在、当社がメインで運営しているニュースサイトは単一ソースをレスポンシブするのではなく、ユーザーエージェントによってPC用のページ、スマートフォン用のページをそれぞれ最適化して振り分けています。
その理由としては、ニュースサイトは早く表示されることを重視していることと、やはりPCと同じソースをスマートフォンの画面では出すことができないためです。そのいちばんの要因は、写真画像です。当社のニュースサイトでは、高品質の写真をきれいに見せるため、PC用のページではかなり大きなサイズの画像データをリンクさせており、それらをすべてスマートフォン用のページにも併用することはかなり無理があります。
また、商業サイトで広告収入は重要ですが、PC用ページのバナー広告をスマートフォン用のページに併用できないことが多いという現実があり、現在、当社のニュースサイトのバナー広告は、PCとスマートフォンでクライアントがそれぞれ違います。そのため、PC、モバイルそれぞれに最適なフォーマットや動作については熟慮した上で、HTML5を活用しながらそれぞれの環境にあわせて最適化することが必要です。
HTML5によって広がるデザイナーの活躍領域
いずれにせよ、HTML5が将来的にデファクトスタンダードになることを考えれば、Webデザイナーにとってその知識の習得は避けて通れません。また、積極的にこれを活用することで、デザイナーの役割はいかようにも広がります。
その意味でも「HTML5プロフェッショナル認定試験」は、私にとって、新たな領域に挑戦を可能にするとともに、自らのスキルを向上させる良いきっかけになったと思います。
メルマガ登録E-mail Magazine
受験を決めたら、まずメルマガ登録。
学習に役立つ例題解説付きメールマガジンを定期発行
