HTML5 & CSS3 – Ders 3


Listeler ve resim galerileri gibi etkin web sitesi içeriği genellikle HTML&CSS kullanılarak oluşturulabilir. HTML5&CSS3’ün yeni özelliklerini kullanarak biçim vermek oldukça kolaydır. Öncelikle tüm sayfalar duyarlı yapılabilir. Başka bir deyişle her türlü görüntüleme cihazı ve farklı cep telefonu, tablet ve bilgisayar gibi çeşitli ekran boyutlarına uyum sağlayabilirler.

 

 

Duyarlı web tasarımı, görüntüleme cihazına göre görünen alan olan web sayfası görüş alanını tanımlamayı içerir. Küçük ekranlarda görüş alanı da küçüktür. Bir web sayfasını herhangi bir görüş alanına uyarlamak web sayfası yüklenirken cihaz genişliğine göre başlangıç ölçeğini kuran görüş alanı meta etiketini eklemek anlamına gelmektedir.

Ana hat ayrımları ve görüntüler gibi tüm web sayfası elementleri sabit piksel sayıları yerine yüzde kullanılarak boyutlandırılmalıdır. Web sayfaları genel olarak toplam sayfa genişliğinden her biri belirli oran kaplayan 12 sütuna bölünmektedir. İçeriği sütunlara ayırmanın yanı sıra; tarayıcı penceresini dikey veya yatay olarak ayarlamada CSS’yi değiştirmeye izin veren medya sorgularını kullanmak gereklidir.

HTML&CSS düzenleme ve anlamayı kolaylaştırmak için metin düzenleyicide açık bir şekilde yazılmalıdır. İyi yazım uygulamalarında bu yönergeleri takip etmek kodun doğru girintilenmesi, açık olan tüm etiketlerin kapatılması ve etiketin düzgün yerleştirilmesi gibi kod fonksiyonelliğini ve okunabilirliğini yansıtır. Oluşturulan tüm dokümanlar birden fazla web tarayıcısında test edilmeli ve otomatik kod doğrulama programını kullanmalıdır. Bu kullanıcının deneyimini büyük ölçüde artırır ve web sitesinin her türlü koşulda ve tüm site ziyaretçileri için istenildiği gibi görünmesini sağlar. 

Mevcut ücretsiz uygulamalardan biri dokümanın URL’sini sağlayarak, dosyaları yükleyerek veya doğrudan girdi ile kod doğrulamasını destekleyen https://validator.w3.org’deki Markup Validator’dur.