홈페이지에 깔끔한 뮤직플레이어를 달아보세요

반응형

  HTML 태그에 관심갖고 공부하기 시작하던 시절~ 홈페이지를 만들면 무조건 BGM을 깔아두던 시절이 있었죠. 자기가 좋아하는 음악으로 선곡을 해서 playlist를 만들고 embed 태그를 써서 재생을 시키고~ 또 이메일에도 음악을 넣어서 멋지게 편지도 보냈었구요.

그러던게 엊그제 같은데 벌써 10년이 넘게 흘렀네요. 

  홈페이지 만들기에 한창 맛을 들이던중 홈페이지를 만드는 사람이 가져야할 마인드!? 요러한 주제의 글을 읽었던 적이 있었습니다. 그 내용을 요약하자면


홈페이지의 크기를 사람들이 많이 사용하는 모니터 해상도인 800 X 600 맞추어주자

음악, 용량이 큰 사진 등은 되도록 자제하고 사진을 넣더라고  thumbnail을 만들어 과도한 로딩이 되지 않도록 하자


  뭐 요약하자면 이런 취지 였었죠. 홈페이지를 만들면서 테스트를 해보면 페이지 로딩이 느리고 음악이 자꾸 끊기고 사진도 엑박으로 뜰때도 많고 하다보니 윗글을 읽었을 때 '아!~ 그래 이게 맞는거구나. 다들 좋은 컴퓨터를 쓰는게 아니니깐 최저사양에 맞춰주고 음악은 시끄러우니깐 넣으면 안되는 거구나' 라는 생각을 가진채 벌써 10년이 넘게 지난거죠

  이젠 음악을 넣어도 고화질 사진을 넣어도 순식간에 로딩이 되는 그런 시대에 살고 있습니다. 그러다 보니 그간 음악을 넣지 않고 만들었던 홈페이지나 블로그 등이 너무 불필요하게 딱딱했었구나라는 생각이 듭니다. 그래서 블로그에 Music player를 달기로 하였습니다. 물론 음악을 원치 않으시면 상단 플레이어의 정지 버튼을 누르시면 됩니다.

홈페이지 : http://scmplayer.net/



위 그림처럼 다양한 스킨의 플레이어를 설치할 수 있으며 playlist와 옵션을 설정하면 아래와 같은 코드가 나옵니다. 블로그에 따로 설치할 필요도 없고 스킨이나 사이드바에 쏘옥 넣어주시기만 하면 됩니다.


<!--SCM Music Player by Adrian C Shum - http://scmplayer.net-->

<script type="text/javascript" src="http://scmplayer.net/script.js" ></script>

<script type="text/javascript">

SCMMusicPlayer.init("{'skin':'skins/tunes/skin.css','playback':{'autostart':'true','shuffle':'false','volume':'30'},'playlist':[{title:제목, url:음악주소}],'placement':'top','showplaylist':'false'}");

</script>

<!--End of SCM Music Player script-->


참고로 "음악주소" 에는 youtube 동영상 주소를 넣어도 재생이 됩니다. 음악파일 따로 찾아서 업로드하고 주소 넣을 불필요함이 사라진 것이죠. youtube에서 뮤비를 검색해서 해당 주소를 넣어주면 됩니다.^^*



반응형