コラム
日常の業務で、こんな「あるある」はありませんか。
この記事を読めば、RPAがWeb操作でつまずく理由が理解できます。RPAがWebページをどのように「見ている（認識している）」のかを把握することで、原因が明確になるはずです。RPAに正確な指示を出せるようになれば、自分で業務の自動化を進められるようになります。
HTMLをすべて学ぶ必要はありません。この記事では、RPAツール「Coopel」を例に、自動化を行うために知っておきたい、最低限のHTMLタグと役割を丁寧に解説します。HTMLの要点をつかみ、面倒な作業を確実に減らしていきましょう。
人間とRPAでは、Webページの見え方がまったく異なります。人間はデザインや色、配置といった視覚的な要素をもとに、ページ全体を直感的に理解しています。しかしRPAは、画面の裏側にあるHTMLというコードの「設計図」を読み取り、ページを認識しているのです。
HTMLとは、Webページの構造を形づくるための言語です。「タグ」と呼ばれる目印を使い、文章の見出しや段落、リンクなどの役割を定義しています。タグは部品のラベルのようなもので、ページ全体の位置関係や階層を示す重要な情報を表します。
RPAへの指示は、曖昧では動作しません。人間同士なら「あの赤いボタンを押して」で伝わりますが、RPAには色や雰囲気という概念が通用しません。ロボットに正確に動いてもらうには、操作対象の「住所」を明確に伝える必要があります。
この住所にあたるのが、HTMLのタグや属性です。特にidやclassといった情報は、ページ上の要素を一意に特定するための手がかりになります。RPAはこれらの情報を使い、「どの入力欄に」「どの値を」入力するのかを正確に判断します。
【例】「Automation」という名前（id）が付いた入力欄（inputタグ）に、このテキストを入力する
⇒ HTMLでは、 <input id=”Automation” ～></input> のように表記します。住所を示すid属性を使い、要素を明確に区別するのです。
この章では、Coopelで特に利用頻度の高いHTMLの基本要素を5つ紹介します。ここで扱うタグを理解すれば、日常的なWeb上の定型作業の多くを自動化できるようになります。自動化の基礎になる部分なので、ぜひ押さえておきましょう。
<a>タグは、別ページへのリンクを設定するためのタグです。画面上で表示されるリンク文字やボタンの裏側には、ほぼ必ずこのタグが使われています。RPAでリンク操作を行う際は、このタグを手がかりに対象を特定します。
【Coopelでの具体的な活用シーン】
<table>、<tr>、<td>タグは、Webページ上で表を作るための基本セットです。<table>は表全体を示し、<tr>が行、<td>がセルを表す仕組みになっています。ページに表がある場合、この三つのタグが必ず登場します。
【Coopelでの具体的な活用シーン】
Coopelでは「表を取得」アクションで、これらのタグをもとに表の情報を読み取ります。
<h1>～<h6>タグは見出しを示し、<p>タグは段落を示す文章構造の基本タグです。ページ上の文章がどのような階層で整理されているかを把握できるため、Coopelで文章を取得するときの重要な目印になります。
【Coopelでの具体的な活用シーン】
<input>、<select>タグは、ユーザーが情報を入力したり選んだりするための部品を作るタグです。テキスト欄、チェックボックス、ラジオボタン、プルダウンなど、画面上の入力部品はほぼこのタグで構成されています。
【Coopelでの具体的な活用シーン】
HTMLでは、タグをより詳しく指定するために「属性」という仕組みを使います。ここではCoopelで最も重要なid属性とclass属性を紹介します。
id属性は、ページ内で重複しない唯一の名前を付ける属性です。特定の要素を確実に区別できるため、マイナンバーのような固有識別子と考えるとわかりやすいでしょう。RPAで要素を指定する際、最も信頼性の高い判断材料になります。
class属性は、複数の要素に同じ名前を付けられる属性です。苗字のような役割を持ち、「このクラス名の要素をまとめて扱う」といった操作に適しています。共通の見た目や機能を持つ要素を扱う際によく利用されます。
Coopelでは、要素を特定するために「CSSセレクター」を利用しています。HTMLの構造を部分的に指定する仕組み。「このボタンだけをクリックする」「このプルダウンを選択する」「このリンクをダウンロード対象にする」といった操作対象の要素を正確に指定できます。
参照：Coopel Help Center – 初めての方へ – CSS、CSSセレクター
ここからは、実際に手を動かしながら、HTMLの知識がどのように自動化に役立つのかを体験していきます。
Coopelが用意しているトレーニング用Webサイトを使い、商品リストの情報を取得してExcelに書き出すシナリオを作成してみましょう。
まずは、Coopelを使うための環境を整えます。
1. Coopelの30日間無料トライアルに申し込む
公式サイト（https://coopel.ai/）にアクセスし、新規アカウント作成へ進みます。案内に沿って必要情報を入力すれば、すぐに利用を開始できます。
2. チュートリアル用サイトにアクセスする
今回の自動化で使用するのは、Coopelの学習用に用意された以下のページです。
トレーニング用Webサイト：https://training.coopel.ai/
次に、どの情報を取得するかを明確にするため、ページのHTML構造を確認します。
Google Chromeでは、以下の操作でHTMLを確認できます。
1.取得したい部分（商品名・価格など）を右クリック
2.「検証」 を選択
3.画面右側に「デベロッパーツール」が開き、該当箇所のHTMLがハイライトされる
ここで、商品名や価格がどのタグ（例：<td>）に囲まれているかをチェックし、後のステップで使うために把握しておきます。
自動化したいページ内にある商品情報を1つずつ処理するため、「ループ（繰り返し）」アクションを設定しましょう。
続いて、Coopel側でシナリオを作成します。
1.Coopelの管理画面から「新しいシナリオ作成」を開く
2.ページ内の複数の商品情報を一つずつ処理するため、「ループ（繰り返し）」アクションを追加する
これにより、ページ内に並んでいる商品を1つずつ処理できる仕組みが作れます。
ループの中では、実際に欲しい情報を取得する設定を行います。
1.「画面から情報を取得」アクションをループ内に追加
2.Step 2で確認したHTMLタグの情報をもとに、商品名や価格の要素を正確に指定
また、CoopelではHTMLを要素指定に変換する際に便利な「コンバータ」機能が用意されています。タグ名やid、class属性がわかれば簡単に要素指定が作れるため、自動化の精度がぐっと上がります。
・コンバータ：https://training.coopel.ai/convert.html
最後は、取得した情報をExcelに書き出します。
1.Excel連携アクションを追加
2.商品名・価格など、先ほど取得した値をExcelの各セルへ入力する設定を行う
3.シナリオを実行し、Excelファイルが自動で作成されることを確認
完成したシナリオを実行し、自動でExcelファイルが作成されることを確認しましょう。
この記事では、Coopelでの自動化に役立つHTMLタグの基本を解説しました。
RPAはWebページを「見た目」ではなく「HTMLの設計図」で認識しています。業務自動化のためには、<a>、<table>、<input>などの基本的なタグと、id、classといった属性を理解するのが非常に有効です。
実際に手を動かしてシナリオを作ってみれば、非エンジニアの方でもWeb作業を簡単に自動化できることが実感できるはずです。HTMLの基本を押さえることは、面倒なルーティン作業から解放され、本来の業務にもっと時間を使うための強力な武器になります。
この記事を読んで知識が身に付いたら、ぜひ実際の業務で自動化をお試しください。
