Web Sitenizde Kullanabileceğiniz 5 Web Uyumlu Yazı Tipi

Yayınlanan: 2020-10-07

Bir web sitesi sahibiyseniz, bir HTML yazı tipinin web sitenizde önemli bir rol oynadığını bilmelisiniz. Tüm web sitelerinin şu veya bu şekilde metin içeriği vardır, doğru bir şekilde seçilirse iyi bir yazı tipi sayfanızın estetiğini artırabilir ve içeriğin okunabilirliği üzerinde olumlu bir etkiye sahip olabilir, bu nedenle bir web sitesinin tasarımı ve geliştirilmesi gerçekten de bir tanesidir. herhangi bir işi başlatmak için en önemli hususlar. Kötü bir yazı tipi paketinizin performansını olumsuz etkiler, bu tamamen web uyumlu bir yazı tipi kullanıp kullanmadığınıza bağlıdır.

İçindekiler tablosu gösterisi
  • Web Uyumlu Yazı Tipi nedir?
  • Web Uyumlu Yazı Tipleri Neden Önemlidir?
  • Beş Yazı Tipi Ailesi nedir?
    • 1. El yazısı (örneğin, Zapf-Chancery)
    • 2. Fantezi (örn. Yıldız Savaşları)
    • 3. Serif (örneğin, Times New Roman)
    • 4. Sans-serif (örn. Helvetica)
    • 5. Monospace (örn. Courier)
  • Popüler Web Yazı Tipleri:
    • 1. Arial
    • 2. Times New Roman
    • 3. Helvetica
    • 4. Kurye
    • 5. Calibri
  • Gözden Geçirilecek Yazı Tipi Araçları
    • Yazı Tipi Çifti
    • wordmark.it
    • Yazı tipi ne
  • Web Siteme Web Uyumlu Yazı Tipleri Nasıl Eklenir?

Web Uyumlu Yazı Tipi nedir?

tipografi-yazı tipleri-karakter-harf-tasarım

Bir yazı tipi, yalnızca yazı tipi o cihazda yüklüyse herhangi bir tarayıcıda veya cihazda (cep telefonu, tablet vb.) okunabilir ve aynı görünür. Web uyumlu yazı tipleri, genellikle herhangi bir cihaza (bilgisayarlar, cep telefonları, oyun konsolları, tabletler ve akıllı TV'ler) önceden yüklenmiş olan yazı tipleridir.

Size önerilenler: Her Büyük Tasarımcının İhtiyacı Olan 20 Çarpıcı Logo Tasarımı Yazı Tipi.

Web Uyumlu Yazı Tipleri Neden Önemlidir?

logo-tasarım-yazı tipi-taslak

Mükemmel bir dünyada, web siteniz için istediğiniz herhangi bir yazı tipini seçebilirsiniz. Ancak, işletim sistemine bağlı olarak, cihazlar kendi önceden yüklenmiş yazı tipi seçimleriyle birlikte gelir. Sorun, tasarımlarının genellikle kullandığınız sisteme bağlı olarak farklılık göstermesidir. Windows'ta çalışan cihazların bir grubu olabilir, MacOS'un başka bir grubu olabilir ve ardından Google'ın Android'inin farklı bir sürümü olabilir.

Bir web sitesini açtığınızda, vitrinde gördüğünüz yazı tipi, tasarımcının amaçladığı yazı tipi olmayabilir. Anlamı: Diyelim ki tasarımcı nispeten belirsiz bir yazı tipi kullanıyor. Bu yazı tipi yüklü değilse, web siteniz sistem tarafından tanımlanan genel yazı tipine geri döner ve siz bunu bilmiyor olabilirsiniz, sizin için sadece hoş olmayan görünebilir.

Web uyumlu yazı tipleri, tüm sistemlerde bulunan bir yazı tipleri koleksiyonudur ve tasarımcı olarak size, cihazda gerekli yazı tipinin bulunmaması durumunda kullanılacak yazı tipini belirleme yeteneği verir. Web sitesinin çeşitli cihazlarda aynı görünmesini sağlamanıza olanak tanır.

Beş Yazı Tipi Ailesi nedir?

Photoshop Yazı Tipleri ÜCRETSİZ! Öne Çıkanlar

Tipografide, tüm yazı tipleri, tasarım benzerliklerine göre beş yazı tipi ailesinden birine kategorize edilir. Bunlar aşağıdaki gibidir:

1. El yazısı (örneğin, Zapf-Chancery)

Web Uyumlu Yazı Tipleri - 1. Nokta

Cursive yazı tipi ailesi, genellikle akıcı bir şekilde birleştirilen harflerle insan el yazısını taklit eder. Genellikle kaligrafi ve daha hızlı yazı yazan kişilerle ilişkilendirilir.

2. Fantezi (örn. Yıldız Savaşları)

Web Uyumlu Yazı Tipleri - 2. Nokta

Fantasy yazı tipi ailesinin yazı tipleri genellikle her harfte dekoratif öğelere sahiptir ancak yine de karakteri temsil eder. Birçok kurgusal kitap ve filmin başlığı, içeriğin nüansını güçlendirmek için bu aileden gelen yazı tiplerini kullanır.

3. Serif (örneğin, Times New Roman)

Web Uyumlu Yazı Tipleri - 3. Nokta

Serif yazı tipi ailesinin en dikkat çekici özelliği, bir harf veya semboldeki büyük bir çizginin sonundaki küçük çizgidir. Bir zarafet ve formalite duygusu yaratır. Bir dizi web sitesi tarafından gövde metni için yaygın olarak kullanılır.

4. Sans-serif (örn. Helvetica)

Web Uyumlu Yazı Tipleri - 4. Nokta

Serif ailesindeki yazı tiplerinin aksine, Sans-serif ailesinin yazı tiplerinde her harfin yanında küçük bir çizgi yoktur. Bu aileye ait yazı tiplerinin çoğu benzer çizgi genişliğine sahiptir, bu da onu minimalist ve modern kılar.

5. Monospace (örn. Courier)

Web Uyumlu Yazı Tipleri - 5. Nokta

Monospace yazı tipi ailesinde her harf ve sembol yatay olarak tam olarak aynı alanı kaplar. Böylece tutarlı ve kolay ayırt edilebilir hale gelirler, bu nedenle sıklıkla daktilolarda ve son zamanlarda bilgisayar terminallerinde kullanılmaktadırlar.

Şunlar hoşunuza gidebilir: Denemeniz Gereken 11 Muhteşem Photoshop Yazı Tipi (ÜCRETSİZ!).

Popüler Web Yazı Tipleri:

web tasarımı-blog-wordpress-yazı tipi-tipografi-özelleştirici

Artık yazı tipleriyle ilgili bir fikir edindiğimize göre, aşağıda web sitenize ekleyebileceğiniz 5 popüler web uyumlu yazı tipi bulunmaktadır:

1. Arial

Arial yazı tipi

Hem çevrimiçi hem de basılı medyada en yaygın kullanılan sans-serif yazı tiplerinden biri. Fiili standarttır. OpenType sürüm 3.0 bunu şu şekilde tanımlar:

“Çağdaş bir sans serif tasarımı olan Arial, seleflerinin çoğundan daha hümanist özellikler içerir ve bu nedenle yirminci yüzyılın son on yıllarının havasıyla daha uyumludur. Eğrilerin genel olarak işlenmesi, endüstriyel tarzdaki sans serif yüzlerin çoğundan daha yumuşak ve dolgundur. Yüze daha az mekanik bir görünüm kazandırmaya yardımcı olan terminal vuruşları çapraz olarak kesilir. Arial, raporlarda, sunumlarda, dergilerde vb. metin düzeninde ve gazetelerde, reklamlarda ve promosyonlarda teşhir kullanımında eşit başarı ile kullanılabilen son derece çok yönlü bir yazı tipi ailesidir.”

Ayrıca Google dokümanlarında varsayılan yazı tipidir.

2. Times New Roman

Times-New-Roman-yazı tipi

Times New Roman, Serif yazı tipi ailesinden eski Times yazı tipinin bir çeşididir. İngiliz gazetesi 'The Times' tarafından 1931'de sipariş edildi ve baskı ekipmanı şirketi Monotype'ın sanat danışmanı Stanley Morison tarafından tasarlandı ve Time's Advertising kolunun yazı departmanından Victor Lardent ile işbirliği yaptı. Tüm zamanların en popüler yazı tiplerinden biri olarak ortaya çıkmıştır ve çoğu cihaza önceden yüklenmiştir.

Times New Roman'ın adındaki Roman, Times New Roman yazı tipi ailesinin tasarlanacak ilk parçası olan roman stiline bir göndermedir. Kökenleri 15. yüzyılın sonları ve 16. yüzyılın başlarındaki İtalyan matbaacılığına dayanmaktadır, tasarımın Roma veya Romalılarla hiçbir bağlantısı yoktur.

3. Helvetica

Helvetica yazı tipi

Helvetica veya Neue Haas Grotesk, Sans-serif Yazı Tipi ailesinden yaygın olarak kullanılan bir yazı tipidir. 1957'de Swiss Font tasarımcısı Max Miedinger tarafından Eduard Hoffmann'ın katkılarıyla geliştirildi. Yüksek bir x-yüksekliği, yatay veya dikey çizgiler üzerinde vuruşların sonlandırılması ve harfler arasında çok alışılmadık bir dar boşluk içeren neo-grotesk bir tasarımda tasarlanmıştır; bu, ona sağlam, yoğun bir görünüm vermek için birleşir. Orijinal olarak büyük bir netliğe sahip, formda içsel bir anlamı olmayan ve çeşitli tabelalarda kullanılabilen ve Neue Haas Grotesk (Yeni Haas Grotesk) olarak adlandırılan nötr bir yazı tipi olarak kullanılmak üzere tasarlanmış, hızlı bir şekilde Linotype tarafından lisanslanmış ve 1960 yılında Helvetica olarak yeniden adlandırılmıştır. , İsviçre için Latince. Yazı tipi, tarafsızlığı nedeniyle tasarımcılar tarafından sevilir ve Jeep, Kawasaki, Motorola ve BMW gibi birçok ünlü marka tarafından tercih edilir.

4. Kurye

Kurye yazı tipi

Courier yazı tipi, Serif yazı tipi ailesine ait bir yazı tipidir. Orijinal olarak IBM'in daktiloları için Howard “Bud” Kettler tarafından tasarlanan bu yazı, bir bilgisayar yazı tipi olarak kullanılmak üzere uyarlanmıştır ve neredeyse tüm bilgisayarlarda kurulu olarak gelir. Monospace dizgisi nedeniyle, 1990'larda elektronik ve bilgisayar endüstrisinde karakter sütunlarının tutarlı bir şekilde hizalanması gereken yerlerde, örneğin herhangi bir tür kodu yazmak veya tasvir etmek için varsayılan yazı tipinin olduğu kodlamada yeniden kullanım alanı buldu.

Endüstri standardına göre, tüm senaryolar 12 punto Courier ile yazılacaktı. ABD Dışişleri Bakanlığı, Ocak 2004'e kadar tüm belgeler için standart yazı tipi olarak kullandı. Dijital endüstrilerde artan kullanımla birlikte, Courier, daha büyük noktalama işaretleri, benzer karakterler arasında daha güçlü ayrımlar (0 / rakamı gibi) gibi özelliklere sahip değişkenler geliştirdi. Ekranda daha fazla okunabilirlik için büyük harf O ve rakam 1 / küçük harf L), vb.

5. Calibri

Calibri yazı tipi

Calibri yazı tipi, Lucas de Groot tarafından 2002-2004 yıllarında tasarlanan Sans-serif yazı tipi ailesinin bir üyesidir. 2007'de Microsoft Office 2007 ve Windows Vista ile birlikte piyasaya sürüldü. Office 2007'den başlayarak, MS Word'de varsayılan yazı tipi olarak Times New Roman'ın ve MS Powerpoint, MS Excel, Microsoft Outlook ve WordPad için varsayılan yazı tipi olarak Arial'ın yerini almıştır. Metnin sıvı kristal ekranlarda (LCD'ler) daha net okunmasını sağlamak için Microsoft'un ClearType metin işleme sistemiyle çalışmak üzere tasarlanmış ClearType Yazı Tipleri Koleksiyonunun bir parçasıdır.

Gözden Geçirilecek Yazı Tipi Araçları

araçlar-konfigürasyon-ayarlar-parça-gereksinimi

Web sitenizde kullanmadan önce farklı yazı tiplerini test etmek için kullanabileceğiniz bir dizi çevrimiçi araç vardır. Mevcut yazı tipi türlerini keşfetmek istiyorsanız veya hangi yazı tipini kullanacağınızı seçmekte zorlanıyorsanız, bu araçlar çok yardımcı olacaktır.

Yazı Tipi Çifti

Web Uyumlu Yazı Tipleri - 1. Nokta

Font Pair, tipografi ile ilgili birçok kaynağa sahip niş bir web sitesidir. Yazı tipleri için çeşitli e-Kitaplar, kılavuzlar, incelemeler, videolar ve eklenti önerileri vardır. Google'da bulunan en popüler yazı tiplerine ayrılmış bir bölümleri ve hangi yazı tiplerinin birlikte en iyi olduğuna dair derinlemesine bir karşılaştırmaları var.

wordmark.it

Web Uyumlu Yazı Tipleri - 2. Nokta

Wordmark.it, metninizin belirli bir yazı tipiyle veya hatta birden fazla yazı tipiyle birlikte nasıl görüneceğine dair hızlı bir önizleme sunar. Metni çubuğa girin ve işte size farklı yazı tipleriyle nasıl göründüğünü gösterecek.

Yazı tipi ne

Web Uyumlu Yazı Tipleri - 3. Nokta

WhatTheFont, Metin için Ters Görsel Aramanın Görseller için ne anlama geldiğini ifade eder. Gördüğünüz bir yazı tipini tanımlamanıza yardımcı olur. Sadece yazı tipinin resmini yükleyin ve onu veritabanlarıyla eşleştirecek ve size en yakın eşleşme olduğuna inandığı şeyi verecektir. Yazı tiplerini ve hatta genel tipografik sorguları belirleme konusunda yardım almak için aktif forumlarına da gidebilirsiniz.

Bunları da beğenebilirsiniz: WordPress Site Temanıza Özel Yazı Tipleri Eklemenin 3 Farklı Yolu.

Web Siteme Web Uyumlu Yazı Tipleri Nasıl Eklenir?

Sonuçları değerlendirmek için kendinize üç soru sorun

Artık web uyumlu bir yazı tipi seçtiğinize göre, onu uygulama zamanı. Çok az programlama deneyiminiz varsa, web sayfanıza web uyumlu bir yazı tipi eklemek için şu adımları izleyin:

1. header.php dosyanızı açın.

2. Yazı tipi kaynağını/standart kodunu kopyalayın. Bunu genellikle Google aracılığıyla bulabilirsiniz.

kod-1

3. Kodu başlık dosyanızın en üstüne yapıştırın.

4. style.css dosyanızı yükleyin, seçtiğiniz yazı tipi metnini değiştirmek için yazı tipi kodunu girin.

kod-2

Sonunda, stil sayfanız şöyle görünmelidir:

kod-3
Yazar-Resim-Abhyank-Srinet
Bu makale Abhyank Srinet tarafından yazılmıştır. Abhyank, ESCP Europe'dan İşletme Yüksek Lisans derecesine sahiptir ve Enstrümantasyon ve Kontrol alanında uzmanlık ile bir mühendislik derecesine sahiptir. Dijital ortama olan ilgisi, onu erken kariyer yüksek lisans derecesi hakkında kaliteli bilgileri yaymaya odaklanan uygulama danışmanlığı (MiM-Essay) için çevrimiçi bir başlangıç ​​oluşturmaya motive etti.