Şeffaf HTML Şablonları

Katmanlı Web Sayfaları İçin Fonksiyonel Şeffaf HTML Şablonları

Şeffaf bir HTML şablonu, iki katman halinde oluşturulmuş sayfalar için hazır işaretleme sağlar: görseli barındıran bir arka plan bölümü ve bunun üzerinde yer alan başlıklar, metinler ve butonlar grubu. Bu ikisinin kaynak kodda birbirine ne kadar sıkı bağlandığı, görsel değiştiğinde veya bir bölüm başka bir sayfaya taşındığında ne olacağını belirler.

Ön Plan İçeriğinin Altındaki Arka Plan Medyası

Katmanlı bir giriş bölümü genellikle içinde bir içerik sarmalayıcısı bulunan bir medya kapsayıcısıdır; başlık ile harekete geçirici mesaj bu sarmalayıcıda yer alır. Bunda olağanüstü bir durum yoktur ancak satın almadan önce incelenmeye değer kısım tam olarak burasıdır. Projenizin tekrarladığı desenleri görmek için sağlanan kaynak koda göz atın:

1. içerik grubu doğrudan içine yazılmış, görsel arka planlı bir giriş bölümü;
2. kendi menü ögelerini taşıyan şeffaf bir header;
3. başlığı ve butonu bir arada tutan bir katman harekete geçirici mesajı;
4. her alt yazının kendi görseline ait olduğu bir portföy bölümü.

Zihninizde arka planı kapatın ve geriye kalanı okuyun. Başlık, altındaki satır ve buton tek başlarına anlam ifade etmeye devam ediyorsa işaretleme anlamı taşır ve şeffaflık yalnızca üstte bir katman olarak yer alır.

Düzenlemelere Dayanıklı Kaynak Kod Sırası

Görsel örtüşme, hangi metnin hangi görsele ait olduğunun hiçbir zaman tek göstergesi olmamalıdır. Nitelikli bir işaretlemede bu ilişki açıkça tanımlanmıştır; böylece bir bölüm kopyalanabilir veya yeniden sıralanabilir ve bütünlüğü bozulmaz. Birkaç kontrol, katmanların nasıl bir araya getirildiğini gösterir:

1. görseliyle birlikte başka bir sayfaya kopyalanan katmanlı bir bölüm;
2. kendisinden sonraki bölümün altına taşınan giriş bölümü;
3. katman alanının dışına taşacak uzunlukta yeniden yazılan bir başlık;
4. içeriğin medyanın altına indiği mobil genişlikteki aynı bölüm.

Son iki durum zayıf kaynak kodun kendini gösterdiği yerlerdir. Katman alanını aşan bir başlık, fotoğrafın en karmaşık yerine denk gelir ve dar ekranlar, her ikisi de aynı bölümde yer almadıkça içerik grubunu medyasından ayırır. Nicepage, tamamlanan dosyaları kendi sunucunuz veya bir geliştirici için dışa aktarır ve kaynak kod düzenlemeye açık kalır.

Blokları Yeniden Oluşturmadan Görselleri Değiştirme

Katmanlı bir şablonun asıl testi medya değişimidir. Giriş bölümüne kendi fotoğrafınızı yerleştirin ve başka hiçbir şeyin kaymadığını, aynı içerik grubunun yeni bir arka plan üzerinde aynı sırada kaldığını kontrol edin.

Eğer başlığın manuel olarak yerine kaydırılması gerekiyorsa, kompozisyonu ayakta tutan şey demo görselidir. İyi bir şeffaf HTML şablonu, katmanlı yapıyı bozmadan arka plan medyasını değiştirmenize, ön plan metnini yeniden yazmanıza ve bölümleri yeniden sıralamanıza olanak tanır.