ホームページの作り方

質問

ホームページビルダーでホームページを作っているのですが、語学の教材で、文をクリックするとその音声が出るものを作りたいのです。どのような作り方をしたらいいのでしょうか。録音した音声ファイルをリンクで挿入させるのでしょうか。容量がかなり大きくなってしまうので、なるべく容量が少ないものを作りたいのですか。またクリックしたときにプレーヤーの絵が出ないようにすることはできますか。

回答No.4

sksu003nh

まず，ファイルの大きさについてです．
　約１分で約１メガバイトということは，160kbps程度で録音されています．私が同じソフトで試したところ171kbpsでした．中途半端なので可変ビットレートかもしれません．
　このファイルの大きさは現在一般的なものです．これ以上小さくすると音質が悪くなりますし，利点はあまりありません．
　というのも，現在主流の高速回線では最低でも1Mbps（＝約1000kbps）ですから，１分程度の音声ファイルは一瞬で転送できます．問題になるのは携帯電話で利用した場合で，従量課金だとファイルの容量に応じて接続料金が高くなります．
　音質・ファイルの大きさに不満がなければこのソフトを利用してかまいませんが，不満があれば前回紹介した「超録」を使うことをおすすめします．

　次にリンクの方法ですが，ホームページビルダーは今のところHTML5に対応しておらず，audioタグも使えません．（バージョン17の時点）
　他のメーカーでは，Adobe社のDreamweaverというソフトがHTML5対応なのですが，月額2200円を払い続けないといけないので高価です．
　実は私の手元に古いホームページビルダー13がありまして，埋め込む方法がないか試してみました．
　その結果，「ビデオファイルの挿入」ダイアログで全てのファイルを表示し，mp3の音声ファイルを指定すると，何の支障もなくページに埋め込まれました．このとき「embed」というタグが使われました．このとき「ページ編集」画面では正方形の画像が表示され，「プレビュー」画面で実際の埋め込みの様子が確認できました．
　この方法で埋め込んだ場合，パソコンではブラウザ標準の埋め込みプレーヤーが使われ，iPod touchでは全画面表示のプレーヤーが表示されました．（Androidスマートフォンは持っていないので試していません）
　少し困ったことに，この埋め込み方法だとパソコンの場合，ページ表示と同時に再生が始まってしまいました．複数の音声を同じページに埋め込むには適していないようです．
　ホームページビルダーを使い続ける限り，ソフトの機能の範囲での作業になりますから，標準の「a」タグでのリンクで毎回プレーヤーが表示されるのを容認するか，「ビデオファイルの挿入」で埋め込んでパソコンだけでも埋め込みプレーヤーを使うかのどちらかになりそうです．

　余談ですが，ホームページビルダーの「HTMLソース」画面で編集ができれば，audioタグでの埋め込みも無理矢理ですができます．embedタグでの埋め込みも自動再生の設定ができる可能性があります．
　ホームページを作る過程で問題が出てきた場合，HTMLソースの編集ができると解決が早いことがほとんどです．
　時間があればHTMLソースの編集方法を勉強すると後で役に立つでしょう．
　私自身も，今ではメモ帳などでタグを直接入力してホームページを作っています．ホームページビルダーは付属の画像編集ソフトなどを使うだけです．そのためバージョン13から買い替えていないのです．

お礼

sksu003nh様
なんと親切な方に巡り会えたのだろうと、感謝しています。
さきほどホームページビルダー18の体験版で、html編集でaudioでやってみたら、無事できました!
私でも出来たので、感激しました。ただ、体験版なのでアップすることができず、スマートフォンでどうなるかは見ることができません。もしうまくいけば、しかたないから新しいバージョンを買おうと思ってジャストシステムに質問を出してみましたが、はたして回答が来るかどうか。
私の使っているのは、V12ですが、今、教えていただいた「ビデオファイルの挿入」からやってみましたら、これも無事成功!今のところ1ページに一つの音声しか埋め込む予定はないので、ページが表示されてすぐ音声がスタートするのは構わないと思います。埋め込みプレーヤーで停止できたり、コントロールできれば。問題は、スマートフォンでプレーヤーが前面表示されてしまうことです。文字を見ながら聞いてもらいたいので。これは、audioタグにしてみても、同じようなってしまうような気が…。それならば、毎回プレーヤーが表示されるのと、たいして変わらないので、またまた困ってしまいます。
録音は、今度「超録」も試してみます。なるべく容量を少なくしたい理由は、今使っているサーバーの容量の割り当てが、そんなに多くないことです。
でも、少しずつ勉強になっています。今回、html4とか、5などがあることも初めて知りましたし。