No.4ベストアンサー
- 回答日時:
#3です。
#3自体が長いので書いているうちに重要なことを書き忘れていました。
#3も読み上げに関係する部分は上半分です。
下半分(~別の話~)は無視してください。
重要なことを書き忘れですが,
私が1年近く前に次にようなことを回答しています↓。
「HTMリンクから、別フレームFLASHの
各コンテンツを動かす方法」
http://oshiete1.goo.ne.jp/kotaeru.php3?q=1468579
↑教えて!goo ↓OKWave (同じです)
http://okwave.jp/kotaeru.php3?q=1468579
~質問を要約すると~
ページ読み上げソフトを使われる方が
リンク先に飛べるように
右HTMフレームにもテキストでFLASHと同じリンクを
作成したけども,
右HTMフレームのリンクをクリックしたときに,
左のフレームのFLASHをそれと連動させたい。
というような内容です。
HTMLとFlashに同じリンクを見えるように作っておくのも手ですね。
見かけは悪くなる気もしますが。
-------------------------------------------
本題はそれではありません。
その質問の#1でも回答しています。
ご存じかもしれませんが,こういう↓サイトもあります。
アクセシビリティに配慮したFlashコンテンツ 富士通
http://jp.fujitsu.com/accessibility/casestudy/pd …
Macromedia Flash(TM) ムービーの読み上げについて
http://www-6.ibm.com/jp/accessibility/soft/jaws4 …
上の 富士通 のページの
http://jp.fujitsu.com/accessibility/casestudy/pd …
|メニューの読み上げ という項目にはわざわざ Flash のタイムラインまで用意して,
ボタンの作り方の説明まで書かれてあります。
また,この↓ページも参考になります。
http://www.macromedia.com/jp/macromedia/accessib …
Flash MX 2004 のことばかり書かれているように見えますが,Flash MX でも
アクセシビリティには対応しています。
詳しくは,ヘルプの
アクセシブルコンテンツの作成 > 高度なアクセシビリティオプションの指定
を見てみてください。一部分だけ引用すると,
ムービー内の選択したオブジェクトに対するアクセシビリティの定義
1 ステージでオブジェクトを選択します。
2 次のいずれかの操作をします。
インスペクタが表示されていない場合は、
[ウィンドウ]-[プロパティインスペクタ] を選択します。
プロパティインスペクタで、
[アクセシビリティ設定の編集] ボタンをクリックします。
[ウィンドウ]-[アクセシビリティ] を選択します。
3 [アクセシビリティ] パネルで、次のいずれかを実行します。
[オブジェクトをアクセス可能にする] (デフォルトの設定) を
選択して、オブジェクトをスクリーンリーダーに公開し、
パネル内のほかのオプションを有効化します。
~ ~ ~ ~ ~ ~ ~ ~
ここで言う「スクリーンリーダー」とは具体的にどのソフトかは
MX のヘルプからではわかりにくいですが,
Flashドキュメンテーション > スクリーンリーダー技術について
http://livedocs.macromedia.com/flash/8_jp/main/0 …
によると,
Freedom Scientific の 「JAWS」
http://www.freedomscientific.com/fs_products/sof …
GW Micro の 「Window-Eyes」
http://www.gwmicro.com/
は対応しているらしいです。
しかし,日本語の場合については書いてありません。
調べてみたところ,
「JAWS」には日本語版があり
PDF、Flash、JavaScriptへの対応 もされているそうです。
http://www.aao.ne.jp/column/2005/ishiki01.html
「PC-Talker」 というソフトも対応済のようです。
http://www.aok-net.com/dlpage/dltkpx.htm
また,
「Macromedia製品とアクセシビリティ」 には
http://www.keiyu.com/access/macro.htm
高知システム開発のPC-Talker、
日本アイ・ビー・エムのJAWS 4.5、
システムソリューションとちぎの95Reader Ver.5.0(XP Reader)が対応。
とあります。
つまり,言いたいことは,
Flash 内のアクセシビリティは Flash 自体でする方法も考えられます。
むしろその方がスマートで一般的なのかもしれません。
ということです。
ただし, 「JAWS」「PC-Talker」などが,実際に日本で読み上げにどれほど使われているのかは
その筋の専門ではないのでよくわかりません。
また,視力が弱い方と全盲の方では使われるソフトも変わるのかもしれません(変わらないのかもしれません)。
つまり,これまた定番ソフトのようなものがよくわからないので,自信なしです。
No.3
- 回答日時:
その,音声読み上げソフトの種類もわかりませんし,
わかったとしてもたいてい高額で,実験できないので答えにくいのですが……
http://allabout.co.jp/internet/hpcreate/closeup/ …
http://allabout.co.jp/internet/hpcreate/closeup/ …
↑ここにある方法で,とりあえず Flash の下に文字を置くことはできるでしょう?
そのサイトから引用すると,
--------------------------------
<div style="position: relative;">
<img src="dog.jpg" width="320" height="140" alt="犬看板"><br>
<div style="position: absolute; top: 15px; left: 150px; width: 150px;">
看板の内側に表示する文章です。
</div>
</div>
--------------------------------
この部分です。
この img タグの部分を Flash Player 6 用(Flash MX 用)の SWF ファイルを貼り付けるタグに書き替えると,
次のようになります。
「sample.swf」 を作成し,HTML と同じディレクトリに置いた場合です。
--------------------------------
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=shift_jis">
<title>CSS+Flash</title>
</head>
<body>
<div style="position: relative;">
<OBJECT classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"
codebase="http://download.macromedia.com/pub/shockwave/cab … WIDTH="320" HEIGHT="140" id="sample" ALIGN="">
<PARAM NAME=movie VALUE="sample.swf">
<PARAM NAME=quality VALUE=high> <PARAM NAME=bgcolor VALUE=#FFFFFF>
<EMBED src="sample.swf" quality=high bgcolor=#FFFFFF WIDTH="320" HEIGHT="140" NAME="sample" ALIGN="" TYPE="application/x-shockwave-flash" PLUGINSPAGE="http://www.macromedia.com/go/getflashplayer">
</EMBED>
</OBJECT>
<br>
<div style="position: absolute; top: 15px; left: 150px; width: 150px;">
看板の内側に表示する文章です。<br>
看板の内側に表示する文章です。
</div>
</div>
</body>
</html>
--------------------------------
「看板の内側に表示する文章です。」×2行 は見えないはずです。
Flash の下に CSS で文字を配置することは簡単にできます。
ただ,それが読み上げソフトに対応しているのかどうかはわかりません。
~~~ 別の話 ~~~ ~~~ ~~~ ~~~
しかし,逆にこれだと
Flash の下に文字がもぐるので困る人は多いようです。
教えて!サイトに
「Flash の上に文字を表示させる方法を教えてください。」
「Flash の上に画像を表示させる方法を教えてください。」
という質問がかなり来ます。
私は飽きもせず(かなり飽いたけど),
毎回同じような回答をしています。
Flash 自体は透明でも透明でなくてもいいので,
Flash を貼り付けるタグに背景透明を付け加えてください。
具体的には Object タグ内に
<PARAM NAME=wmode VALUE=transparent>
と,Embed タグ内に
wmode=transparent
を付け加えるのです。
というような回答です。
上記サンプルに,これを当てはめると
--------------------------------
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=shift_jis">
<title>CSS+Flash</title>
</head>
<body>
<div style="position: relative;">
<OBJECT classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"
codebase="http://download.macromedia.com/pub/shockwave/cab … WIDTH="320" HEIGHT="140" id="sample" ALIGN="">
<PARAM NAME=movie VALUE="sample.swf">
<PARAM NAME=quality VALUE=high>
<PARAM NAME=wmode VALUE=transparent>
<PARAM NAME=bgcolor VALUE=#FFFFFF>
<EMBED src="sample.swf" quality=high wmode=transparent bgcolor=#FFFFFF WIDTH="320" HEIGHT="140" NAME="sample" ALIGN="" TYPE="application/x-shockwave-flash" PLUGINSPAGE="http://www.macromedia.com/go/getflashplayer">
</EMBED>
</OBJECT>
<br>
<div style="position: absolute; top: 15px; left: 150px; width: 150px;">
看板の内側に表示する文章です。<br>
看板の内側に表示する文章です。
</div>
</div>
</body>
</html>
--------------------------------
こう↑なります。
これで, Flash の上に文字を置くことができます。
(逆に今回の読み上げの場合は困る事態になります。)
ブラウザによってはwmodeを受け付けないので,完全に文字を上に表示させることはできません。
Flashの上に何かを表示させることについては,
JavaScript や CSS で作ったプルダウンメニューが,Flashの上にダラーンと垂れ下がる場合に,
そのプルダウンメニューが Flash の下にもぐって見えなくなるので,
Flash の上に物を表示させる方法を質問される方が最も多いです。
次に多いのが,Flash作成ソフトを持っていなくて,
Flash の素材やさんからダウンロードしたのは良いけど,
自分なりにそれをHTMLでカスタマイズしたいときに質問される方が多いです。
どっちにしても答えは同じ。
「背景透明」のタグを入れる。
ただし全てのブラウザでは対応していない。
という回答になります。
Flash では,パブリッシュの設定で,「HTML」タブを選択して,
ウィンドウモード(O) を [透明表示] にしてパブリッシュすれば,自動的に上のようなHTMLがパブリッシュされます。
~~~以上,半分別の話でした。 ~~~ ~~~
丁寧かつ詳細なご回答、ありがとうございます♪
そうですね。音声プラウザにもよるんですよね。忘れてました。ちょっとじっくり読ませていただきます。
No.1
- 回答日時:
Flash を HTML 文書に埋め込むには object 要素を使いますよね?
object 要素の中身に代替コンテンツを入れておけばいいかと思います。
参考URL:http://bakera.jp/hatomaru.aspx/ref/html/element/ …
ありがとうございます。
ただ、リンク先のボタンが複数あり、上から順に並んでいるため、出来れば代替コンテンツも上から順に表示したいのです。
やはり、テキストの上にCSS指定で画像をかぶせるとかみたいのは出来ないんでしょうか?
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
関連するカテゴリからQ&Aを探す
おすすめ情報
- ・漫画をレンタルでお得に読める!
- ・14歳の自分に衝撃の事実を告げてください
- ・架空の映画のネタバレレビュー
- ・「お昼の放送」の思い出
- ・昨日見た夢を教えて下さい
- ・ちょっと先の未来クイズ第4問
- ・【大喜利】【投稿~10/21(月)】買ったばかりの自転車を分解してひと言
- ・メモのコツを教えてください!
- ・CDの保有枚数を教えてください
- ・ホテルを選ぶとき、これだけは譲れない条件TOP3は?
- ・家・車以外で、人生で一番奮発した買い物
- ・人生最悪の忘れ物
- ・【コナン30周年】嘘でしょ!?と思った○○周年を教えて【ハルヒ20周年】
- ・ハマっている「お菓子」を教えて!
- ・最近、いつ泣きましたか?
- ・夏が終わったと感じる瞬間って、どんな時?
- ・10秒目をつむったら…
- ・人生のプチ美学を教えてください!!
- ・あなたの習慣について教えてください!!
- ・牛、豚、鶏、どれか一つ食べられなくなるとしたら?
- ・都道府県穴埋めゲーム
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
CSS <div>の入れ子が反映さ...
-
【CSS】floatで左右に並べた...
-
Ctrl+F(検索)の窓を出したいの...
-
スタイルシート(CSS)で、高さ...
-
Flickity で画像にリンクを貼る...
-
CSS のみのタブ切り替えについて
-
MAX関数を使ってからLEFT JOIN...
-
自働生成される<div>タグに連番...
-
textareaに画像を表示したい
-
条件分岐でキーが入力されてい...
-
iframe内のリンクが飛ばないの...
-
JavaScriptで変更した属性の元...
-
c++std::string型をTCHARに変換...
-
ラズパイでno module named zbar
-
jquery ドロップダウンメニュー...
-
スワップイメージが上手く動作...
-
removeEventListenerについて
-
CSSで指定したwidthをマウスで...
-
横並びの画像を3枚時間差でフェ...
-
JSPでの画像ファイル表示
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
フッター上部に謎の隙間
-
CSS <div>の入れ子が反映さ...
-
【CSS】floatで左右に並べた...
-
スクロール可能なチェックボックス
-
文字を固定したいのですが…
-
大分類・中分類・小分類
-
html スクロール要素を下から表...
-
サイトにコンテンツを並べる際...
-
スタイルシート(CSS)で、高さ...
-
文字をクリックしたら別の文字...
-
チェックボックスの背景色って...
-
webデザイン, コーディング
-
レイアウトが崩れないようにす...
-
リンクで違うページの指定箇所...
-
textareaで入力した文字を改行...
-
ラジオボタンで段階評価
-
ヘッダとフッタが固定でコンテ...
-
画像のスムーズなフェードイン方法
-
ページへのアクセス後に背景色...
-
フッターの下に隙間ができてしまう
おすすめ情報