o Baskı Ölçüleri: 1 punto = 0,376 mm, 72 Giriş punto (point) = 6 pika (pica) = 1 inç
Yazının kullanılmaya başlamasıyla birlikte basılı ve basılı (inch) olmayan ortamlarda yazıların farklı şekillerde • Descender (Alt): Harfin satır çizgisinin alt gösterilmesi, yazıya sanat katılması sürecine geçilmiştir. kısmında yani gövde kısmının (x-Height) alt Bu bağlamda “yazı ile sanat yapmak” anlamına gelen bölgesinde kalan kuyruk kısmıdır. tipografi kavramı ortaya çıkmıştır. • Ascender (Üst): Harfin gövde kısmının (x-
Yazı görselleştirilerek insanların ilgisi çekilmeye Height) üst kısmında kalan çıkıntıdır.
çalışılmış ve kitaplarda, gazetelerde, dergilerde, reklam Reklam amaçlı çalışmalarda tipografi özellikle iki amaçla bültenlerinde ve film afişlerinde çeşitli tipografiler kullanılmaktadır. Bunlardan birincisi verilmek istenen kullanılmaya başlanmıştır. Tipografik ögeler basılı mesajı ikna edici kılmaktır. İkincisi ise mesajı dikkat medyada sıklıkla kullanırken; teknolojinin gelişmesiyle çekici bir hale getirmektir. Bu anlamda, tipografinin birlikte dijital ortamlarda her tür platforma ve her boyuta sadece font seçimi olmadığını bilmek gerekir. Aksi halde, rahatlıkla uyum sağlayabilen dijital içerikler verilmek istenen bir mesajdaki diğer görseller ne kadar iyi üretilmektedir. olsa da iyi bir tipografik görsel oluşturulmamışsa,
Tipografi ve Tipografi ile İlgili Temel Kavramlar reklamın istenen etkiyi yaratamayacağı söylenebilir.
Yunanca typos (form) ve graphia (yazmak) kelimelerinden Tipografi ile Anlam Yaratma ve Tipografik türetilen tipografi kavramı en basit açıklamasıyla forma Vurgular uygun yazmaktır. Tipografi, harf, sözcük ve satırlarla, Bir metinde verilmek istenen mesajın doğru şekilde boşluklarının düzenlenmesi gereken diğer ögelerle iletilebilmesi için dikkat edilmesi gereken noktalardan en belirlenmiş bir sayfa üzerinde yapılan görsel ve işlevsel önemlisi sayfa yapısında hiyerarşik düzendir. Hiyerarşik düzenlemelerdir. Bir başka tanımla, izleyiciye sözel düzenden kasıt başlık, alt başlıklar ve metin sıralamasının mesajları iletmek için tasarlanmış harfler, rakamlar ve doğru bir şekilde yapılmasıdır. Sayfalardaki hiyerarşik noktalama işaretlerinin iki boyutlu yüzeyler üzerinde, tek düzenin sağlanması için harf büyüklüklerine, yazı başlarına, kelimeler ya da metinler olarak hangi büyüklük karakterlerinin farklılıklarına ve bold, italik gibi şekilsel ve türde kullanılacaklarını ve bir araya geleceklerini değişkenlere dikkat edilmelidir. Hiyerarşik düzenlemelerin belirleyen kurallar sistemidir. Tipografi, bilgi ve mesajın yanı sıra yazı biçimi, yazı karakterleri, yazı ailesine de anlaşılabilir bir form diliyle iletilmesinin yanı sıra bir tarz, dikkat edilmelidir. kişilik, görsel bir dil ve farklı imge olarak ortaya konan elemanlar olarak yazı karakteri boyutu ortaya çıkmaktadır. Yazı Biçimi: Sayfa tasarımında sadece harflerin kullanıldığı ve bu kullanımda büyük ve küçük harf Tipografi dalında uzmanlaşmış bireylere tipograf denir. dizisinin sayfa hiyerarşisine göre doğru bir şekilde Tipograflar; grafik tasarımı, reklamcılık ve web tasarımı kullanılmasıdır. gibi görsel mesajların ağırlıklı olduğu iş kollarında görev yapmaktadırlar. Yazı Karakteri: Metinde kullanılan harflerin, rakamların, işaretlerin, sembollerin aynı biçimsel özellik ve oranlara Tipografi ile ilgili temel kavramlar aşağıdakilerdir: göre seçilerek kullanılmasıdır. Metnin okunurluğu
• Serif: Karakterlerin uç kısımlarındaki tırnaklı açısından karakterlerin birbirinden ayırt edilerek kısımları ifade eder. algılanması açısından harflerin oranları önemlidir. • Sans Serif: Tırnaksız karakterleri ifade eder. Alfabedeki harflere bakıldığında en dar harfin “I” en geniş • Leading: Metindeki satırlar arası boşluğu ifade harfin ise “M” olduğu görülmektedir. Bu bağlamda harfler eder. arasındaki boşlukların da harf genişliklerine göre düzenlenmesi anlam oluşturmada önemlidir. Bir başka • Kerning: Metni oluşturan harfler arasındaki ifade ile yazı karakterlerini bilmenin sağlayacağı fayda boşluğu ifade eder. harflerin birbirinden farklı şekilsel yapıda olduklarını • Tracking: Bir satır içindeki karakterler arası bilerek ona göre aralarındaki boşluğu ayarlayabilmektir. boşluktur. • Baseline: Metni oluşturan harflerin kuyruklarının Yazı Ailesi: Yazı karakterlerinin yanı sıra anlam dâhil edilmediği tabanı ifade eder. oluşturabilmek için yazı ailesinin de bilinmesi • x-Height: Metni oluşturan küçük harflerin kuyruk gerekmektedir. Bu bağlamda, metni oluşturan ve harfin üst çıkıntısı dışında kalan gövdesinin karakterlerin anlam oluştururken vurgu yapılmasını yüksekliğini ifade eder. sağlamak amacıyla biçimsel özelliklerine dikkat • Type Size: Metni oluşturan harflerin, edilmelidir. Yazı ailelerine bakıldığında Serif (Tırnaklı), karakterlerin boyutunu ifade eder. Tipografik Sans Serif (Tırnaksız) ve Typewriter (Daktilo) olarak üç ölçü birimleri dijital ve baskı için ayrı ayrı sınıflandırma altında toplandığı görülmektedir. Yazı aşağıdaki gibi ifade edilir: ailelerinin karakterlerinin biçimsel özelliklerine o Dijital Ölçüler: 12 punto (point) = 1 em bakıldığında farklı kalınlıklardaki uyarlamaları extra light (pica) (çok ince), light (ince), book, demi (yarım), medium
(orta), bold (kalın), extra bold (çok kalın), heavy (ağır) ve • Metinde kullanılan yazı fontları, metnin vermek ultra (aşırı)’dır. Farklı kalınlıklara sahip bu uyarlamaların istediği mesajın önüne geçmemelidir. condensed (yoğunlaştırılmış), regular (normal) ve • Metin içerisinde duruma göre farklı fontlar tercih extended (seyreltilmiş) uyarlamaları, farklı açılara sahip edilebilir. Fakat okunurluğu azaltacak ve dikkat roman (dik) ve italik (eğik) uyarlamaları ile işleme dağıtacak şekilde fazla font kullanılmamalıdır. seçenekleri outline (kontür), shaded (gölgeli), decorated • Kullanılan fontların baskıya uygun olması (süslü) de bulunmaktadır. gerekmektedir.
Metni oluştururken karakterlerin biçimsel özelliklerinin ve Dan Mayer’in font seçimi için belirlemiş olduğu beş kural: oranlarının yanı sıra metnin okunurluğu açısından harfler, sözcükler ve satırlar arasındaki boşluk da önemlidir. Bu • Duruma uygun seçim boşluk düzenleri aşağıdaki gibi açıklanabilir: • Font ailelerini bilme • Arka planın metnin önüne geçmemesi • Harf Boşluk Düzeni: Okunurluğu artırabilmek • Kullanım amacına göre seçim için büyük puntolarla yazılan başlıkların harf • Kuralsızlık aralıklarının doğru bir şekilde düzenlenmesi önemlidir. Harf aralarındaki boşlukların ne çok Büyük ve Küçük Harf Kullanımı: Uygun font az ne de çok fazla olmamasına dikkat edilmelidir. belirlendikten sonra metin içerisinde büyük ve küçük harf • Sözcük Boşluk Düzeni: Metni oluşturan kullanımına dikkat edilmelidir. Metni komple büyük sözcüklerin arasındaki boşluklar “ı” harfinin harflerle yazmak metnin okunurluğunu azalttığı gibi yazılı genişliği kadar olmalıdır. Başlıkların daha iyi iletişimde büyük harf ile yazmak, karşı tarafa bağırarak algılanması ve bütünün algılanması sağlanarak konuşmak anlamına da gelmektedir. Diğer taraftan, daha akıcı bir okuma için sözcükler arasındaki devamlı aynı şekilde hiç hareketsiz ilerleyen yazı da boşluklar azaltılır. okuyucuda sıkıcılığa sebep olacak ve belli bir zaman sonra • Satır Boşluk Düzeni: Bir metinde satırlar arası okumayı bırakacaktır. Bu nedenle, büyük harfler boşluk düzenlenirken boşluğun ne çok az ne de başlıklarda ve cümle başında, sadece büyük harflerden çok fazla olmamasına dikkat edilmelidir. Metni oluşan yapılar ise kısa uyarılarda, yönlendirme okuyan bir kişi satır boşluklarından kaynaklanan levhalarında, emir cümlelerinde kullanılmalıdır. Bu sorundan dolayı aynı satırı tekrar okumamalı ya durumlar dışında metnin devamında alt ve üst kuyruk da satır atlayarak başka satırlara geçmemelidir. yapıları sayesinde gözü tekdüzelikten kurtaran ve metnin Satır aralıkları düzenlenirken harflerin alt okunurluğunu arttıran küçük harfler tercih edilmelidir.
(descender) ve üst (ascender) uzantılarının Boşlukları Düzenleme: Metni oluşturan sözcüklerin ve satırlarda kaybolmaması da önemlidir. İdeal satır sözcükleri oluşturan kelimelerin arasındaki boşluklar ile arası boşluk ölçüsüne harfin punto değerine 2 satırlar arasındaki boşluklar da tipografi seçiminde dikkat eklenerek ulaşılır. edilmesi gereken önemli noktalardan biridir. Bir metinde
Tipografik Kurallara Dayalı Tipografi Seçimi boşluklar düzenlenirken dikkat edilmesi gereken hususlar şu şekilde sıralanabilir: Bir tasarım yapılırken görsellerin kullanılması kadar doğru tipografi seçimi de metin okunurluğunun sağlanması • “Sözcükler arasında” ve “noktalama açısından çok önemlidir. Tipografi seçiminde takip işaretlerinden sonra” bir boşluk bırakılır. edilmesi gereken adımlar sırasıyla aşağıdaki gibidir: • “Harf arası” ya da “satır arası” boşluk gereğinden 1. Font Seçimi fazla arttırıldığında/azaltıldığında okuma güçlüğü 2. Büyük ve Küçük Harf Kullanımı doğar. 3. Boşlukları Düzenleme • Paragraf boşluğu verildiği durumlarda satırların 4. Metni Düzenleme arası ayrıca açılarak paragraf vurgulanmaya 5. Yayınlanacak Ortamı Seçme çalışılmaz.
Font Seçimi: Metnin okunurluğunda öncelikli olarak font Metni Düzenleme: Oluşturulan metnin sayfada doğru seçiminin doğru yapılması gerekmektedir. Font seçimi şekilde konumlandırılması okunurluğu artıracaktır. Göz, aşaması en zor aşamadır. Çünkü bu aşamada metin sayfada aynı yapıda hareket etmek isteyeceğinden, metnin yazarlarının karşısına yüzlerce font çıkmaktadır. Font satırlarının aynı hizada başlaması metni okuyan kişi için seçiminde dikkat edilecek hususlar şu şekilde sıralanabilir: faydalı olacaktır. Metni düzenlerken dört farklı hizalama ya da bloklama tekniği kullanılır. • Yazının yazılma amacına göre font seçimi değişiklik gösterir. Formal bir metin için • Sola Yaslı (Soldan Blok, Sola Hizalı): Metnin geleneksel fontlardan serif’li yazı fontu tercih sola yaslanması ile oluşturulan her satırın aynı edilebilirken; informal bir metin için modern başlangıç noktasında başladığı ve sonunun farklı fontlardan olan sans serif’li yazı fontu tercih olabildiği sayfa düzeni yapısıdır. Soldan sağa edilmelidir. doğru okuma düzeni, gözün her satırda aynı başlangıç noktasına dönmesini sağladığından
dolayı okunurluğu artıran ve gözü yormayan bir görüntülenmesi sağlanmaktadır. Hazırlanan düzendir. içeriğin esnek tasarıma uygun şekilde • Sağa Yaslı (Sağdan Blok, Sağa Hizalı): Metnin görüntülenebileceği sayfa yapılarının sağa yaslanması ile oluşturulan ve her satırın oluşturulması için ücretsiz ya da ücretli olan farklı başlangıç noktalarından başladığı fakat birçok tipografi paketi bulunmaktadır. satır sonlarının eşit olduğu sayfa düzeni yapısıdır. Tipografi Paketleri Soldan sağa doğru okuma düzeninde gözün her satırda farklı başlangıç noktalarına hareket Özellikle 21. yüzyılın ilk çeyreğinde internete edeceğinden dolayı okunurluk azalır ve göz ulaşılabilecek iletişim teknolojileri çok çeşitlenmiştir. yorulur. Akıllı telefonlar, tabletler, masaüstü̈ bilgisayarlar, akıllı
• Ortaya Hizalı (Ortadan Blok): Metnin ortadan televizyonlar bunlara örnektir. Bunların hepsinin ekran hizalanması sonucunda satırların başlangıç ve büyüklükleri de birbirinden farklı olabilir. Tipografi bitiş noktaları farklı olacaktır. Genellikle paketlerinin çoğunluğu ise herhangi bir sorun yaşamadan başlıklarda tercih edilir. bütün bu ekranlarda yazılı metinlerin kullanıcılar • Her İki Yana Yaslı (Her İki Taraftan Blok, Her tarafından okunmasını sağlayabilirler.
İki Tarafa Hizalı): Metnin sağ ve sol sütunlara Tipografi paketlerinin temelini Cascading Style Sheets yaslanmasıyla oluşturulan sayfa yapısıdır. (CSS) oluşturmaktadır. CSS, HTML yapısındaki web Başlıklarda tercih edilen bir yapıdır. sayfalarında metin ve format biçimlendirme alanında
Okuma düzeni soldan sağa doğru olan dillerde yazılan olanaklar sunan bir web teknolojisidir. Web sayfaları için içeriğin sunulmasında sola yaslı ya da her iki tarafa yaslı hazır şablonlar sunduğu gibi bağımsız olarak harflerin yapılar tercih edilirken; başlık ve türevlerinde ortaya ya da stilini, yani renk, yazı tipi, büyüklük gibi özelliklerini her iki yana yaslı yapılar tercih edilir. değiştirmek için de kullanılabilir. Bu tekniğin en önemli özelliği kullanımındaki esnekliktir. Yayınlanacak Ortamı Seçme: Tipografi seçiminde dikkat edilmesi gereken en önemli noktalardan biri metnin Web sayfası tasarımında esnek tasarımı sağlayan başlıca yayınlanacağı ortamın belirlenmesidir. Basılı ortamda tipografi paketleri Bootstrap, Skeleton, Cardinal, Concise, yayınlanacak metinlerin düzenlenmesinde ilk dört kural Furtive, BassCSS, Mueller, vb.dir.
takip edilebilir. Fakat metnin basılı olmayan elektronik Bootstrap: HTML, CSS ve JavaScript çerçevesi için ortamda (yani web ortamında), yayınlanması durumunda geliştirilmiş esnek ve mobil cihaz uyumlu web yayınlanacak ortamda kullanılan yazılımın alt yapısı, biçimlendirme çatısıdır. www.getbootstrap.com üstünlükleri ve sınırlıklarının yanı sıra içeriğin adresinden .zip dosyası indirilerek web tasarımı görüntüleneceği ekran büyüklüğü önemlidir. Web çalışmalarında kullanılabilir. Bootstrap, tipografi için ortamında kullanılan tasarım yapıları şunlardır: CSS, ön işlemci olarak Less ve Sass’ı tercih etmektedir.
• Sabit (Fixed) Tasarım: İçeriğin bulunduğu web Less, Bootstrap ile geliştirilecek tasarımlarda CSS kodları sayfalarının tasarlanırken sayfa genişliğinin sabit ile kolaylıkla kullanılabilir. Sass için aynı durum söz ölçülerle yapılması ve görüntüsünün farklı konusu değildir, zira dosyaları indirip tasarım projesinin araçlarla etkili bir şekilde görüntülenememesidir. içerisine kurmak gerekmektedir. Bootstrap ile hazırlanan Bu tarz tasarımlar, küçük ekranlı araçlarda web tasarımlarında tek çerçeve ile bütün cihazlarda uyum görüntülenirken sayfayı sağa sola kaydırarak sorunu olmadan projeleri yayınlamak mümkündür.
sayfa içeriği net şekilde okunabilir. Skeleton: Daha küçük web tasarımı projelerinde • Akışkan (Fluid) Tasarım: İçeriğin bulunduğu web kullanılabilecek tipografi paketidir. www.getskeleton.com sayfalarının genişliği yüzde (%) oranlar adresinden .zip dosyası indirilerek web tasarımlarında kullanılarak geliştirilir. Bu tarz tasarımlarda kullanılabilir. Skeleton, standart HTML elementleri sütunlar tarayıcıların izin verdiği ölçüde aşağı stillerini kullanır ve ızgara (grid) yapısını içerir. Izgara yukarı olacak şekilde ölçeklenir. Böylece, içerik yapısı, genişliği en fazla 960px olan bir yapıyı 12 sütunluk görüntülenmeye çalışılırken ekranda sağa sola akışkan ızgaralara dönüştürür. Bu sayede en geniş sayfa gitmeye gerek kalmaz. yapısı tek satır CSS kodu ile tek sütun olacak şekilde • Uyarlanabilir (Adaptive) Tasarım: Belirli araç yeniden ölçülendirilir ve küçük cihazlarda sayfa yapısı ölçülerine göre tasarım yapılan tasarımdır. Ekran sağlıklı görüntülenebilir. Skeleton’da tipografi, “rems” ile boyutu farklı olan her dijital araç göz önünde ayarlanır. Bu şekilde yazıların boyutu ve özel ilişkileri tek bulundurulmalıdır. HTML kodu ile esnek yapıda olabilir ve tüm boyutlardaki • Esnek (Responsive) Tasarım: Esnek tasarım, cihazlarda görüntülenebilir. sayfa yapılarının bütün dijital araçlarda sağlıklı Cardinal: Modüler yapıda olan ve mobil cihazlar için görüntülenmesi için gerekli olan tasarımdır. Bu performans ve ölçeklenebilir yapıda geliştirilmiş CSS tasarım ile sayfa yapıları dijital araçların ekran çerçevesidir. www.cardinalcss.com adresinden .zip boyutları ve çözünürlüklerine bağlı kalarak dosyası indirilerek web tasarımlarında kullanılabilir. ölçeklendirilmekte ve sayfaların sağlıklı şekilde
Cardinal’in amacı, web tasarımcılarının esnek, kullanıcı 2. Bootstrap dosyası indirildikten sonra aynı dostu arayüze sahip uygulamalar için kolaylıkla sayfanın alt kısmında bulunan “Basic Templates” ölçeklenebilir ve sürdürülebilir CSS yapısı oluşturmalarını başlıklı kısımdaki kodlar kopyalanarak bir html sağlamaktır. Cardinal’in benimsendiği modern sayfası oluşturulur. yaklaşımlardan biri CSS Box Model’dir. Bu sayede a. Bu aşamada, kopyalanan html kodları ile sayfadaki ögelerin genişlik ve yükseklikleri kolaylıkla bir web sayfası oluşturmak için belirlenebilir. Bootstrap’te olduğunu gibi ön işlemci olarak Dreamweaver programı kullanılabilir. Less CSS yapısını kullanmaktadır. b. Burada dikkat edilmesi gereken nokta oluşturulan html sayfasının HTML5 Concise: Sürdürülebilir CSS yollarından en önemli sayfa özelliğinde olmasıdır. adımlar olan Sass, Less ve Stylus temelli CSS 3. Oluşturulan HTML5 sayfasına Bootstrap için çerçevesidir. Bunun yanı sıra basit CSS yapısı da tercih hazırlanacak olan “Basic Template” kodu edilebilir. www.concisecss.com adresinden .zip dosyası eklendikten sonra kaydedilir. indirilerek tasarımlarda kullanılabilir. Web tasarımında a. Dreamweaver’da oluşturulan HTML5 gereksiz kodlarla yapıyı şişirmeden ihtiyaç ̧ duyulan sayfası, masaüstünde oluşturulan klasöre eklentilerin kolaylıkla eklenebildiği bir yapıdır. Temel kaydedilir. kullanımda gerekli olan başlık, paragraf, tablolar, formlar b. Kaydetme işleminden sonra daha önce ve butonlar gibi ögeleri içinde barındırmaktadır. indirilen .zip’li Bootstrap dosyasının Furtive: Izgara yapısının ve ögelerin boyutlandırılmasında içindeki dosyalar HTML5 sayfasının rem parçası için Flexbox ve SVGs kullanımı gibi gelişmiş kaydedildiği klasöre taşınır. web standartları etrafında geliştirilmiş CSS çerçevesidir. c. Oluşturulan HTML5 dosyası ile www.furtive.co adresinden .zip dosyası indirilerek web Bootstrap dosyalarının aynı klasörde yer tasarımlarında kullanılabilir. Furtive, eski tarayıcıların alması daha önce “Basic Template” desteklemediği küçük CSS ayak izine sahiptir ve CSS bölümünden alınan kodlarla indirmeleri için gerekli olan bant genişliğini kesmektedir. gerçekleştirilen CSS dosyalarını Gelişmiş web tasarımı projelerinde kullanılmak üzere bağlama ile web sayfasının sorunsuz geliştirilmiş yapıdır. Esnek ızgara yapısıyla sayfa yapıları çalıştırılması sağlanmıştır. Bu sayede, rahatlıkla cihaz boyutuna göre ölçeklenebilir. web sayfasında görünmesini istediğimiz içeriklere Bootstrap dosyasının içindeki BassCSS: Esnek uygulamaları yapmak için temel stil, CSS dosyaları ile şekillendirmeler yardımcı programlar, ana hat ve renk stili ögelerinin yapılabilecektir. oluşturulmasını sağlayan CSS çerçevesidir. Bu çerçeveyi 4. Kod kısmında el ile kodlama yapılabileceği gibi kullanmak için herhangi bir .zip dosyası indirmeye gerek Bootstrap dosyalarının indirildiği yoktur. Web üzerinden sağlanan CSS dosyasının HTML www.getbootstrap.com adresinde “Components kodları kullanılarak tasarım bağlanılabilir. CSS dosyasının (Bileşenler)” sekmesinden tipografi paketlerine içerdiği stil kolay bir şekilde kişiselleştirilebilir ve ulaşmak mümkündür. Burada bulunan kodları tipografi ile oynamalar yapılabilir. kullanarak web şablonunda bulunması gereken
Mueller: Sass ve Compass temelinde yapılmış esnek ögeler sayfaya rahatlıkla eklenebilmektedir. modüler ızgara sistemidir. www.muellergridsystem.com a. “Components (Bileşenler)” sekmesinde adresinden .zip dosyası indirilerek web tasarımlarında bulunan bileşenleri kullanarak bir sayfa kullanılabilir. Mueller ile ya HTML ögelerine sınıf düzenlemek istenildiğinde, sayfanın eklenerek ya da tercihe bağlı olarak düzenli HTML ögeleri sağındaki bileşenler seçilerek kodları “grid()” fonksiyonu kullanılarak ızgara yapılabilir. kopyalama yoluyla html uzantılı Mueller ızgarası, Masonry JS Kütüphanesi ile sıralı HTML5 sayfasına eklenebilir. Bu kullanılabilir. sayede sayfalar kolaylıkla üretilebilir.
Yukarıda belirtilen tipografi paketlerinin yanı sıra Tuktuk, Bootstrap gibi tipografi paketleri ile hazırlanan web Base, Toast, CSS Lint, CSS Prism, PCSS, Normalize.css şablonlarının en önemli özelliği her platformda ve her gibi daha birçok tipografi paketi bulunmaktadır. Web boyuttaki cihazda görüntülenmesinde sorun yaşanmaması tasarımı projesinin amacına uygun olarak bu paketlerden ve altta bulunan gezinme çubuğu yerine içeriğin sayfaya herhangi biri tercih edilerek web sayfası geliştirilebilir. sığdırılmasıdır. Aynı içeriğin tablet bilgisayarlarda ve akıllı telefonlarda görüntülenmesinde de sorun Tipografi Paketi ile Web Sayfası Oluşturma oluşmamaktadır. Ekran boyutuna ve cihazın sahip olduğu
Bootstrap tipografi paketi kullanılarak bir web şablonu işletim sistemine göre sayfa yapısı iyileştirilmekte ve hazırlamak için aşağıdaki adımlar izlenmelidir: görüntülenmesi sağlanmaktadır.
1. Bootstrap’e ait .zip dosyası www.getbootstrap.com adresinden “Download Bootstrap” düğmesine basarak indirilir.