Vimeo videolarını W3 standartlarına uygun eklemek

vimeo logoVideo siteleri, videolarının başka sayfalara eklenmesini sağlayan <embed> kodlarının W3 standartlarına uygunluğunu göz ardı etmekteler. Sayfalarının bu standartlara uygunluğuna takmış/kendini adamış insanlar için video eklemek çoğu zaman kabusa dönüşebiliyor. Kapanmadan önce Youtube videolarını sayfamıza geçerli XHTML 1.0 olarak ekleyerek bu sorunu aşmıştık. Hatta e-burhan’ın bu iş için yaptığı araç ve bu aracın tarayıcıya eklenen Bookmarklet’i işimizi fazlasıyla kolaylaştırmaktaydı. 5651 denen yasamız ve bu yasanın yılmaz uygulayıcıları Youtube’u ülkeye haram ettikten sonra artık diğer video sağlayıcılarını kullanmaya başladık ve sorunumuz yine ortaya çıktı. Son zamanlarda fazlaca kullandığımız video servisi Vimeo’nun kodlarınu w3 standartlarına uygun hale getirme bu yazının asıl amacı olmaktalar. Bunun için aşağıdaki kodlarda VIDEOID yazan yere videonun id’sini (hadi canım demek istiyorum kendime) yazarak bu sorunu aşabiliyoruz.

<object width="265" height="200"

data="http://www.vimeo.com/moogaloop.swf?clip_id=VIDEOID&server=www.vimeo.com&show_title=1&show_byline=1&show_portrait=0&color=00ADEF&fullscreen=1"

type="application/x-shockwave-flash">

<param name="allowfullscreen" value="true" />

<param name="allowscriptaccess" value="always" />

<param name="movie" value="http://www.vimeo.com/moogaloop.swf?clip_id=VIDEOID&server=www.vimeo.com&show_title=1&show_byline=1&show_portrait=0&color=00ADEF&fullscreen=1" />

</object>
Etiketler: , , , , ,

HTML 5.0! Sonunda!

HTML 5.0

Uzun zaman oldu gözlerimiz yollarda kaldı artık bu bekleyiş bitti diyebiliriz. HTML 4.0 ‘ın yayınlanmasından tam 10 yıl sonra HTML 5.0 ‘ın ilk draftı bugün yayınlandı. Bu sayfadan HTML 5.0′ın (yani Hypertext Markup Language-Zengin Metin İşaretleme Dili’nin bugüne kadar yapılmış beşinci revize hali) dökümanına bakabilirsiniz.

Beklendiği üzere revize hali yeni elementler (header,footer,section gibi) ve yeni özellikler içermekte. Darısı tarayıcıların HTML 5.0′ı hatasız yorumlamasına.

Etiketler: , , ,

<acronym> ile kısaltmaları şekillendirme

Açıklamaları eksik olduğu için bizim ekonomi sayfalarına boş boş bakmamıza neden olan kısaltmaları, web sayfalarında <acronym> etiketi ile gayet anlaşılır bir şekilde kullnabiliriz. Örnek olarak:

<acronym title=”Extensible HyperText Markup Language ” >XHTML</acronym>

XHTML

Stil dosyasına aşağıdaki kodu ekleyerek kısaltma üzerine gelindiğinde mouse’da bir soru işareti çıkmasını da sağlayabiliriz.

acronym { cursor: help; }

Kısaltma demişken açılımını bilmediğiniz kısaltmalar için buraya bakabilirsiniz.

Etiketler: , ,

Firefox için HTML Validator eklentisi

HTML Validator
Sayfaların valid HTML veya XHTML olduğunu kontrol edebilmek için Firefox’a HTML Validator eklentisini kurabiliriz. Eklenti kurulduktan sonra herhangi bir sayfaya girdiğimizde sayfanın validation durumunu sağ altta aşağıdaki gibi görürüz.
HTML and XHTML validation

Etiketler: , , , , ,

Youtube Videolarını sayfaya Valid XHTML 1.0 halinde eklemek

Youtube’da video’nun altındaki embed kodunu sayfaya ekleyip burdaki validator ile kontrol ettirdiğimizde kodların valid XHTML 1.0 olmadığını ve sürekli hata verdiğini görüyoruz. Bunu önlemek için kodu

<object width="425" height="350"><param name="movie" value="http://www.youtube.com/v/7_6B6aa342"></param><embed src="http://www.youtube.com/v/7_6B6aa342" type="application/x-shockwave-flash" width="425" height="350"></embed></object>

yerine aşağıdaki gibi eklersek bu sorunu çözmüş oluruz.

<object type="application/x-shockwave-flash" style="width:425px; height:350px;" data="http://www.youtube.com/v/7_6B6aa342"><param name="movie" value="http://www.youtube.com/v/7_6B6aa342" /></object>

Etiketler: , , , ,