ニュース
モデル
製品
keyboard_arrow_down
ディープサーチ
最善の答えが見つかるまで、検索し、読み、推論してください。
読者
URL を読み取ったり検索したりすると、大規模なモデルのサポートが向上します。
ベクトルモデル
世界クラスのマルチモーダル、多言語埋め込み。
並べ替え者
検索の関連性を最大化する世界クラスのニューラルレトリーバー。
もっと
keyboard_arrow_down
分類子
画像とテキストのゼロショットおよび少数ショットの分類。
スライサー
長いテキストをチャンクまたはトークンに分割します。

APIドキュメント
AIプログラミングアシスタントIDEまたは大規模モデル用のコードを自動生成
open_in_new


会社
keyboard_arrow_down
私たちについて
営業担当者に問い合わせる
インターンプログラム
参加しませんか
open_in_new
ロゴをダウンロード
open_in_new
利用規約


ログイン
login
API とは何か?
実際の API:ノートブックでの SceneXplain
ノートブックの先へ:実際の API 使用
SceneXplain の API で画像のアクセシビリティを向上させる
技術記事
1月 23, 2024

アクセシビリティをより身近に:SceneXplain の API で Alt テキストを作成

SceneXplainは、視覚障害者のサポートと SEO 向上のためにイメージ alt テキストを簡単に生成できる、アクセシビリティのための味方です
A striking, holographic diamond-shaped object with a gradient of pink and purple floats centrally against a black background
Alex C-G
Alex C-G • 4 読む時間

アクセシビリティ(略して「a11y」)は、Web 開発と e コマースの重要な部分として急速に普及しています。以前は、alt テキストやカラーブラインド対応の配色などのアクセシビリティ支援は、開発者や企業にとって優先順位が低いものでした。しかし現在では、ヨーロッパやアメリカのアクセシビリティ法制化により、ウェブサイトのアクセシビリティ対応がこれまで以上に重要になっています。

💡
Alt テキスト(代替テキスト)は、ウェブサイトやデジタル文書で使用される画像の簡潔な説明文です。視覚に障害があってスクリーンリーダーを使用する人や、インターネット接続が遅くて画像が読み込めない人など、画像を見ることができない人々が内容を理解するのに役立ちます。また、検索エンジンが画像を理解しインデックス化する際にも有用です。

しかし、ウェブサイトの全ての画像に alt テキストを作成するにはどうすればよいでしょうか?数千枚(または数百万枚)の画像がある場合、手作業で各画像を確認して alt テキストを書くのは膨大な時間がかかります。さらに毎日新しい画像が追加されると、終わりのない作業になってしまいます。

そこで SceneXplain の出番です。アクセシビリティのための強い味方です!画像をアップロードするだけで、自分で言葉を考える必要なく alt テキストを取得できます。

数十枚程度の画像なら、これは頭を休ませる良い方法です。ただし、クリックやドラッグは自分でする必要があります。頭は楽になりますが、指は楽になりません。数千枚の画像がある場合は?今のうちに腱鞘炎の予約を入れておいた方がいいでしょう。

全てを自動化できる方法があればいいのに。そうすれば頭も指も、もっと面白いことに集中できるのに。

そこで SceneXplain の API の出番です。数千枚の画像を処理し、バッチで SceneXplain に送信して結果を CSV ファイルに出力するスクリプトを書くことができます(もう少しコーディングすれば、ワークフローに直接統合することもできます)。

ご存知の通り、幸せの中には API が含まれているのですから。

💡
よく考えてみると、日本語ではそのような言葉遊びは成立しませんね。

tagAPI とは何か?

実際の使い方を見る前に、まず API とは何かを見てみましょう。オックスフォード英語辞典では API を以下のように定義しています:

A white banner from Oxford English Dictionary with a welcoming message thanking visitors accompanied by instructions to sign in or purchase a subscription to continue reading. Central to the banner is a blue button prompting users to "View our subscription options."
これは全く役に立ちませんね

しかし、みんなが大好きな AI である GPT-4 は API を以下のように定義しています:

An API, or Application Programming Interface, is a set of rules and protocols for building and interacting with software applications. It defines the methods and data formats that applications can use to communicate with each other. APIs are used to enable the integration of different software systems, allowing them to exchange data and functionality efficiently. In other words, An API is like a waiter in a restaurant. Just as a waiter takes your order and brings you food from the kitchen, an API takes requests from one software and gets information or performs actions in another software. This helps different software programs talk to each other and work together.

動画での説明をご希望の場合:

簡単に言えば、Python(または他の言語)プログラムを書いて SceneXplain の API を通じて通信し、alt タグ付けのプロセス全体を自動化できます。それを実現する Python スニペットがあります。

💡
自分のコンピュータでコードを実行できない場合は、ブラウザで使用できる Google Colab ノートブックについて、この後で説明します。

使用方法は以下の通りです:

  1. requests ライブラリをインストールします:
pip install requests
  1. SceneXplain の API ページでシークレットキーを生成し、クリップボードにコピーします。
  2. 以下の Python コードにペーストします。
  3. ....と書かれている箇所に画像 URL をコピーします。
  4. コードを実行します!
import requests
import json

# generate token on SceneXplain's API page
YOUR_GENERATED_SECRET = "your_generated_secret_here"

data = {
  "data": [
    {
      "task_id": "alt_text",
      "languages": [
        "en"
      ],
      "image": "..." # change to image URL
    }
  ]
}

headers = {
  "x-api-key": f"token {YOUR_GENERATED_SECRET}",
  "content-type": "application/json",
}

response = requests.post("https://api.scenex.jina.ai/v1/describe", headers=headers, json=data)
print(response.json())

(後ほど cURL と JavaScript のコードスニペットも追加します)

tag実際の API:ノートブックでの SceneXplain

実際の動作を確認するために、ノートブックでコードをライブで使用してみましょう。実際のデータでリアルタイムに何が起こっているかを見ることができ、Python コードを自分で確認して試すこともできます。

Google Colaboratory

このノートブックは、上記の単純な Python スニペット以上のことを行います。サンプルデータセットをダウンロードし、結果を CSV ファイルにエクスポートすることもできます。

tagノートブックの先へ:実際の API 使用

もちろん、SceneXplain の API を使用する際は Python に限定されません。HTTP ライブラリを持つ言語であれば、どれでも問題なく動作するはずです。

上記のコードスニペットを JavaScript で書くと以下のようになります:

const body = {
  "data": [
    {
      "task_id": "alt_text",
      "languages": [
        "en"
      ],
      "image": "..."
    }
  ]
};

const YOUR_GENERATED_SECRET = 'your_generated_secret_here';

fetch('https://api.scenex.jina.ai/v1/describe', {
  headers: {
    'x-api-key': `token ${YOUR_GENERATED_SECRET}`,
    'content-type': 'application/json'
  },
  body: JSON.stringify(body),
  method: 'POST'
}).then(async (resp) => {
  if (resp.ok) {
    const data = await resp.json();
    console.log(data);
  }
});

そして、cURL コマンドとして書くと:

curl "https://api.scenex.jina.ai/v1/describe" \
  -H "x-api-key: token $YOUR_GENERATED_SECRET" \
  -H "content-type: application/json" \
  --data '{
  "data": [
    {
      "task_id": "alt_text",
      "languages": [
        "en"
      ],
      "image": "..."
    }
  ]
}'

tagSceneXplain の API で画像のアクセシビリティを向上させる

まずは SceneXplain の API ページにアクセスして仕組みを理解し、シークレットキーを生成してください。その後、提供されているノートブックを活用するか、独自のコードを作成してアクセシビリティの改善を始めましょう!

SceneXplain - 画像キャプションとビデオサマリーの先進的 AI ソリューション
最先端のコンピュータビジョンを体験してください。コンテンツクリエイター、メディアプロフェッショナル、SEO 専門家、E コマース企業向けに特化した画像キャプション生成とビデオ要約アルゴリズムを提供します。多言語対応と API シームレス統合を実現。今日からデジタルプレゼンスを向上させましょう。
SceneXplain
カテゴリー:
技術記事
rss_feed
オフィス
location_on
カリフォルニア州サニーベール
710 Lakeway Dr、Ste 200、サニーベール、CA 94085、アメリカ合衆国
location_on
ドイツ、ベルリン(本社)
Prinzessinnenstraße 19-20、10969 ベルリン、ドイツ
location_on
中国、北京
中国北京市海淀区西街48号ビル6号5階
location_on
深セン、中国
ルーム 402、4 階、福安テクノロジービル、深セン、中国
検索ベース
ディープサーチ
読者
ベクトルモデル
並べ替え者
分類子
スライサー
APIドキュメント
Jina APIキーを取得する
レート制限
APIステータス
会社
私たちについて
営業担当者に問い合わせる
ニュース
インターンプログラム
参加しませんか
open_in_new
ロゴをダウンロード
open_in_new
条項
安全性
利用規約
プライバシー
Cookieを管理する
email
Jina AI © 2020-2025.