HTML yazı tipleri (veya web yazı tipi) için tam kılavuzunuz
Web sitenizin markası ve görünümü için en önemli şey varsa, bu sadece bir yazı tipi olabilir. Seçilen harf türleri, kişiliği aktarabilir, uzun metnin okumasını kolaylaştırabilir ve markanızı insanların zihninde güçlendirebilir.
Ücretsiz demoyu deneyin
Ancak eski yazı tipini indirip web sitenizde kullanamazsınız. Önceden düşünülmesi gereken birkaç şey var. Web yazı tiplerini nerede bulabilirsiniz, hangi yazı tipleri HTML ile uyumludur ve hangi yazı tipleri “web için güvenlidir” ve herhangi bir web sitesinde kullanılabilir? Bu makaledeki her şeyi keşfedeceğiz.
Başlayalım!
Html yazı tipi: Web yazı tipi nedir? Tipografinin zengin bir geçmişi var, ancak yazı tipleri, bugün bildiğimiz gibi, bilgisayarların ve internetin ortaya çıkmasıyla yaygın olarak kullanılmaya başladı. Dijital yazı tipleri, ekranda özel arıtmanın görüntülenmesini gerektirir. Ve farklı ekran boyutları ve cihazlar devreye girdiğinde, her şey daha karmaşık hale gelir.
Dijital yazı tipine gelirken birkaç farklı tür vardır. Bazı yazı tipleri öncelikle baskı ve grafik tasarımı için tasarlanmıştır. Büyük olma eğilimindedir ve web siteleri için uygun değildir, ancak grafik yapmak için mükemmeldir. Tüm makinelerin çoğunda bulunan “Web Güvenli” yazı tipi de vardır.
Ancak web tasarımı için, arama yapmanız gereken web yazı tipleri, özellikle web’de ve çeşitli cihazlarda mükemmel bir şekilde görüntülenecek şekilde tasarlanmış tipografidir. Web yazı tiplerini e -posta veya diğer çevrimiçi hizmetlerde de kullanabilirsiniz. Web yazı tiplerini indirilebilen standart masaüstü yazı tiplerinden farklı kılan birkaç şey vardır. İlk olarak, genellikle bilgisayarınızdaki programlarla kullanılamazlar; Sunucuya yüklenmeli ve Web’de kullanılmalıdır. Ayrıca farklı ekranlarda ve farklı boyutlarda okunacak şekilde tasarlanmıştır. CSS (cesur veya eğimli harfler, renkler ve diğer özellikler uygulamak gibi) ile düzenlenebilir ve sağdan sola oluşturma gibi diğer koşullara destek sunar. Web yazı tipi cihazınıza veya ziyaretçilerinize yüklenmemesine rağmen, Siteyi ziyaret eden herkesin görebilmesi için göstermenin özel bir yolu vardır. Bu yazı tipini her zamanki gibi indirebilir ve sunucunuza yükleyebilir veya indirmeler yapmadan sitenize sabitleyen özel bir web yazı tipi barındırma hizmeti kullanabilirsiniz. Sitenizin markasını ve görünümünü önemsiyorsanız, güvenli bir web yazı tipi kullandığınızdan emin olun. HTML’de kullanabileceğiniz yazı tipi tweet’leri için 10 harika seçenek bulun buradan tıklayın? Bazı yazı tipleri Web’de kullanılmak üzere tasarlanmamıştır, ancak hangi yazı tipleri HTML sitenize eklenebilir?
Temel olarak, sitenizden indirilebilecek yazı tiplerini kullanabilirsiniz. Tek yapmanız gereken yüklemek ve düzgün bir şekilde yapılandırmaktır ve web sitenizde görüntülenir.
Font Scribble, web sayfaları için pratik değil
TTF
OTF
Woff/Woff2
SVG
EOT
Bu yazı tipi dosya türüyle, sitenizin her yerinde kullanabilir ve HTML ve CSS ile düzenleyebilirsiniz. Ayrıca genellikle tüm tarayıcılarda ve programlarda evrensel olarak çalışan bir web güvenli yazı tipi de vardır. Güvenli web yazı tipi nedir? Çoğu web yazı tipiyle ilgili bir sorun, yazı tipinin web sitenizde doğru görüntüleneceğinin garantisi olmamasıdır. Yalnızca programda görüntüler yapabileceğiniz ve dağıtılacak şekilde yazdırabileceğiniz grafik tasarımın aksine, tarayıcı birisi sayfayı her açtığında web yazı tipini oluşturmalıdır. Yazı tipiniz yüklenemezse, boş ve hasarlı bir web sitesi ile sonuçlanabilirsiniz.
Bu nedenle, bazı web sitesi sahipleri yalnızca Web Güvenli Yazı Tipi’ne güvenmeyi tercih eder. Bu, çoğu sistemde daha önce kurulmuştur, bu nedenle en belirsiz cihaz hariç tüm cihazlarda doğru görünmesi garanti edilir. Ayrıca, yavaş görünebilen web yazı tiplerinden daha hızlı yükleme eğilimindedirler. Arial, güvenli bir web güvenli yazı tipidir
Endişelendiğiniz her şey performansı en üst düzeye çıkarmak ve sitenizin yazı tiplerini doğru bir şekilde görüntülemesini sağlamaksa, web güvenli yazı tipi sizin içindir. İşte genellikle kullanılabilecek web güvenli yazı tiplerinin bir listesi.
Arial
Sans çizgi roman
Yeni kurye
Garamond
Gürcistan
Helvetica
Darbe
Lucida Konsolu
Palatino
Tahoma
Times New Roman
Trebuchet MS
Verdana
Onlarca başka güvenli web yazı tipi de var, ancak bu tüm cihazlarda en yaygın olanı. Tüm bunlar arasında, Arial, Times New Roman, Helvetica ve Courier New en güvenli. Web için güvenli kabul edilmesine rağmen, bazıları belirli işletim sistemlerinde çalışmaz. Sorun, bir hükümet sitesi veya basit bir bilgi sitesi gibi bir şey çalıştırmadığınız sürece, çoğu yazı tipinden kaçınarak markanızı feda etmenin bir anlamı yoktur. Güvenli web yazı tipleri okunabilir, aynı zamanda çok yaygın ve çok sık kullanılabilir.
Web sitenizde kullanmak için daha iyi ve benzersiz bir yazı tipi koleksiyonu seçmek çok daha iyi, çünkü yüklenemeyen web yazı tipi problemleri için bir çözüm var: Font Backback. Yazı tipi Yazı Tipleri Yazı Tipleri Yoksları Hakkında Not Fontlar Yatırma olarak da bilinir, cesur ve yaratıcı web yazı tiplerini kullanmanın tek nedenidir. Ne yaparsanız yapın veya hangi önleyici önlemleri aldığınız önemli değil, her zaman yazı tipinizi yükleyemeyen biri vardır. Belki de barındırılan yazı tiplerinin doğru görüntülenmemesi için JavaScript’i devre dışı bırakırlar veya kodda yanlış bir şey vardır ve yüklediğiniz yazı tiplerini önler. Ya da bazı yazı tipleri birinin cihazıyla uyumlu değildir. Yazı tipi yazı tipleri yazı tipleri, bir hata oluşursa yüklenmesi kolay web güvenli yazı tipleri. Bu, Font ailesine göre kullanıcı tarafından yüklenen yazı tiplerini seçerek çalışır:
Serif yazı tipleri, harf hattının ucuna bağlı küçük çiziklerle belirlenir. Bu yazı tipi zarif ve okunması kolay kabul edilir.
Sans Serif yazı tipi, Serif yazı tipine benzer şekilde tasarlanmıştır, ancak çizikleri yoktur. Daha basit ve okunması daha kolaydır.
Monospace yazı tipi her harf arasına eşit olarak yerleştirilir ve onlara farklı bir görünüm verir.
Yazı tipi sandalyesi (veya yazı tipi komut dosyası) resmi el yazısı harfleri açıklar. Grafik başlıkları veya tasarım için çok okunmaz ve daha iyi değildirler.
Fantezi yazı tipleri (veya dekoratif yazı tipleri) çok şıktır ve sandalye yazı tipleri gibi içerik metni olarak uygun değildir.
Yazı tipi yığınının gerçekten “kazık” olduğunu unutmayın; Sırada birkaç yedek yazı tipine sahip olmak çok mümkündür. Kazanın sonunda her zaman güvenli bir web yazı tipine sahip olduğunuzdan emin olun ve ana yazı tipi başarısız olursa markanızı benzer bir yazı tipiyle iletme fırsatınız var. HTML ile yazı tipleri nasıl eklenir Sitenize web yazı tipleri eklemek istiyorsanız, birkaç seçeneğiniz vardır. WordPress kullanıcıları için, sitenize yazı tipleri eklemenin en kolay yolu bir eklenti kullanmaktır. En popüler ikisi kolay Google yazı tipleridir ve herhangi bir yazı tipi kullanır. UAF, sitenize doğrudan sitenize yazı tipleri yüklemenize olanak tanırken, Google yazı tipi ekleme işlemini ilk olarak basitleştiren ilk kişi. WordPress kullanmıyorsanız veya eklentiye güvenmek istemiyorsanız, işlem bazı manuel ayarlamalar gerektirir. İlk olarak, Google yazı tipi gibi başka bir yerde yayınlanan yazı tiplerini kullanabilirsiniz. Buradaki talimatlar seçtiğiniz hizmete bağlıdır. Google yazı tipleriyle, ‘a kullanmak istediğiniz yazı tipini gömmeniz ve daha sonra kullanmak istediğinizde aramanız gerekir. Ayrıca web sitenizden internetten indirdiğiniz yerel yazı tiplerini de barındırabilirsiniz. Bu tercih edilebilir, çünkü üçüncü taraf hizmetlerine bağlı olmanıza gerek yoktur. Neyse ki, doğru yapılandırılmış bir web yazı tipiniz olduğu sürece bunu yapmak çok kolaydır. Dosyayı sunucunuza yükleyin, ardından belirlemek için stil sayfanızdaki kurallar @font-face kullanın. Örneğin: @font-face {font-family: fontname; SRC: URL (FonthocationServer);
} Ardından, yazı tiplerinizi HTML belgelerinde istediğiniz yere çağırmak için yazı tipi ailesi etiketlerini kullanabilirsiniz. Yazı tipleriniz web sitenize güvenli bir şekilde yüklendikten sonra HTML ve CSS ile şekillendirme yazı tipleri, artık HTML ve CSS ile ayarlayabilirsiniz. Küçük bir programlama yeteneğiniz olsa bile, yazı tiplerini yönetmek oldukça kolaydır. Metnin rengini, arka plan rengini, boyutunu, stilini veya ağırlığını değiştirebilirsiniz. Bu artık desteklenmiyor ve kullanılmamalıdır. Bunun yerine, CSS veya HTML tarzı öğelerle metin düzenleyebilirsiniz. İlk olarak, yazı tipini renk kodu ile değiştirebilirsiniz. “Kırmızı”, RGB kodu veya onaltılık değer gibi renk adlarını kullanabilirsiniz. Bu, p {color: mavi; } Veya tek tek HTML stili öğesinde:
metin.
Arka plan rengi aynıdır, ancak arka plan renk özniteliğini kullanır.
Bültenlere Kaydolun
Trafiğimizi%1000’den fazla nasıl artırdığımızı bilmek ister misiniz? Haftalık bültenimizi içerideki WordPress insanlar hakkında ipuçlarıyla alan 20.000’den fazla insana katılın!
Şimdi abone olun
P {arka plan-color: mavi; } Sırada yazı tipi boyutu. Bu piksel, yüzde veya EMS (duyarlı siteler tasarlamak için iyidir) olabilir. P {yazı tipi boyutu: 16px; } Veya:
metin.
CSS kullanarak yazı tipi boyutunu ayarlayın
Ve sonuncusu yazı tipi stili ve ağırlığı ya da italik ve kalın. İtalik metin için “italik” etiketi kullanın. . } Ve kalın için: .bold {font-weight: bold; }
CSS kullanarak yazı tipi stilini ayarlayın.
Bunun yerine HTML etiketlerini de kullanabilirsiniz. İtalikler için, vurgu sağlayan metin için veya şunları kullanarak kullanabilirsiniz: Görsel olarak farklı olması amaçlanan metin için. Ve kalın harfler için: veya kullanın. Örneğin: kalın metin veya Özel önem taşıyorum. Üçüncü bir -Party yazı tipi ana bilgisayarını kullanmak mı yoksa indirmek mi, yazı tiplerini bulmak için en iyi yeri bilmeniz gerekir. Orada yüzlerce distribütör var, ancak yazı tipleri almak için sadece güvenilir bir kaynak olarak bilinen bir avuç var. İşte bazıları: kendi yazı tipi barındırma? Performansı için optimize edilen barındırma, ücretsiz bant genişliği dahil HTTP/2’yi destekleyen CDN’yi içerir. Planımıza bakın
Google yazı tipi, yazı tipleri almak için en iyi yerlerden biridir. Neden? Niye? Hiçbir şey indirmeden sitenize kolayca sabitleyebilirsiniz, seçim çok geniş ve güzeldir ve en önemlisi bu tamamen ücretsizdir. Google sunucusu her zaman hızlıdır, böylece mümkün olduğunca biraz gecikme ile yazı tipleri göndermelerine güvenebilirsiniz.
Adobe Fonts, herhangi bir yaratıcı bulut aboneliğiyle binlerce yazı tipi sunar. Diğer hizmetlerle (en azından Google yazı tipi gibi açık kaynak yazı tiplerine bağlı olmayan), genellikle lisanslar konusunda endişelenmeniz gerekir. Bu yazı tipi, kişisel veya ticari herhangi bir projede kullanılmak üzere temizlenir.
Google Font hiç bulunmadan önce, Font Squirrel herhangi bir projede kullanılmak üzere ücretsiz bir ticari lisanslı yazı tipi bulmak için bir yerdi. Birçok seçeneği var, ancak maalesef yazı tipi barındırma için seçenek yok. Yazı tipini indirmeniz ve sitenize manuel olarak yüklemeniz gerekir. Tüm yazı tipleri web için optimize edilmez, ancak webfont jeneratörünü deneyebilirsiniz.
En iyi 10 HTML yazı tipi, orada binlerce web yazı tipidir, ancak nereden başlamalısınız? İşte herhangi bir web sitesinde iyi görünecek on basit HTML yazı tipi. Bunların hepsi web için güvenlidir, bu nedenle neredeyse tüm cihazlarda çalışmak zorundadırlar. Ayrıca iyi geri dönüş yazı tipleri yaparlar. Biraz daha ilginç bir şeye ihtiyacınız varsa, sandalye yazı tipleri, kaligrafi yazı tipleri ve modern yazı tipleri hakkında birçok makalemiz var. 1. Arial
Arial yazı tipleri örnekleri.
Palatino size yabancı görünebilir, çünkü genellikle kitaplarda kullanılır. Şimdi bu, birçok cihazda varsayılan olarak dahil edilen zarif bir dijital tiptir. 4. Verdana Verdana’nın okunması çok kolay olduğu biliniyor ve büyük boyutlarda bile iyi görünmeye devam ediyor. SANS Serif iyi bir alternatif arial. 5. Yeni Kurye
Yeni kurye yazı tipi örneği.
Eski daktilo metnini hatırlatan Courier New, eski moda bir görünüm isteyen ancak okunabilen siteler için iyi bir Monospace tasarımıdır. 6. Kalibrasyon
Calibri yazı tipi örneği.
Calibri, Microsoft Office gibi programlarla standartlara sahip basit ve güzel bir Sans serif yazı tipidir. Ancak, bu, sahip olunan bir yazı tipidir, bu nedenle genellikle yalnızca Windows işletim sisteminde desteklenir. 7. Gürcistan
Bu yuvarlak serif yazı tipi, Garamond’a benzer güvenli bir web yazı tipinden ilham aldı. New Roman Times kadar ciddi olmayan resmi bir yazı tipine ihtiyacınız varsa, bu iyi bir seçimdir. 8. Garamond
Tıpkı Palatino gibi, Garamond da kitap yazdırması için kullanılan klasik bir yazı tipidir. Modern işletim sistemi için güncellenmesine rağmen, oldukça eski görünüyor. 9. Didot
Serif yazı tipindeki minimum harfler benzersiz bir görünüm ve his verir. Çoğu Apple cihazında bulabilirsiniz. 10. Tahoma