dizgi
Dizgi, web siteleri de dahil olmak üzere, grafik tasarım ürünlerinde okunacak tüm metinlerin okunaklı ve ayrıca okuyucunun gözünün kolayca anlayabileceği şekilde, en önemli olanın vurgulanmasıyla biçimlendirilmesidir. Bu, bu sayfada >>> incelediğimiz konu olan logo dizgisinden çok farklıdır.
-
Logonuz için kullandığınız yazı tipi, yalnızca o örnekte bulunacak bağımsız bir öğedir, bu nedenle daha eksantrik olabilir.
-
Oysa dizgi için seçeceğiniz font sitede sürekli olarak kendini tekrar edecek, sitenizin tamamında tutarlı olmak durumunda olacaktır.
-
Dolayısıyla bir logo için seçeceğiniz font tip ile dizgi için seçeceğiniz yazı tipi çok farklı işlevlere sahiptirler - dizgi fontlarının okunmaları ve anlaşılmaları gerekirken, logo fontları "marka tanınırlığı" dediğimiz şeyi yaratmak için ana işlevleri hatırlanmak olan görsel işaretleyicilerdir.
-
Dizgi için ihtiyaç duyduğumuz tutarlılığı ve okunaklılığı elde etmek için
-
Uygun fontun seçilmesi
-
bu, iyi hiyerarşilerin oluşmasını kolaylaştırmak için büyük bir ağırlık ailesine sahip bir font anlamına gelir.
-
Sans serifler söz konusu olduğunda ise okumayı kolaylaştırmak için dar veya yarı dar geniş fontlar
-
ya da serifli fontlar kullanılması tavsiye edilir.
-
(Not: Burada 2 farklı özellikten bahsediyoruz:
-
Ağırlık: Fontun, İnce ve Ekstra İnce'den Ekstra Siyah'a ve aradaki pek çok kalınlığa kadar gidebilen gerçek konturlarının kalınlığıdır.
-
Genişlik: Bu, Ultra Sıkıştırılmış'tan Ultra Genişletilmiş'e gidebilen bir fontun harflerinin yatay uzantısıdır.)
İyi bir font seçimi yapıldıktan sonra, tipografik stile geçilir ve bu, aşağıdakiler gibi biçimlendirme özelliklerini içerir:
-
karakter aralığı,
-
satır aralığı,
-
paragraf araları,
-
hizalama.
-
ağırlıklar ve boyutlar ile hiyerarşi ayarlamak, ki bu şu sayfada ayrıntılı olarak incelediğimiz önemli bir konu >>>.
Önemli
-
Lütfen Wix fontlarını kullanmak yerine kendi fontlarınızı indirin.
-
Hepsini kullanacağınızı düşünmeseniz bile tüm yazı tipi ailesini Wix'e yükleyin.
-
Metinlerinizi yerleştirmeye başlamadan önce site stillerinizi ayarlayın. Bunun nasıl yapılacağına dair videoyu şurada izleyin >>>.
Önerilen Aileler Sans Serif:
(Bunların çoğu dar veya yarı dar genişliğe sahiptir, metin yazıları için lütfen dar genişlikleri kullanın )
-
Barlow
-
Fira Sans
-
Exo 2 / Exo Condensed
-
Futura
-
Roboto Condensed
-
Encode
-
Saira
-
Advent Pro
-
Georama
-
Sofia
(Not: Hepsi google fonts'da mevcut, Futura ve Exo Condensed hariç onları da buradan indirin >>>)
Önerilen Aileler Serif:
-
Cormorant
-
Taviraj
-
Trirong
-
Fraunces
-
Bitter
-
Spectral
-
Noto Serif Georgian
-
Noto Serif Display
(Note: Hepsi google fonts da bulunabilinir.)
dar fontlar
Aşağıda aynı tam metni üç farklı şekilde dizdim: Üst ayar normal genişlikte sans serif, orta yarı yoğunlaştırılmış genişlikte sans serif ve altta bir serif yazı tipi.
-
Font boyu aynı (17 px),
-
Harf aralığı aynı (-0.03),
-
Satır arası aynı (1.4)
Şimdi sizden bu küçük paragrafların üçünü de okumanızı ve bunlardan hangisinin okunmasının en kolay ve hangisinin en zor olduğuna karar vermenizi istiyorum.
REGULAR SANS SERIF PARAGRAPH TYPESETTING: ROBOTO REGULAR
We have taken traditional Eastern Mediterranean / Middle Eastern Cuisine and given it a makeover to fit the needs of the fast paced lifestyle of today’s Istanbul. Regardless of whether you dine in one of our dashing cafes, or shop from our market, or have the goodies delivered directly to your doorstep - get ready for a dining experience that is rich in taste as well as good nutrition since it has been created entirely out of organic products grown in season, locally.
SEMI CONDENSED SANS SERIF PARAGRAPH TYPESETTING:
ROBOTO CONDENSED
We have taken traditional Eastern Mediterranean / Middle Eastern Cuisine and given it a makeover to fit the needs of the fast paced lifestyle of today’s Istanbul. Regardless of whether you dine in one of our dashing cafes, or shop from our market, or have the goodies delivered directly to your doorstep - get ready for a dining experience that is rich in taste as well as good nutrition since it has been created entirely out of organic products grown in season, locally.
SERIF PARAGRAPH TYPESETTING:
TIMES NEW ROMAN
We have taken traditional Eastern Mediterranean / Middle Eastern Cuisine and given it a makeover to fit the needs of the fast paced lifestyle of today’s Istanbul. Regardless of whether you dine in one of our dashing cafes, or shop from our market, or have the goodies delivered directly to your doorstep - get ready for a dining experience that is rich in taste as well as good nutrition since it has been created entirely out of organic products grown in season, locally.
Büyük bir istisna olmadığınız sürece, sizin için de okunması en kolay olan ortadaki, ikincisi alttaki serif yazı tipi, ve okunması en zor olanı ise üstteki normal genişlikteki sans serif olmuştur. Ve işte bunun nedeni:
Burada yine aynı üç yazı tipine, aynı yazı tipi boyutuna, harf aralığına ve satır aralığı söz konus. Şimdi, kırmızı alanlar arasındaki boyut farkına bakın. Üstte, harfler arasında çok belirgin boşluklar var ve ortada fark edilir derecede daha az boşluk var. Fakat sonra en alttakinde hala belirgin boşluklar var ve yine de okumak en üsttekinden çok daha kolay. İşte nedeni:
-
Üst ve orta örneklerde bu, en tepedeki normal genişlikte sans serif fontlarda çok daha yuvarlak olan harflerin şeklinden kaynaklanırken, dar veya yarı dar sans seriflerde yuvarlak harflerin şekli daha ziyade dikey dikdörtgenler gibi olur. Ve bu dar harfler uzun şekilleri nedeniyle birbirine çok daha yakın durabildikleri için, harfler arasındaki boşlukları ciddi biçimde azalır ve okunaklılık bu şekilde artmış olur.
-
Seriflilere gelince, onları son derece okunaklı kılan şey, harf biçimlerinin şekli değil de, fontların uçlarında tüm harfleri birbirine bağlayan ve doğal bir taban çizgisi oluşturan küçük "pabuçlara" sahip olmalarıdır.
-
Ve her durumda, okunaklılık taban çizgisi ve harflerin ona nasıl "oturduğu" ve birbirine nasıl bağlandığı ile ilgilidir.
italikler
İtalikler, size başka bir dizgi stili veren yazı tipleri değildir. İtalikler ya normal eğimli fontlarla dizilmiş metinlerin içerisindeki bazı kelimelerin italik olarak yazıldığı durumlara veya italik olarak dizilmiş bir metin parçacığının normal eğimli bir yazı blokuna yakın yerleştirildiği ilişkilerle çalışırlar. Bu nedenle, italik metnin işlevini yerine getirebilmesi için, italik olmayan daha büyük bir metin parçasıyla her zaman bir ilişkisi olmalıdır, zira:
-
İtalik, belirli bir kelimeyi veya cümleyi vurgulamak için kullanılır.
-
Italics are used to turn words, letters, and numbers into specific terms.
-
İtalik, sözcükleri, harfleri ve sayıları belirli terimlere dönüştürmek için ya da iki terim arasında bir kontrast oluşturmak için kullanılır.
-
İtalik, kitap, film veya dergi başlıklarını veya web siteleri dahil diğer yayınların başlıklarını belirtmek için kullanılır.
-
İlgili oldukları metin yığınından öne çıkmalarını sağlamak için başlıklar veya spotlar için italik kullanılabilir.
-
Bu web sitesinde kullandığım tüm açıklayıcı notlar gibi, metnin kendisine yakın olan kısmından ayrı bir işlevi olan küçük paragraflarda italik kullanılmaktadır.
kullanım örnekleri
We have taken traditional Eastern Mediterranean / Middle Eastern Cuisine and given it a makeover to fit the needs of the fast paced lifestyle of today’s Istanbul. Regardless of whether you dine in one of our dashing cafes, or shop from our market, or have the goodies delivered directly to your doorstep - get ready for a dining experience that is rich in taste as well as good nutrition since it has been created entirely out of organic products grown in season, locally.
Doğru kullanım: Yazı blokunun içinide sadece bazı kelimeler vurgu amacı ile italik yapılmış.
We have taken traditional Eastern Mediterranean / Middle Eastern Cuisine and given it a makeover to fit the needs of the fast paced lifestyle of today’s Istanbul. Regardless of whether you dine in one of our dashing cafes, or shop from our market, or have the goodies delivered directly to your doorstep - get ready for a dining experience that is rich in taste as well as good nutrition since it has been created entirely out of organic products grown in season, locally.
Yanlış kullanım: Tüm paragraf italik yazılmış.
serifli font kullanımı
Serif yazı tipleriyle çalışmak söz konusu olduğunda, seçiminizi yapmadan önce bilmeniz gereken bazı şeyler vardır. Noto Serif ailesini seçtim çünkü:
-
Bu aile, tek tek glifleri (karakterleri) oluşturan konturlarda çok daha yüksek kontrasta sahip olan "Display" tabir ettiğimiz yazı tiplerine sahip. Gördüğünüz gibi, bazı vuruş açıları diğerlerinden oldukça kalın.
-
Ekran serif yazı tipleri çok güzel görünse de daha küçük piksel/nokta boyutlarında uzun metinlerde okunmları kolay değildir.
-
Dolayısıyla, bir başlıkta veya bir noktada bir Ekran yazı tipi kullanabiliriz. Ancak paragraf metinleri için Display serif yazı tipi kullanmak doğru olmaz.
-
-
Bu yüzden, hala ilk yazı tipiyle ilgili olan ikinci bir yazı tipine, yani normal bir seriflli fonta ihtiyacımız var.
-
Noto Serif, bize bu çeşitliliği veriyor: Bir Noto Serif "Display" ve birincisinin çoğu özelliğini paylaşan sağlam bir yazı tipi olan (sonuçta aynı ailedenler) ancak o kadar yüksek olmayan bir de Noto Serif Georgian var ve bu ikisinin kombinasyonu bize çok daha sağlam bir dizgi verecektir.
-
Sonuç: Paragraf metinlerini "Display" fontlarla yazmamaya dikkat edin.
-
Birçoğu adlarında "Display" yazacaktır fakat buna güvenmeyin zira.
-
Örnek olarak, hem Bodoni hem de Didot, adlarında "display" kelimesi olmayan display yazı tipleridir. Her ikisi de başlıklar, alt başlıklar veya alt yazılar için çok iyi kullanımları olan ancak paragraf olarak kullanıldığında okunması son derece zorlaşan güzel yazı tipleridir.
-
-
Dolayısıyla karakterlerin vuruşlarının her yönde kabaca eşit olduğundan emin olun zira "display" serifli fontların başlıca özelliği vuruşlarda ciddi kalınlıklar olmasıdır.
Font: Noto Serif Display
noto serıf dısplay
"Display" serifli font başlıktaçok iyi görünse de, bir paragraf metni haline geldiğinde, gördüğünüz gibi okumak oldukça zorlaşmakta.
Once a Spice Shop, always a Spice Shop?
Well, we still are a Spice Shop, but nowadays we are so much more!
Regardless of whether you dine in one of our dashing cafes, or shop from our market, or have the goodies delivered directly to your doorstep - get ready for a dining experience that is rich in taste as well as good nutrition since it has been created entirely out of organic products grown in season, locally.
Font: Noto Serif Georgian
noto serıf georgıan
Normal serif yazı tipi, özellikle başlık ve alt başlıkta olduğu gibi daha büyük bir boyuta kullanıldığında, çok zarif görünmüyor. Fakat paragraf dizmek için kullanıldığında okunması ciddi miktarda daha kolay
Once a Spice Shop, always a Spice Shop?
Well, we still are a Spice Shop, but nowadays we are so much more!
Regardless of whether you dine in one of our dashing cafes, or shop from our market, or have the goodies delivered directly to your doorstep - get ready for a dining experience that is rich in taste as well as good nutrition since it has been created entirely out of organic products grown in season, locally.
Çözüm: Bu iki yazı tipi aynı aileye ait olduğu için (Noto) onları birleştiririyoruz: Paragrafı Noto Serif Georgian ile ve Başlık ve Alt Başlığı Noto Serif Dispaly ile yazın. Bu arada herhangi bir normal serifli (mesela Garamond ya da Times New Roman da) display fontlarla çok güzel ilişkiler kurabilir.
paragraf hizaları
Paragraf dizgi için 4 temel hizalama yöntemi vardır ve aşağıda 4 tanesi için örnekler ve açıklayıcı metinler bulacaksınız:
-
Sol blok
-
Sağ blok
-
Ortalı
-
Sağ sol blok
left alıgned
We are also collaborating with ceramic, wood, metal and glass artists and collectives to bring forth our own lines of tableware, kitchenware and unique home accessories that take their inspirations from the traditional crafts of Anatolia which our artists and designers combine with the streamlined tastes and needs of contemporary urban lifestyles.
Bu, en yaygın kullanılan dizgi stilidir - ve bunun da çok iyi bir nedeni vardır, zira okunması en kolay olanıdır. Latin alfabesiyle soldan başlayan çizgilere alışmış olangözlerimiz için doğal ortamdır. Dolayısıyla bu, ekran okuması için paragrafların dizilmesi için standart hizalamadır ve genelde önerilen hizalama da budur.
rıght alıgned
We are also collaborating with ceramic, wood, metal and glass artists and collectives to bring forth our own lines of tableware, kitchenware and unique home accessories that take their inspirations from the traditional crafts of Anatolia which our artists and designers combine with the streamlined tastes and needs of contemporary urban lifestyles.
Sağa hizalı paragraflar Latin alfabesi ile soldan sağa doğru okunduğu için kolay okunamazlar ve bu nedenle sağa hizalı uzun metinler gözü karıştırır. Bununla birlikte, özellikle noktalar gibi daha kısa metin parçalarında bu tür hizalama için kullanımlar vardır. Sağa hizalı paragraflardaki ikinci sorun, bu örnekte virgülle biten ikinci satırda olduğu gibi, satırın en sonuna düşen noktalama işaretlerinin hizalamayı bozma eğiliminde olmasıdır.
centered
We are also collaborating with ceramic, wood, metal and glass artists and collectives to bring forth our own lines of tableware, kitchenware and unique home accessories that take their inspirations from the traditional crafts of Anatolia which our artists and designers combine with the streamlined tastes and needs of contemporary urban lifestyles.
Centered text is very popular in web design, however it has its shortcomings when it comes to reading longer texts. These are the same as right aligned text issues: Our eyes expect to see a clearly aligned starting point of the lines which is naturally on the left since we read from left to right. So, same as right aligned texts, centered texts can be used for short pieces of text or headings but will not really work for lengthy paragraphs.
justıfıed
We are also collaborating with ceramic, wood, metal and glass artists and collectives to bring forth our own lines of tableware, kitchenware and unique home accessories that take their inspirations from the traditional crafts of Anatolia which our artists and designers combine with the streamlined tastes and needs of contemporary urban lifestyles.
Bu en problemli hizalamadır çünkü iki yana yaslanmış bir metin neredeyse her zaman satırların içinde delikler açar ve bu delikler de doğrudan birbirinin altına düştüğünde dizgide "beyaz nehirler" dediğimiz şeyi oluşturur. Bu örnekte böyle 3 beyaz nehirimiz var: Her ikisi de 2. ve 3. satırlar arasında. Bu tür boşluklardan kaçınabilmenin tek yolu, bir satırda yeterli sayıda karakter olacak şekilde yeterince küçük puntoda dizilmiş bir metne sahip olmaktır - bu da yalnızca basılı yayınlar için işe yarar, ancak metnin okunacak kadar büyük olmasının beklendiği web için geçerli değildir.
dizgi boyları
-
Okuması kolay bir boyut seçin..
-
Metnin boyutu yazı tipine göre değişir.
-
Aynı piksel boyutunda bir font diğerinden çok daha büyük veya daha küçük görünebilir.
-
Ağırlık ve genişlik de boyutu etkiler,
-
yoğun ve hafif yazı tipleri, aynı punto boyutunda daha küçük görünecektir..
-
Aşağıda, yazı tipi değişikliğinin boyutu nasıl etkilediğini ve ayrıca paragraf metinleri için bazı iyi boyutların ne olduğunu gösteren örnekler verilmiştir. En çok işe yarayanların altını kırmızı kalemle çizdim.
This text is set in 19 pixels.
Font Barlow Semi Condensed Regular
This text is set in 22 pixels.
Font Barlow Semi Condensed Regular
This text is set in 17 pixels.
Font Barlow Semi Condensed Regular
This text is set in 19 pixels.
Font Fira Sans Condensed Regular
This text is set in 19 pixels.
Font Cormorant Medium
This text is set in 22 pixels.
Font Fira Sans Condensed Regular
This text is set in 22 pixels.
Font Cormorant Medium
This text is set in 17 pixels.
Font Fira Sans Condensed Regular
This text is set in 17 pixels.
Font Cormorant Medium
This text is set in 19 pixels.
Font Times New Roman
This text is set in 19 pixels.
Font Helvetica Regular
This text is set in 22 pixels.
Font Times New Roman
This text is set in 22 pixels.
Font Helvetica Regular
This text is set in 17 pixels.
Font Times New Roman
This text is set in 17 pixels.
Font Helvetica Regular
Bunun size gösterdiği şey, Barlow ile 19 piksele ayarlanan bir metnin doğru boyutta olduğudur. Okumada bir zorluk yok ama öte yandan çok büyük ve hantal da olmuyor. Ancak aynı 19 piksel bazı yazı tipleriyle (Cormorant ve Times New Roman) okumak için çok küçük veya diğer yazı tipleriyle (Fira ve Helvetica) ise çok büyük ve kaba hale geliyor.
22 piksele gelince, bu şimdi Cormorant için oldukça iyi çalışıyor, ancak diğerleri için çok büyük ve hantal olmaya başlıyor. Times New Roman'ın bile iyi bir sonuç alması için 1 puan inerek 21 piksel düşmesi gerekir.
17 piksel şu anda çok iyi bir okuma boyutunda olan ve görsel olarak da iyi görünen Fira ve Helvetica için çok iyi çalışıyor. Ancak 17 puan, Barlow dahil diğerleri için çok küçük.
Peki, öte yandan paragraf metinlerinin ne kadar büyük olması gerekir?
Yukarıda gördüğümüz, metnin bir paragraf olarak okunması amaçlanıyorsa, bir yazı tipinin olması gereken en küçük boyutları. Bunlar tabii ki daha da büyüyebilir. Ancak bunu yaptığınızda, şunların da farkında olmanız gerekir:
-
okunamayacak kadar büyük bir boyut elde edebilirsiniz.
-
Bu, bir satıra kaç kelimenin sığacağı ile ilgilidir.
-
metnin piksel boyutu ne kadar büyük ve sütun genişliğiniz ne kadar darsa, o kadar az kelime olacaktır ve kolayca şu duruma girebilirsiniz:
-
satırda o kadar az kelime olur ki, okuyucunun gözü ancak çok kısa bir aradan sonra bir sonraki satıra atlamak zorunda kaldığı için okumak çok zorlaşır.
-
-
-
ve ayrıca paragraf metin boyutunuz ne kadar büyük olursa başlığınızın ve alt başlığınızın da o kadar büyük olacağını ve bunun gerçekten çok büyük boyutlara neden olabileceğini hesaba katmalısınız.
satır ve harf aralıkları
Karakter ve satır aralığı değişiklikleri genellikle çok hassas olacaktır ve bunlarla uğraşmaya değip değmeyeceğini düşünebilirsiniz. Güvenin bana, kesinlikle değer. Paragraflarınızın ne kadar kolay okunduğu konusunda büyük bir fark yaratırlar ve dizginizi daha zarif ve iyi düşünülmüş hale getirmeye yardımcı olabilirler. Ve bunlar okuyucularınız tarafından bilinçaltında fark edilecek farklılıklardır.
Font: Helvetica. Font Size: 18. Character Spacing: 0. Line Spacing 1.4.
Font: Helvetica. Font Size: 18. Character Spacing: -0.03. Line Spacing: 1.4.
Font: Helvetica. Font Size: 18. Character Spacing: -0.05. Line Spacing 1.5.
Font: Exo 2 Condensed Regular. Font Size: 18. Character Spacing: -0.03. Line Spacing: 1.5.
Font: Fira Sans Condensed Regular. Font Size: 18. Character Spacing: -0.03. Line Spacing: 1.5.
Font: Fira Sans Condensed. Font Size: 16. Character Spacing: -0.03. Line Spacing: 1.7
Wix'in size verdiği varsayılan paragraf yazı tipi Helvetica (ki darlatmış font olarak kullanılmadığı sürece paragraf dizgisi için uygun yazı tipi değildir), 18 punto, karakter aralığı 0 ve satır aralığı 1.4'tür. 18 noktada 1.4 satır aralığı iyi bir değer olsa da, ikinci ekran görüntüsünde yaptığım gibi karakter aralığı küçük bir miktar azaltılmalıdır.
Yukarıda, diğer bazı değerlerle oynadığım ve ardından yazı tipini önce Exo 2 Condensed ve ardından Fira Condensed olarak değiştirdiğim bir ilerleme kaydettim, her ikisi de elbette Helvetica'dan çok daha iyi sonuç veriyor.
paragraf araları
Şimdi Wix'in bir eksikliğinden kaynaklanan önemli bir konuya geldik. Çoğu web düzenleyicide, özellikle blog oluşturma platformlarıyla ilişkili olanlarda, düzenleyici otomatik olarak bir paragraf sonu yaptığınızda ek boşluk yaratmak için ek bir piksel değeri ayarlar. Wix kullanıcıları tarafından geniş çapta talep edilmiş olmasına rağmen, Wix'te bu şu anda mevcut değil.
Dolayısıyla, bunu yapmanın uygun bir yolu olmadığından, birçok kişinin yaptığı şey, paragraf sonunu göstermek için iki kez enter tuşuna basmaktır. Bu, metin gruplamasını çok kötü bir şekilde bölen paragraflar arasında büyük bir boşluk yaratır. Yapılacak doğru şey, paragrafları ayrı metin parçaları olarak yapıştırmak ve ardından aralarındaki boşluğu manuel olarak ayarlamaktır.
Aşağıdaki iki metin sütunu size farkı gösteriyor ve bunların altındaki ekran görüntüsü de, tam miktarı elde etmenize yardımcı olmak için aralığı manuel olarak ayarladığınızda açılan küçük mor işaretleri gösterir.
YANLIŞ
Get ready for a dining experience that is rich in taste as well as good nutrition since it has been created entirely out of organic products grown in season, locally.
Tekir Efendi, one of the most respected merchants of the old Istanbul Spice Market, sets sail to contemporary lifestyles through a diverse range of products and services catering to the needs and tastes of an urban chic clientele!
Our land is renowned for high quality cotton, linen and wool farming. We have entered collaborations with some of Turkey’s best known textile manufacturers to create our own line of home textiles, covering a wide range of items from bed linen to towels, rugs, dining accessories, and much more.
DOĞRU
Get ready for a dining experience that is rich in taste as well as good nutrition since it has been created entirely out of organic products grown in season, locally.
Tekir Efendi, one of the most respected merchants of the old Istanbul Spice Market, sets sail to contemporary lifestyles through a diverse range of products and services catering to the needs and tastes of an urban chic clientele!
Our land is renowned for high quality cotton, linen and wool farming. We have entered collaborations with some of Turkey’s best known textile manufacturers to create our own line of home textiles, covering a wide range of items from bed linen to towels, rugs, dining accessories, and much more.
Bu ekran görüntüsünde kırmızı oklarla gösterdiğim mor kılavuzlar, paragraflarınız arasında tam olarak eşit boşluk bırakmanıza yardımcı olabilir. Tek sorun: Bazen ortaya çıkarlar, bazen görünmezler.
sayfa hizaları
Bunu yapmanın yolunu bu sitedeki diğer sayfalarda anlattım ama yine burada da tekrarlayalım:
-
Bunu yapmak için üstbilgi öğelerini hizalama noktaları olarak kullanırız.
-
Kılavuzları logonuzun sol ve sağ tarafına yerleştirin.
-
Kılavuzları menünüzün sol ve sağ tarafına yerleştirin.
-
-
Başlıkları, paragrafları ve sayfanızdaki resimler, kutular gibi diğer öğeleri hizalamak için bu kılavuzları kullanın, çünkü bu kılavuzlar yalnızca başlıkta değil, sayfanızda da bulunacaktır.
-
Bu kılavuzlar tüm sayfalarınızda tam olarak aynı konumda olacağından, bunları tüm sayfalarda kullanın ve tüm sitenizde aynı olan evrensel bir hizalama elde edeceksiniz.
Sağdaki uzun ekran görüntüsünde, iki başlık öğesinin her iki tarafına yerleştirilen dikey kılavuzların sayfadaki bütün öğeleri hizalamak için nasıl kullanıldığını gösterdim ve şu anda üzerinde bulunduğunuz bu sayfanın iki bölümünü bir araya getirdim. .
Burada gördüğünüz şey sadece bu sayfa ama diğer sayfalara gittiğinizde aynı kılavuzları o sayfalarda da hizalamak için kullandığımı görebileceksiniz.
Butür sayfalar arası bir hizalama, sayfadan sayfaya süreklilik sağlaması açısından önemlidir, bu da ziyaretçilerinizin her yeni sayfada nereye bakacaklarını bilecekleri için içeriği takip etmelerini kolaylaştırır.