Cara Memasang Video Responsiave dan Valid HTML5

Cara Memasang Video Responsiave dan Valid HTML5 - Untuk merubah tampilan video Youtube yang responsive dan pas terlihat di semua layar computer juga ponsel, selain responsive, hasil embed video youtube tersebut tentunya menjadi valid HTML5, serta juga seo friendly. Seiring dengan makin berkembangnya era responsive di dunia internet, maka satu hal yang perlu kita lakukan untuk mengikuti perkembangan zaman, ya itu dengan menyajikan tampilan video yang sedap di pandang mata pada blog kita.

Sebenarnya banyak ngejibun bila kita mau cari di rumah eyang google Cara Embed Video Youtube Responsive dan Valid HTML5 namun dari beberapa tips dan trick yang saya dapat, ternyata cara ini paling sering Saya gunakan di beberapa posting di blog saya. Walau dengan trick sederhan tetapi hasilnya sangat memuaskan, selain itu juga blog atau postingan akan terlihat semakin cantik.

Lanjut Cara Embed Video Youtube Responsive dan Valid HTML5, yang harus kita lakukan dengan menggunakan beberapa script atau code di bawah ini yang nantinya akan kita pasang di dalan template blog.

Berikut Cara Memasang Video Responsive dan Valid HTML5 :

1. Pertama sobat pasang dulu widget CSS di bawah ini . diatas kode ]]></b:skin> atau </style>

.Video-Responsive {
     position:relative;padding-bottom: 56.25%;
     padding-top:25px;
     height:0;
}
.Video-Responsive iframe, video, object, embed {
     position:absolute;
     top:0;
     left:0;
     width:100%;
     height:100%;
}

2. Setelah anda Memasang CSS nya , sekarang saatnya anda pasang HTML nya untuk memanggil css tadi. Berikut Contoh penerapan kontrol koding pada iframe pada embed video YOUTUBE

<div class="Video-Responsive">
<object data="https://www.youtube.com/embed/Qyonn5Vbg7s" height="329" width="100%"></object></div>

Ganti URL yang saya tandai dengan URL Video anda.

Berikut Contoh Tampilanya :

Demikian tutorial Cara Memasang Video Responsiave dan Valid HTML5, Selamat Mencoba Dan Semoga Berhasil...

Share this post