오디오를 삽입하려는 위치에 커서를 둡니다.
이 문서를 통해 Dreamweaver 웹 페이지에서 HTML5 오디오를 삽입하고 브라우저에서 해당 오디오를 미리 확인하는 방법에 대해 살펴보십시오.
Dreamweaver로 웹 페이지에서 HTML5 오디오를 삽입하고 미리보기할 수 있습니다. HTML5 오디오 요소는 오디오 내용을 웹 페이지에 포함시키는 표준 방법을 제공합니다.
HTML5 오디오 요소에 대한 자세한 내용은 W3schools.com의 HTML5 오디오 문서를 참조하십시오.
HTML5 오디오 삽입
삽입 > HTML > HTML5 오디오를 선택합니다. 오디오 파일이 지정된 위치에 삽입됩니다.
Properties Inspector에서 다음 정보를 입력하십시오:
- 소스 / 대체 소스 1 / 대체 소스 2: 소스에 오디오 파일 위치를 입력합니다. 또는 폴더 아이콘을 클릭하여 컴퓨터에서 오디오 파일을 선택합니다. 오디오 포맷 지원은 브라우저마다 다릅니다. 소스의 오디오 포맷을 지원하지 않을 경우 대체 소스 1 또는 대체 소스 2에 지정된 포맷이 사용됩니다. 브라우저는 처음 인식된 포맷을 선택하여 오디오를 표시합니다.
비디오를 3개 필드에 신속하게 추가하려면 다중 선택을 사용하십시오. 한 폴더에 있는 동일한 비디오에 대해 3개의 비디오 형식을 선택할 때 목록의 첫 번째 형식을 소스에 대해 사용합니다. 목록의 다음 형식은 대체 소스 1과 대체 소스 2를 자동 채우기할 때 사용합니다.
|
브라우저 |
MP3 |
Wav |
Ogg |
|
Internet Explorer 9 |
예 |
아니요 |
아니요 |
|
Firefox 4.0 |
아니요 |
예 |
예 |
|
Google Chrome 6 |
예 |
예 |
예 |
|
Apple Safari 5 |
예 |
예 |
아니요 |
|
Opera 10.6 |
아니요 |
예 |
예 |
- 제목: 오디오 파일의 제목을 입력합니다.
- 대체 텍스트: HTML5를 지원하지 않는 브라우저에 표시될 텍스트를 입력합니다.
- 컨트롤: HTML 페이지의 재생, 일시 정지, 음소거와 같은 오디오 컨트롤을 표시하려는 경우 선택합니다.
- 자동 재생: 웹 페이지에 로드된 직후 오디오 재생을 시작하려면 선택합니다.
- 오디오 반복: 사용자가 재생을 정지할 때까지 오디오를 지속적으로 재생하려는 경우 이 옵션을 선택합니다.
- 음소거: 다운로드한 후 오디오를 음소거하려는 경우 이 옵션을 선택합니다.
- 미리 로드: 자동을 선택하면 페이지 다운로드에 전체 오디오 파일이 로드됩니다. 메타데이터를 선택하면 페이지 다운로드를 완료한 후 메타데이터만 다운로드합니다.
브라우저에서 오디오 미리보기
웹 페이지를 저장합니다.
파일 > 실시간 미리보기를 선택합니다. 오디오를 미리보기하려는 브라우저를 선택합니다.