유튜브 영상을 반응형으로 쉽게 올리기!

요새 많은 블로그들와 사이트들이 반응형을 택하고 있습니다.

반응형웹사이트로 만든다면 굳이 모바일용 사이트를 따로 만들필요도 없고

PC화면에서도 느낄 수 있는 비슷한 경험을 모바일폰을 통해서도 똑같이 느낄 수 있기 때문이죠.

반응형 사이트들이 많이 늘어나고 있는 추세이지만,

어떤 사이트들에서는 유튜브, 비메오, 인스타그램과 같은 외부 컨텐츠들이 반응형 사이트에 맞게 변형되어서 나오지 않아 컨텐츠들의 화면이

짤려 나오게 되는 현상이 나타나기도 합니다.

이런 현상을 방지하기 위해서는 그 컨텐츠를 따로 변형되어질수 있게끔 해줘야 합니다.

하지만, 코드를 잘 모른다면 이런 것을 하기가 힘듭니다.

여기에 유튜브 영상와 기타 여러가지등을 쉽게 반응형으로 바꿔주는 사이트가 있으니!

http://embedresponsively.com

이 사이트를 이용한다면  youtube, vimeo, daily motion, google maps, instagram, vine, getty images, 등 기타 iframe을 반응형으로 쉽게 올릴 수 있습니다.

이런식이나

이런식으로 말이죠

코난 오브라이언 재미있는 몇가지 에피소드 영상 이것도 위의 방법으로 유튜브 영상을 넣은 것입니다.

좋은 소식은 scribd? soundcloud twiiter storify 등은 이미 자체에서 반응형서비스를 제공한다고 합니다.

사용방법은

이와 같이 항목을 체크하고 유튜브를 반응형으로 만들거라면 그 해당하는 영상의 주소를 넣어서 Embed를 누릅니다.

그러면 아래쪽에 코드가 나오는데 이것을 복사해서 자신이 올릴 게시물에 html코드로 넣으면 됩니다.

정말 쉽죠?