SHOEISHA iD

※旧SEメンバーシップ会員の方は、同じ登録情報(メールアドレス&パスワード)でログインいただけます

HRzine Day(エイチアールジン・デイ)は、人が活き会社が成長する人事のWebマガジン「HRzine」が主催するイベントです。毎回、人事の重要課題を1つテーマに設定し、識者やエキスパードが持つ知見・経験を、参加者のみなさんと共有しています。

直近開催のイベントはこちら!

HRzine×SmartHR 人材・組織活性化フォーラム

2024年12月6日(金)13:00~15:30

主要製品スペック一覧

人事業務の効率・確度・精度を高めるために欠かせないHRテクノロジー。その主な製品の機能を分野ごとに比較できる資料群です。製品検討の参考資料としてご活用ください。

eラーニング・LMS<br>主要製品スペック一覧 2024

eラーニング・LMS
主要製品スペック一覧 2024

その他のスペック一覧

人事労務管理システム<br>主要製品スペック一覧 2023

人事労務管理システム
主要製品スペック一覧 2023

タレントマネジメントシステム<br>主要製品スペック一覧 2023

タレントマネジメントシステム
主要製品スペック一覧 2023

【富士通ラーニングメディア】のすごいIT研修 体験記 | 第5回(AD)

既存も新規も業務アプリは「HTML5」が原則! モダンなUIを作りユーザーが満点を出す開発者を目指そう

  • Facebook
  • X
  • Pocket
  • note
  • hatena

 業務で使用するエンタープライズシステムでも、UI(ユーザーインターフェイス)の出来不出来が評価に大きく影響する時代。IT技術の研修サービスを行っている富士通ラーニングメディアでは、「HTML5」を学びに来る業務アプリケーション開発者が増えているという。資格Zine編集長の市古が同社の研修を体験をレポートするシリーズの第5回として、今回はHTML5研修の体験レポートをお届けする。

  • Facebook
  • X
  • Pocket
  • note
  • hatena

業務アプリケーションでもHTML5対応はもう不可避です

 富士通ラーニングメディアでは、ITエンジニアが習得するべき技術のトレーニングコースを幅広く提供している。これまで本連載でも、Linux、プロジェクトマネジメント、ビッグデータ時代に向けてのBIツール、DevOpsへの第一歩とするChefまで、同社のさまざまな研修コースの体験レポートをお届けしてきた。今回、市古編集長が体験したコースは「ココが違う!HTML5 ~HTML4.01からの新要素~」。HTML4の知識をある程度持っているITエンジニアやWebページ作成者向けに、HTML5でどう変わったのかを集中的に解説するコースである。

 講師を務めてくださったのは、富士通ラーニングメディア ナレッジサービス事業本部 第二ラーニングサービス部 抜山雄一氏。「一般的なWebサイトではHTML5は浸透していますが、業務アプリケーションとなると、まだHTML4をベースとするものが多いのではないでしょうか。基幹業務システムとなるとブラウザの下位互換も重要で、企業内だとやはりIE(Internet Explorer)が多いという背景もあります。ただし、マイクロソフトは2016年1月にIE 10以前の古いIEのサポートを終了しました。これが業務アプリケーションでWebページを徐々に刷新していこうという動きへとつながっています」(抜山氏)

富士通ラーニングメディア ナレッジサービス事業本部 第二ラーニングサービス部 抜山雄一氏
富士通ラーニングメディア ナレッジサービス事業本部 第二ラーニングサービス部 抜山雄一氏

 業務アプリケーションにとって、古いIEのサポート終了はインパクトが大きい。念のため補足しておくと、問題なのは古いブラウザであり、HTMLのバージョンではない。しかし、ブラウザ再考と並行して「WebページをHTML5に」という考えが、業務アプリケーション開発者の間で広まってきている。

 なぜか。歴史がある業務アプリケーションの中には、サーバー側の処理は最先端に刷新されていたとしても、意外と見た目(フロントエンド)は古いままのものもある。しかし、いつまでも古いままではいられない。イマドキのWebページを作るなら、HTML5、CSS3、JavaScriptの組み合わせは必須かつ定番である。中でも、HTML5は土台となる仕様だ。そのため、これから新規に開発する業務アプリケーションを念頭に、「そろそろHTML5を見直しておくか」という開発者が増えてきているのだ。

 また、スマートフォンを業務で使用することが一般化したことも後押しとなっている。スマートフォンでもWebアプリの使い勝手を損なわないための技術として、近年では「レスポンシブWebデザイン」が定着してきている[1]。レスポンシブWebデザインではデバイスを判別し、デバイスのディスプレイサイズに合わせて表示を自動調整してくれる。こうした技術を理解するにも、HTML5の知識が必要だ。業務アプリケーションの開発者も、HTML5はもはや習得不可避な存在なのである[2]

[1]: レスポンシブWebデザインが施されたWebページは、パソコンから閲覧していれば横幅を広く用い、スマートフォンなら縦長にコンテンツを配置する。スマートフォンでも、もし横に傾ければ横幅に合わせてコンテンツがするっと移動したりする。これはレスポンシブWebデザインを実現するメディアクエリー(ウィンドウの幅やデバイスの向きに合わせて別のCSSを適用する技術)という仕掛けのおかげだ。

[2]: HTML5の資格試験も登場した。ITエンジニアがHTML5を学習するためのツール(あるいは教材)として便利だろう。

資格ZineのHTMLソースがサンプルに……(恥)

 さて、今回の「ココが違う!HTML5 ~HTML4.01からの新要素~」コースは富士通ラーニングメディアのオリジナルで、実施期間は2日間。教材はオリジナル教材に加えて、LPI-Japan HTML5認定教材『HTML5プロフェッショナル認定資格 レベル1 教科書』も併せて利用する。なお、同コースには、LPI-JapanのHTML5プロフェッショナル認定試験の受験バウチャーチケット付きコースもあり、こちらは受講者の満足度が特に高いコースとなっている。

 コースは初めてHTMLやWeb制作に触れるコースではないため、普段からWebページをある程度見慣れている人を想定している。その点では、いやしくもWebメディア「資格Zine」の編集長を務めているのだから、市古編集長も受講の資格がある。それどころか、連載5回目にして初めてホームグラウンドでの受講である。

 コース概要の説明を終え、実際のコース体験へと進もうとしたところ、抜山氏は「今回は資格ZineのWebサイトをサンプルに解説していきましょう。先に資格Zineのサイトを見ておきました」とさらっと告げた。なんというお気遣い。市古編集長のためにスペシャルプライベートレッスンにしてくれたようだ(このシリーズは毎回プライベートレッスンだが)。

 うれしさのあまり(?)「ええっ。なんか、自分んちの冷蔵庫を見られるような感じですね……」と動揺を隠せない市古編集長。ものすごく恥ずかしいようだ。

Webページのソースコードを確認するのにおすすめのブラウザ

 Webページのソースコードを確認するには、Google Chromeを使うのがおすすめである。Webページを開き、キーボードから[F12]キーを押すだけ。ブラウザ画面に実際のWebページとソースコードが並んで表示される。ソースコードのペインでマウスを動かすと、実際のWebページに該当する領域が色分けされる。ソースコードがどの領域を定義しているのかすぐ分かる。Webページの仕組みを学ぶならGoogle Chromeは最良のツールといえそうだ。

Google Chromeから資格ZineページのHTMLソースを確認中
Google Chromeから資格ZineページのHTMLソースを確認中

HTML5の無料セミナーを2017年2月に開催!

 富士通ラーニングメディアでは、HTML5の適用方法や要素技術を現場担当からの講演やハンズオンを通してご紹介する「【無料セミナー】体験!HTML5を活用した業務アプリ開発」を2017年2月8日(水)に開催します。詳しくは本セミナーのWebページをご覧ください。

次のページ
HTML5にするとコンピュータが構造を理解しやすいページとなる

この記事は参考になりましたか?

  • Facebook
  • X
  • Pocket
  • note
  • hatena
【富士通ラーニングメディア】のすごいIT研修 体験記連載記事一覧

もっと読む

この記事の著者

市古 明典(資格Zine編集長)(イチゴ アキノリ)

うさぎ化してますが、1972年の子年生まれ。宝飾店の売り子、辞書専門編集プロダクションの編集者(兼MS Access担当)を経て、2000年に株式会社翔泳社に入社。月刊DBマガジン(休刊)、IT系技術書・資格学習書の編集を担当後、2014年4月より開発者向けWebメディア「CodeZine」の編集に参加。資...

※プロフィールは、執筆時点、または直近の記事の寄稿時点での内容です

加山 恵美(カヤマ エミ)

フリーランスライター。茨城大学理学部卒。金融機関のシステム子会社でシステムエンジニアを経験した後にIT系のライターとして独立。エンジニア視点で記事を提供していきたい。EnterpriseZine/DB Onlineの取材・記事や、EnterpriseZine/Security Onlineキュレーターも担当しています。 Webサイト:http://emiekayama.net

※プロフィールは、執筆時点、または直近の記事の寄稿時点での内容です

【AD】本記事の内容は記事掲載開始時点のものです 企画・制作 株式会社翔泳社

この記事をシェア

  • Facebook
  • X
  • Pocket
  • note
  • hatena
HRzine
https://hrzine.jp/article/detail/215 2017/06/26 20:28

Special Contents

AD

Job Board

AD

おすすめ

アクセスランキング

アクセスランキング

イベント

HRzine Day(エイチアールジン・デイ)は、人が活き会社が成長する人事のWebマガジン「HRzine」が主催するイベントです。毎回、人事の重要課題を1つテーマに設定し、識者やエキスパードが持つ知見・経験を、参加者のみなさんと共有しています。

2024年12月6日(金)13:00~15:30

イベントカレンダーを見る

新規会員登録無料のご案内

  • ・全ての過去記事が閲覧できます
  • ・会員限定メルマガを受信できます

メールバックナンバー

アクセスランキング

アクセスランキング