GÖRSEL WEB TASARIMI

Tipografi, harf, sözcük ve satırlarla, boşluklarının düzenlenmesi gereken diğer ögelerle belirlenmiş bir sayfa üzerinde yapılan görsel ve işlevsel düzenlemelerdir.

Serif: Tırnak demektir. Karakterlerin uç kısımlarındaki tırnaklı kısımları ifade eder.

Yazı karakteri metinde kullanılan harflerin, rakamların, işaretlerin, sembollerin aynı biçimsel özellik ve oranlara göre seçilerek kullanılmasıdır.

İdeal satır arası boşluk ölçüsüne harfin punto değerine 2 eklenerek ulaşılır. Örneğin metinde 12 punto ile yazı yazıyorsanız satır arası boşluk değeri 14 (12+2) olmalıdır.

Yazı ailelerinin karakterlerinin biçimsel özelliklerine bakıldığında farklı kalınlıklardaki uyarlamaları extra light (çok ince), light (ince), book, demi (yarım), medium (orta), bold (kalın), extra bold (çok kalın), heavy (ağır) ve ultra (aşırı)dır. Farklı kalınlıklara sahip bu uyarlamaların condensed (yoğunlaştırılmış), regular (normal) ve extended (seyreltilmiş) uyarlamaları, farklı açılara sahip roman (dik) ve italik (eğik) uyarlamaları ile işleme seçenekleri outline (kontür), shaded (gölgeli), decorated (süslü) de bulunmaktadır.

Dan Mayer font seçimi için beş kural belirlemiştir. Bu kurallar:

Metni komple BÜYÜK harflerle yazmak metnin okunurluğunu azalttığı gibi yazılı iletişimde büyük harf ile yazmak, karşı tarafa bağırarak konuşmak anlamına da gelmektedir.

Her İki Yana Yaslı (Her İki Taraftan Blok, Her İki Tarafa Hizalı): Metnin sağ ve sol sütunlara yaslanmasıyla oluşturulan sayfa yapısıdır. Metinde yer alan başlıklarda tercih edilen bir yapıdır.

Tipografi seçiminde dikkat edilmesi gereken en önemli noktalardan biri metnin yayınlanacağı ortamın belirlenmesidir. Basılı ortamda yayınlanacak metinlerin düzenlenmesinde ilk dört kural takip edilebilir. Fakat metnin basılı olmayan elektronik ortamda yayınlanması durumunda yayınlanacak ortamda kullanılan yazılımın alt yapısı, üstünlükleri ve sınırlıklarının yanı sıra içeriğin görüntüleneceği ekran büyüklüğü önemlidir. Burada elektronik ortamdan kasıt web ortamıdır. Web ortamında sabit (fixed), akışkan (Fluid), uyarlanabilir (Adaptive) ve esnek (Responsive) tasarım yapıları kullanılmaktadır.

Tipografi paketi olarak kullanılan ve web sayfası tasarımında esnek tasarımı sağlayan tipografi paketleri; Bootstrap, Skeleton, Cardinal, Concise, BassCSS, Furtive, Mueller’dir.

Leading: Metindeki satırlar arası boşluğu ifade eder.

Kerning: Metni oluşturan harfler arasındaki boşluğu ifade eder. Tracking ise bir satır içindeki karakterler arası boşluktur.

Eski Biçem - Garamond
(Fransa)
Transitional - Baskerville
(İngiltere)
Kalın Tırnaklı - Century
(Amerika)

Tırnaksız - Helvetica
(İsviçre)

Modern - Bodoni
(İtalya)

İdeal satır arası boşluk ölçüsüne harfin punto değerine 2 eklenerek ulaşılır. Örneğin metinde 11 punto ile yazı yazıyorsanız satır arası boşluk değeri 13 (11+2) olmalıdır

Dan Mayer (2010)
font seçimi için beş kural belirlemiştir. Bu kurallar:
• Duruma uygun seçim
• Font ailelerini bilme (Şekil 5.8)
• Arka planın metnin önüne geçmemesi
• Kullanım amacına göre seçim
• Kuralsızlık

Sağa Yaslı ( Sağdan Blok, Sağa Hizalı): Metnin sağa yaslanması ile oluşturulan ve her satırın farklı başlangıç noktalarından başladığı fakat satır sonlarının eşit olduğu sayfa düzeni yapısıdır. Soldan sağa doğru okuma düzeninde gözün her satırda farklı başlangıç noktalarına hareket edeceğinden dolayı okunurluk azalır ve göz yorulur.

Web ortamında sabit (fixed), akışkan (Fluid), uyarlanabilir (Adaptive) ve esnek (Responsive) tasarım yapıları kullanılmaktadır.

Cardinal, modüler yapıda olan ve mobil cihazlar için performans ve ölçeklenebilir yapıda
geliştirilmiş CSS çerçevesidir.

Furtive
Furtive, ızgara yapısının ve ögelerin boyutlandırılmasında rem parçası için Flexbox ve SVGs kullanımı gibi gelişmiş web standartları etrafında geliştirilmiş CSS çerçevesidir. www.furtive.co adresinden .zip dosyası indirilerek web tasarımlarında kullanılabilir. Furtive, eski tarayıcıların desteklemediği küçük CSS ayak izine sahiptir ve CSS indirmeleri için gerekli olan bant genişliğini kesmektedir. Gelişmiş web tasarımı projelerinde kullanılmak üzere geliştirilmiş yapıdır. Esnek ızgara yapısıyla sayfa yapıları rahatlıkla boyutuna göre ölçeklenebilir.

Sözcük Boşluk Düzeni: Metni oluşturan sözcüklerin arasındaki boşluklar “ı” harfinin genişliği kadar olmalıdır. Başlıkların daha iyi algılanması ve bütünün algılanması sağlanarak daha akıcı bir okuma için sözcükler arasındaki boşluklar azaltılır.