배경음악 넣기 <embed> & <bgsound>

-- 배경음악 넣기

먼저 페이지에 배경음악을 넣을 수 있는 방법을 소개하기 전에, 너무 이 기능이 남용되지 않았으면 하는 바램입니다. 사용자가 페이지를 액세스 할 때마다 다양한 배경이 음악이 너무 자주 등장하면, 사용자에게 오히려 불편을 줄 수도 있기 때문입니다. 스피커 볼륨을 높이해놓고, 모르고 페이지에 들어갔다가, 예상치못했던 음악소리 때문에 깜짝 놀랄 수도 있고, 배경음악 파일을 로딩하면서 페이지 오픈 속도가 떨어지기 때문에, 꼭 필요한 경우에만 사용해주시길 바랍니다.

먼저 음악파일을 첨부합니다. (다른 사이트의 음악을 링크할 수도 있습니다. 그러나 다른 사이트의 링크가 변경되면, 음악은 당연히 들리지 않습니다.) 첨부할 파일은 사이즈 제한이 있으나 아주 크지 않으면 가능합니다.(대략 10MB 이하)

그리고 페이지를 작성하기 전에, 글쓰기창 아래에 있는 "입력포맷"을 클릭하여, "Full HTML" 모드로 페이지 작성 모드를 변환시켜주어야 합니다. 그런 뒤 아래의 코드를 참조하시어, 첨부한 파일을 정확히 filename.mp3 대신 써 주십시요. 파일은 여러가지 포맷이 가능하나, 본당웹 첨부파일은 mp3, mid 두가지의 음악파일 만을 허용하고 있음을 주지하여 주십시요.

<embed src="/files/filename.mp3" hidden=true autostart=true loop=true>
<noembed>
<bgsound src="/files/filename.mp3" loop=infinite>
</noembed>
//filename.mp3 가 첨부한 파일입니다.

위 코드는 제가 만든 십자가의 길 페이지에 넣은 배경음악과 같은 방식의 코드입니다. 우선 왜 embed 와 bgsound 코드를 동시에 넣었는지 먼저 설명해드립니다.

웹을 보는 프로그램을 흔히 웹브라우져라 합니다. 다수 사용자가 마이크로 소프트 윈도우즈 컴퓨터에 기본으로 설치된 윈도우 인터넷 탐색기(Internet Explore)를 사용하고 있습니다.

그러나 실제로는 그외에도 여러 종류의 웹브라우져들이 있습니다. 애플은 사파리란 브라우져를 이용하고, 요즘 널리 이용되는 파이어폭스 등등 다양한 브라우져가 있습니다.

어떤 브라우져는 HTML표준을 따르지 않고, 특정 브라우져에만 되는 HTML 코드를 가능하게 합니다. 그 대표적인 예가 bgsound 입니다.

bgsound 태그는 윈도우 웹브라우져인 IE에서만 작동됩니다. 그러므로 bgsound를 이용해 음악을 넣으면, 윈도우 IE 를 쓰는 사람만이 소리를 듣게 됩니다. 그래서 embed 란 태그를 따로 넣어 여기서도 되고, 저기서도 되고, 하게끔 만든 것입니다.

위 사항은 앞으로 브라우져가 HTML을 해석하는 방법을 달리하게 되면 바뀔 수 있습니다.

embed 코드는 브라우져 환경에서 실행되는 각종 음악, 예로 mp3, mid 등등의 음악을 src=" " 안에 정확한 파일의 웹주소를 넣어주면 됩니다. 저희 본당웹서는 첨부파일을 한 후, files/filename.mp3 식으로 되므로 쉽게 이해하실 수 있겠지요? src는 source의 줄임말입니다.

그리고 뒤에 여러가지 다양한 옵션을 줄 수 있는데.. 위의 예제로 간단히 설명하면,,

hidden=true // 음악 플레이가 되는 콘트롤(Play, Stop 등)을 감추란 뜻입니다.
autostart=true // 말 그대로 자동으로 페이지가 열리면서 시작하란 뜻입니다.
loop=true // 음악이 끝나면 반복하란 뜻입니다.

이외에도 여러가지 옵션이 있습니다만, 요정도만 이해하시면, 쉽게 배경음악을 넣을 수 있습니다. 위 코드에서 true 대신 false 를 넣으면 그렇게 하지말라는 뜻입니다. 반댓말이죠.

동영상의 경우는 더 복잡합니다. 그리고 동영상의 경우는 첨부파일 크기가 4MB로 제한되어 있어 이곳에서 직접 첨부파일로 올릴 수 없습니다. 결국은 다른 사이트의 내용을 퍼오는 것인데, 그럴 경우 다른 사이트에서 공식적으로 제공하는 embed 코드 전체를 가져다 그대로 복제하면 됩니다. 코드를 편집하다보면, 오히려 뜻대로 안되는 경우가 많으므로, 완벽한 코드를 가져오시면 됩니다.

그리고 다시 한번 강조드리면, 이런 다양한 HTML 코드를 사용하기 위해서는 반드시, 글쓰기 밑 "입력포맷"에서 "Full HTML"을 선택하시고 저장하셔야 한다는 뜻입니다. 그러다 보면 엔터키로 나눠진 문단끝에도
코드를 삽입하여 일일히 문단의 끝에 표시해주어야 합니다.

댓글

서로의 차이점은?

위에서 언급한
noembed,
/noembed와
/embed의 차이점이 무엇인지요?

아니면
실수로?

웹을 보는 프로그램에 따라..

브라우져(웹을 보는 프로그램)의 종류와 버젼에 따라 약간 달라질 수 있어 noembed를 사용할 것을 권장한 것입니다.

원래 W3(HTML 표준을 연구하는 기구)가 표준으로 제안한 embed 는 오래전 브라우져인 Netscape에서는 지원이 되었으나 초기 Microsoft의 Internet Explore에서는 지원이 안되었습니다. 대신 Microsoft에서는 bgsound를 지원하였습니다.

그래서, 위의 예제의 뜻은 아래와 같습니다.

<embed src="/files/filename.mp3" hidden=true autostart=true loop=true>
<noembed>
<bgsound src="/files/filename.mp3" loop=infinite>
</noembed>

embed 란 태그를 브라우져에서 지원하면 embed를 쓰고, embed가 안먹히는 브라우져에서는 noembed 사이에 있는 태그를 사용하란 뜻입니다.

그런데, Internet Explorer가 업데이트되면서 둘다 지원이 되는데, 둘다 플레이를 하는 것 같습니다. 그러다 보니 두가지 음악이 겹쳐져 나오는 것을 제가 경험했는데요. 이때는 그냥 embed 만을 해주면 됩니다.

그외에도 embed와 bgsound의 차이점이 있는 것 같은데요. embed 는 음악파일이 길 경우, 다운받으면서 동시에 바로 음악을 플레이한다고 하고, bgsound 는 음악이 실제 컴퓨터로 다운로드되고나서야 플레이를 한다고 합니다.

그래서 bgsound 보다는 W3가 표준으로 권고하는 embed를 쓰는 것이 더 좋다고 봅니다. 그리고 Internet Explore에서는 둘다 지원이 되므로, 앞으로는

<embed src="/files/filename.mp3" hidden=true autostart=true loop=true>

만으로 써도 될 듯합니다.