webサイトの中でmp3音楽を再生する簡単な方法

webサイトの中でmp3音楽を再生する簡単な方法

dreamweaver CS5.5で確認した方法です。

1. mp3ファイルをサイト内に置きます。
2. htmlに以下を書くだけで(*^-^)v オッケェ〜イ♪

<audio src=”xxx.mp3″ controls=”controls” </audio>

xxx.mp3は、MP3ファイルのURLです。

FireFox 47
Safari 6.2.8
MacOS 10.8.5
で確認済み。

いやあ、意外と簡単だった

【関連URL】

モフモフPのソフトウェア情報

http://mackenmov.sunnyday.jp/macken/mac/software/2018soft/1803soft.html

おまけ

一般的な音声ファイル形式と特徴

.midi または .mid(Musical Instrument Digital Interface)

器楽曲のためのファイル形式です。MIDI ファイルは多くのブラウザーにサポートされており、プラグインを必要としません。MIDI ファイルの音質は非常に優れていますが、ビジターのサウンドカードに左右される可能性があります。小さな MIDI ファイルで長いサウンドクリップを再生できます。MIDI ファイルは録音できません。また、コンピューター上で特別なハードウェアおよびソフトウェアと合成する必要があります。

.wav(Waveform Extension)

この形式のファイルは、音質が高く、多くのブラウザーでサポートされており、プラグインを必要としません。CD、テープ、マイクなど、独自の WAV ファイルを記録できます。ただし、ファイルサイズが大きいので、Web ページ上で使用できるサウンドクリップの長さが厳密に制限されます。

.aif(Audio Interchange File Format、つまり AIFF)

WAV 形式と同様に音質が高く、ほとんどのブラウザーで再生可能であり、プラグインは必要ではありません。また、AIFF ファイルを CD、テープ、マイクなどから録音することができます。ただし、ファイルサイズが大きいので、Web ページ上で使用できるサウンドクリップの長さが厳密に制限されます。

.mp3(Motion Picture Experts Group Audio Layer3、MPEG-Audio Layer-3)

圧縮形式の 1 つで、この形式ではサウンドファイルがかなり小さくなりますが、 高い音質を実現できます。MP3 ファイルを適切に録音して圧縮すれば、その音質は CD の音質に匹敵します。MP3 テクノロジによってファイルを “ストリーム” できるので、ビジターはファイル全体がダウンロードされるのを待たなくても音を聴くことができます。ただし、ファイルサイズが Real Audio ファイルより大きいので、通常のダイアルアップ(電話回線)によるモデム接続で 1 曲全部をダウンロードすると、長い時間かかる場合があります。MP3 ファイルを再生するには、ビジターは QuickTime、Windows Media Player、RealPlayer などのアプリケーションまたはプラグインをダウンロードしてインストールする必要があります。

.ra、.ram、.rpm、などの Real Audio

圧縮率が高く、ファイルサイズが MP3 形式よりも小さくなります。曲のファイル全体を時間がかかりすぎることなくダウンロードできます。通常の Web サーバーからファイルを “ストリーム” できるので、ビジターはファイルが完全にダウンロードされる前に音を聴き始めることができます。Real Audio 形式のファイルを再生するためには、ビジターは、RealPlayer 用のアプリケーションまたはプラグインのダウンロードとインストールが必要です。

.qt、.qtm、.mov、または QuickTime

Apple Computer が開発した形式で、音声およびビデオの両方をサポートしています。QuickTime は、Apple Mac OS のオペレーティング システムに組み込まれており、音声、ビデオまたはアニメーションを使用するほとんどの Mac OS アプリケーションに使用されます。Windows を搭載したコンピューターでも QuickTime 形式のファイルを再生できますが、専用の QuickTime ドライバーが必要です。QuickTime は、Cinepak、JPEG、MPEG など、ほとんどのエンコード形式をサポートします。

https://helpx.adobe.com/jp/dreamweaver/using/adding-sound.html

%d人のブロガーが「いいね」をつけました。