Webbrelaterat - Design och resurser för webbdesigners » Fonter

4 gratis sätt att ta reda på en font

Anton — Wed, 06 Oct 2010 20:46:53 +0000

Du är ute och surfar och hittar en webbplats som använder ett typsnitt som du gillar. Du vill ha typsnittet till kanske ditt nästa webdesign projekt eller dyl. Hur ska du då göra? Vi har alla varit i denna sits, nu ska jag visa dig precis hur du ska göra!

Ett enkelt alternativ är att helt enkelt maila webmastern och be om namnet på det teckensnitt och var du kan få det. (Dock tar detta både tid, och det är många webmasters som helt enkelt inte orkar svara)

Notera: Bilderna är länkade

What The Font

Ladda upp en bild av det teckensnitt du vill veta vad det heter. Deras system kommer att visa dig flera teckensnitt resultat. Om du får exakt svart, uppmanar whatthefont att gå till deras forum, där du kan skicka in bilden så deras kunniga forum kan ta reda på fonten.

Identifont

På denna sidan hittar du ditt typsnitt genom att fråga ett antal frågor om ditt teckensätt. Detta kan vara användbart om du inte har en bild av det teckensnitt du letar efter. Tjänsten sägs vara “den största oberoende katalogen typsnitt på Internet med information om typsnitt.”

Bowfin Printworks

Denna webbplats erbjuder massor av information samt flera online-verktyg som hjälper dig att hitta din font, hemsidan har ungefär samma tillvägagångssätt som Identifont. Dock är Bowfin Printworks en anning snabbare.

Flickr Typeface Identification

Din sista utväg kan vara en speciell Flickr grupp, det finns en grupp där folk laddar upp bilder på sina fonter och får hjälp av alla medlemmar i gruppen.

15 tips på snygga webb fonter med CSS @fontface – och hur man gör

Johan — Thu, 05 Nov 2009 12:50:02 +0000

Att använda @font-face regeln är som kanske många vet ingen ny egenskap för CSS3. Det fanns även för CSS2 och funkar också för Internet Explorer 6.0. Dock så läser Internet Explorer inte TTF format så bra så det finns en liten lösning för detta. Besök ttf2eot för konvertera TTF till EOT.

Hur man lägger in detta på din webbsida är en ganska enkelt egentligen. Börja med att Öppna din style.css och droppa denna kod snutt:


@font-face {
	font-family: Delicious;
	src: url('Delicious-Roman.otf');
}

@font-face {
	font-family: Delicious;
	font-weight: bold;
	src: url('Delicious-Bold.otf');
}

Och:

h2 { font-family: Delicious, sans-serif; color:#000;}

Så ska det se ut nåt sånt här i dina h2 taggar:

It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.

Snyggt va! Nu har vi gått igenom enkelt hur vi lägger in inbäddade special fonter på din webbsida. Men vart hittar man häftiga fonter då.. Här kommer 15 rekommenderande fonter av lite olika slag. Notera att dessa fonter går självklart att användas till dina design projekt.

Webbrelaterat - Design och resurser för webbdesigners » Fonter

4 gratis sätt att ta reda på en font

Notera: Bilderna är länkade

What The Font

Identifont

Bowfin Printworks

Flickr Typeface Identification

15 tips på snygga webb fonter med CSS @fontface – och hur man gör

9 riktigt trevliga gratis fonter

Dagliga tips #04: 100 gratis webbikoner, fonter för webb 2.0, texturer

1.8 Sledge Hammer Effect WP Plugins, Have you lost control of your WP?

2.Cardboard Textures : Free Downloads + Examples Websites + Tutorials for Designers

3.Great Fonts for Web 2.0

4.100 Free Icons – Weby Icon Set

5.11 Essential Tips for Good Print Typography

Snygga gratis fonter som du inte borde ha missat

Museo

Birra Stout

Greyscale

Avenir

Nevis

IPAP Font Familj

Amura

Agrafa

Evolution

Segoe

Mido

jGaramond

Cicle

Steiner

Ambrosia

Advent Pro

2 fräcka fonter