SimpleWeb – レイアウトとコンテンツの変換

SimpleWeb によるテキスト変換の特徴

多くの場合、SimpleWeb(シンプルウェブ)で生成されたテキスト版のページは、オリジナル版のウェブページよりも、日本工業規格 JIS X8341-3:2004、米国リハビリテーション法第508条、W3C の WCAG1.0 ガイドラインのダブルAレベルなどに沿ったものになります。そしてこれを実現する過程で、ウェブページのレイアウトやコンテンツを変更する次のようなタスクを実行します。

  • 文字サイズとページ幅を可変にする
    CSS に基づいてページを生成し、文字サイズやページ幅を限定しないようにします。これにより、固定でないレイアウトとなるため、訪問者が使っているブラウザーのウィンドウに合わせられるようになります。
    [サンプル:変換前変換後(このページへはブラウザーの「戻る」機能でお戻りください)]
  • 自動リダイレクトを無効にする
    リダイレクトmeta 要素で指定された自動リダイレクトを無効にし、ユーザーが任意に選択できるリンクとしてリダイレクト先の URL をページ上部に提示します。
  • 近すぎるリンクを離す
    近すぎる配置のリンクがあると、自動的にスペースを3つ挿入します。これにより、リンクがはっきりと分かれて表示され、クリックしやすくなります。
    [サンプル:変換前変換後(このページへはブラウザーの「戻る」機能でお戻りください)]
  • JavaScript を無効にする
    JavaScript のプロトコルを含んだリンクは、アクセシブルでないため、取り除きます(WCAG の6.3条に準拠)。
  • スクリプトとスタイルシートを取り除く
    スクリプトとスタイルシートは、すべて取り除きます。スクリプトは、noscript 要素があれば、そのコンテンツで置き換えます。
    [サンプル:変換前変換後(このページへはブラウザーの「戻る」機能でお戻りください)]
  • フレームをまとめて表示する
    フレームとフレームセットは、全フレームの全コンテンツを同時に表示する(テキスト版の)ページに変換されます。これによりユーザーは、すべてのコンテンツを一度に見られるようになります(フレーム機能のあるグラフィックブラウザーを使っている状態と似た操作性になります)。しかもフレーム間のナビゲーションは、本来の機能を維持します。noframes 要素は一切使用しません。
    [サンプル:変換前変換後(このページへはブラウザーの「戻る」機能でお戻りください)]
  • レイアウトテーブルをリニアライズする
    すべてのレイアウトテーブルはリニアライズ(2次元配置によるレイアウトを解体して線形化)します。 SimpleWeb は、UsableNet が開発したウェブページ構成要素の意味解析エンジンであるセマンティックアナライザーを使用して、テーブルが表組状のデータを表示するために使われているのか、単にレイアウト目的で使われているのかを判断し、必要性のあるデータテーブルと判断された場合は、元のマークアップをそのまま残します。データ表示の場合は、表組としてのほうが読みやすいためです。
    [サンプル:変換前変換後(このページへはブラウザーの「戻る」機能でお戻りください)]
  • 画像を代替テキストに置き換える
    画像は、付随する代替テキストである alt 属性の値に置き換えます。その画像に alt 属性がなく、 title 属性のみがある場合は、title 属性の値で代用します。alt 属性も title 属性も指定されていない画像は取り除きます。ただし、ボタンとして使われている画像で alt 属性も title 属性もないものは、リンク先の URL に置き換えます。
    [サンプル:変換前変換後(このページへはブラウザーの「戻る」機能でお戻りください)]
  • クライアントサイド・イメージマップをリンクのリストにする
    クライアントサイドのイメージマップは、area 要素に含まれているリンクの単純なリストに置き換えます。その画像の alt 属性か title 属性が定義されていれば、ナビゲーションバーとして使用します。各 area 要素の alt 属性は、リンクのラベルとして使用します。alt 属性がない場合は、リンク先の URL が追加されます。
    [サンプル:変換前変換後(このページへはブラウザーの「戻る」機能でお戻りください)]
  • 画像化された送信ボタンをフォームボタンに置き換える
    フォーム内の画像化された「送信」ボタンは、フォームのコントロールを使ったボタンに置き換えます。ボタンのラベルは、元の画像に alt 属性があればその値から取得し、なければ「送信」を使用します。
    [サンプル:変換前変換後(このページへはブラウザーの「戻る」機能でお戻りください)]
  • 省略された送信ボタンを追加する
    JavaScript の機能による代用によって「送信」ボタンが省略されたフォームでは、「送信」ボタンを追加します。これにより、JavaScript がなくても、フォーム内のデータが送信できるようになります。
    [サンプル:変換前変換後(このページへはブラウザーの「戻る」機能でお戻りください)]
  • インラインフレームをリンクに置き換える
    インラインフレームは、参照している文書へのリンクに置き換えます。
    [サンプル:変換前変換後(このページへはブラウザーの「戻る」機能でお戻りください)]
  • keywords と description は変更しない
    meta keywords と meta description は変更しません。
  • object 要素を代替テキストに置き換える
    object 要素は、そのコンテンツを使ったテキストのみのものに置き換え、コンテンツがない場合は取り除きます。
    [サンプル:変換前変換後(このページへはブラウザーの「戻る」機能でお戻りください)]
  • アプレットを代替テキストに置き換える
    アプレットは、そのコンテンツを使ったテキストのみのものに置き換え、コンテンツがない場合は取り除きます。
  • フォームをリニアライズして、コントロールとラベルを適切に配置する
    正しいマークアップで作られているフォームのコントロールとラベルは、参照しているコントロールに配慮し、適切なラベル配置でリニアライズします。label 要素の内容は、参照しているフォームコントロールの前か後に配置します(そのコンテンツが、テキストフィールドか、ラジオボタンか、チェックボックスか、またはセレクトメニューかなどによって、前か後かが変わります)。label 要素が指定されていなくても title 属性が指定されていれば、title のコンテンツで代用し、やはりコントロールの前か後に配置します。
    [サンプル:変換前変換後)(このページへはブラウザーの「戻る」機能でお戻りください)]

セマンティックアナライザー

SimpleWeb には UsableNet の開発したウェブページ構成要素の意味解析エンジンである、セマンティックアナライザーと呼ばれるコンポーネントが含まれています。このコンポーネントの目的は、HTML の記述パターンからページ構成要素の役割を経験則的に解釈し、より自然なテキスト変換を実現することです。

セマンティックアナライザーは、ウェブページ内にある画像の役割(スペーサー、装飾、スライス、箇条書き行頭画像など)や、テーブルの役割(レイアウト用、データ表示用、ナビゲーション用)などを識別することができ、それぞれの役割に応じたテキスト変換、またはそのカスタマイズを実現します。

関連