모바일
개인이의 경우 유튜브를 활용한 포스팅을 한번씩 하게 되는데, PC버전에서 영상을 볼 때와 모바일에서 영상을 볼 때의 불편함이 있었습니다. PC버전에서는 깔끔하게 잘 나오던 영상이 모바일에서 시청을 하게 되면 화면 크기가 맞지 않아 짤리는 경우가 생겼습니다.
아래 이미지는 모바일에서 확인한 유튜브 영상인데, 보시는 바와 같이 화면이 짤린 현상을 볼 수 있습니다. 개인이의 경우 주로 음악을 듣는 위주로 사용을 하다보니 화면은 크게 중요하지는 않았지만, 어디까지나 개인적인 생각이고, 모바일 유입자를 배려한다면 이 부분을 수정할 필요가 있다라고 생각했습니다.
티스토리 모바일에서 보여지는 유튜브 영상을 최적화 하기 위해서는 약간의 소스 수정이 필요합니다. 약간이라고 했지만 정말 간단한 방법이라서 딱히 포스팅 할 내용은 없네요.
먼저 수정하고자 하는 포스팅에서 해당되는 유튜브 영상 소스를 찾습니다. 개인이의 경우 아래 부분이 유튜브 소스인데, 보통 width 값이 px로 설정되어 있습니다.
560으로 나와 있는데, 이 수치가 PC에서는 문제가 되지 않지만 모바일에서 볼 때는 앞서 본 것과 같이 영상이 짤리는 현상이 생기게 됩니다. 그렇기에 이 수치를 수정할 필요가 있습니다.
앞서 width 값이 px로 되어 있는 부분을 %로 변경합니다. 원본 크기와 상관없이 width 값을 100%로 수정해 주시면 끝입니다.
width 값을 100%로 수정한 후 PC버전에서 보여지는 영상입니다.
width 값을 100%으로 수정한 후 모바일에서 보여지는 영상 화면인데, 스마트폰 화면에 맞게 영상이 출력되고 있는 것을 보실 수가 있습니다. 혹시나 가로 버전으로 볼 때는 어떻게 되는지 궁금해 하실 수도 있는데, 가로 화면 비율에 맞게 출력이 됩니다.
유튜브 영상과 같은 포스팅을 주로 하신다면 모바일 유입자를 배려한 소스 수정 한번 해보시기를 바랍니다. 종종 다른 블로그의 글을 볼 때에 영상의 크기가 화면 밖으로 나가 버린 경우를 자주 보는데, 유튜브 활용이 많다면 도움이 되리라 봅니다.
이 글이 도움이 되셨다면 아래 공감 버튼을 눌러주세요. ^^
감사합니다.
'블로그 관련' 카테고리의 다른 글
| 구글 위젯으로 블로그를 소개해보자. (20) | 2015.01.17 |
|---|---|
| 블로그에 페이스북 좋아요 박스 위젯을 설치해보자. (8) | 2015.01.17 |
| 카테고리의 다른 글 영역을 없애면 어떨까? (2) | 2015.01.16 |
| 포스팅에 관련글을 넣는다면 이렇게 해보세요. (6) | 2015.01.15 |
| 포스팅을 삭제하실거면 이렇게 해주세요. (16) | 2015.01.13 |
| 블로그 개설과 폐쇄는 신중하게 결정해야 합니다. (6) | 2015.01.08 |
| 저작권 걱정 없는 이미지 구글에서 찾아보자. (10) | 2015.01.07 |
| 포스팅을 삭제하면 블로그에 안좋은 영향을 줄까? (2) | 2015.01.06 |
| 티스토리 시작하셨으면 태그 부터 꾸며 봅시다. (1) | 2014.12.28 |
| 이웃이 어떤 글에 댓글을 달았는지 얼마나 달았는지 한눈에 보려면? (1) | 2014.08.22 |
