Perfekta rubriker med @font-face och typsnittet Anivers
2010-03-22 @ 18:34@font-face i CSS
I CSS3 kan man välja vilket typsnitt som helst till texter och rubriker. Det innebär att man i CSS länkar in ett typsnitt på samma sätt som man länkar in en bakgrundsbild.
Först ställer man in vad den ska heta och vart fonten ligger:
@font-face {
font-family: Anivers;
src: url('fonts/Anivers.otf') format("opentype");
}
Sedan kallar man på typsnittet på samma sätt som man gör i CSS2:
.min_klass {
font-family: Anivers;
}
Anivers – det perfekta typsnittet för rubriker?
Jag har testat ett stort antal typsnitt för att få rubrikerna att se så lättlästa och tilltalande ut som möjligt. Efter en del letande hittade jag ett mycket trevligt typsnitt. Det heter Anivers och är gratis att ladda ner. Ett exempel där det används på rubriker är på inspectelement.com.
Typsnittet finns på josbuivenga – Anivers. Vill man inte registrera sig och istället ta en genväg, går det också ladda ner typsnittet från inspectelement.com.
2010-03-25 @ 21:49
Fantastiskt att man kan lägga typsnittet på egna servern, det visste jag inte om!
Ska laborera med Anivers nu. Har svår beslutsångest över vilket typsnitt jag ska välja till min kommande prisjämförelsesajt för tandblekning. ;)
2010-03-26 @ 19:43
Det blir inte mycket lättare att bestämma sig nu när man kan välja vilket typsnitt som helst i hela världen, men det gör webben betydligt trevligare.
2010-10-08 @ 10:24
Jag är kär i @font-face. Skulle säga att det är den enskilt enklaste och viktigaste tekniken för att göra sin sida snyggare och differentiera sig från andra.
Förstår inte att web safe fonter fortfarande är så stort när det är sååå lätt att fixa vilken font som helst.
Ps! Din blogg är bland de snyggaste jag vet. Håller helt med om att detta är bland de bättre gratis rubrikfonter som finns. Jag är även en stor fan av Yanone Kaffeesatz.
2010-10-08 @ 17:53
Tack för kommentaren och tipset!