Erken öğreneceğiniz etiketlerden biri web tasarımı eğitim, "vurgu etiketleri" olarak bilinen bir çift etikettir. Gelin bu etiketlerin neler olduğuna ve günümüzde web tasarımında nasıl kullanıldığına bir göz atalım.
XHTML'ye geri dön
HTML'yi yıllar önce öğrendiyseniz, yükselişinden çok önce HTML5, muhtemelen hem kalın hem de italik etiketleri kullandınız. Beklediğiniz gibi, bu etiketler öğeleri sırasıyla kalın metne veya italik metne dönüştürdü. Bu etiketlerle ilgili sorun ve neden yeni öğeler lehine bir kenara itildikleri (ki buna birazdan bakacağız), anlamsal öğeler olmamalarıdır. Bunun nedeni, metin hakkında bilgi vermekten çok metnin nasıl görünmesi gerektiğini tanımlamalarıdır. Unutmayın, HTML (bu etiketlerin yazılacağı yer) tamamen yapı ile ilgilidir, görsel stille değil! görseller işlenir CSS ve web tasarımı en iyi uygulamaları uzun zamandır web sayfalarınızda net bir stil ve yapı ayrımına sahip olmanız gerektiğini savunmuştur. Bu, anlamsal olmayan ve yapıdan ziyade ayrıntı gibi görünen öğelerin kullanılmaması anlamına gelir. Bu yüzden cesur ve
italik etiketlerin yerini genellikle güçlü (kalın için) ve vurgu (italik için) almıştır.ve
Güçlü ve vurgulu öğeler, metninize bilgi ekler, bu içerik konuşulduğunda farklı şekilde ele alınması ve vurgulanması gereken içeriği detaylandırır. Bu öğeleri, geçmişte kalın ve italik kullandığınız şekilde hemen hemen aynı şekilde kullanıyorsunuz. Metninizi açılış ve kapanış etiketleriyle çevreleyin ( ve vurgu için ve ve güçlü vurgu için) ve ekteki metin vurgulanacaktır.
Bu etiketleri iç içe yerleştirebilirsiniz ve hangisinin harici etiket olduğu önemli değildir. İşte bazı örnekler.
Bu metin vurgulanmıştır ve çoğu tarayıcı onu italik olarak görüntüler.
Bu metin şiddetle vurgulanmıştır ve çoğu tarayıcı bunu kalın yazı tipi olarak görüntüler.
Bu örneklerin her ikisinde de görsel görünümü dikte etmiyoruz. HTML. Evet, varsayılan görünüm etiketi italik olur ve cesur olurdu, ancak bu görünümler CSS'de kolayca değiştirilebilir. Bu, her iki dünyanın da en iyisidir. Belgenizde gerçekten çizgiyi aşmadan ve yapı ile stili karıştırmadan italik veya kalın metin elde etmek için varsayılan tarayıcı stillerinden yararlanabilirsiniz. bunu istediğini söyle metin sadece kalın değil, aynı zamanda kırmızı olacak şekilde, bunu SCS'ye ekleyebilirsiniz.
kuvvetli {
kırmızı renk;
}
Bu örnekte, varsayılan değer olduğundan kalın yazı tipi ağırlığı için bir özellik eklemeniz gerekmez. Ancak bunu şansa bırakmak istemiyorsanız, her zaman ekleyebilirsiniz:
kuvvetli {
yazı tipi ağırlığı: kalın;
kırmızı renk;
}
Artık nerede olursanız olun kalın (ve kırmızı) metin içeren bir sayfaya sahip olmanız neredeyse garanti edilir. etiketi kullanılır.
Vurguyu ikiye katlayın
Yıl boyunca fark ettiğimiz bir şey, vurguyu ikiye katlamaya çalışırsanız ne olacağıdır. Örneğin:
Bu metin her ikisine de sahip olmalıdır kalın ve italik içindeki metin.
Bu satırın kalın VE italik metin içeren bir alan oluşturacağını düşünürdünüz. Bazen bu gerçekten olur, ancak bazı tarayıcıların iki vurgu stilinden yalnızca ikincisini, söz konusu gerçek metne en yakın olanı onurlandırdığını ve bunu yalnızca italik olarak görüntülediğini gördük. Vurgu etiketlerini ikiye katlamamamızın nedenlerinden biri de budur.
Bu "ikiye katlamadan" kaçınmanın bir başka nedeni de stilistik amaçlar içindir. Ayarlamak istediğiniz tonu iletmek için genellikle bir vurgu biçimi yeterlidir. Öne çıkması için metni kalınlaştırmanız, italik yazmanız, renklendirmeniz, büyütmeniz ve altını çizmeniz gerekmez. Bu metin, tüm bu farklı vurgu türleri cafcaflı hale gelecektir. Bu nedenle, vurgu sağlamak için vurgu etiketleri veya CSS stilleri kullanırken dikkatli olun ve aşırıya kaçmayın.
Kalın ve İtalik Yazılar Üzerine Bir Not
Son bir düşünce - cesur iken () ve italik () etiketlerinin artık vurgu öğeleri olarak kullanılması önerilmez, bu etiketleri metnin satır içi alanlarına stil vermek için kullanan bazı web tasarımcıları vardır. Temel olarak, bir gibi kullanıyorlar öğe. Bu güzel çünkü etiketler çok kısa, ancak bu öğelerin bu şekilde kullanılması genellikle önerilmez. Bazı sitelerde kalın veya italik metin oluşturmak için değil, başka bir tür görsel stil için bir CSS kancası oluşturmak için kullanıldığını görmeniz durumunda söz ediyoruz.