Typogra(i och Fonter

Relevanta dokument
Text och typsnitt. Läsbarhet. Tecken per rad. Storlek

Bokstavshistoria. & Teckensnitt

Äldsta kända inskriptionen

Regler och rutiner för Högskolan Dalarnas grafiska profil

GRAFISK MANUAL 6/2012

Logotyp och Grafisk profil för UT Transport i Norr AB

Styla och formatera text

Pampas Marina Profilmanual version Juni 2009

Grafisk manual för Härjeåns Kraft AB

Grafisk manual. För Falu Tank

Grafisk manual. Åklagarmyndigheten. Version 1.0

Inledning 4 6. Märke. Typsnitt Färger

GRAFISK MANUAL & RIKTLINJER

STOCKHOLMS FÄLTRITTKLUBB Grafisk Profil

INTRODUKTION TILL LOGOTYPEN

Att skriva dokument i ordbehandlingsprogrammet Microsoft WORD.

Grafisk manual för justitieministeriets elektroniska demokratitjänster

Svenskt Sigill Grafiska riktlinjer

GRAFISK MANUAL VÄGLEDNING OCH REGLER

Centerpartiets grafiska manual Version 2.2, 2007

Varumärket Polykemi. En grafisk guide till en tydlig profil

Att skriva dokument i ordbehandlingsprogrammet Microsoft WORD.

GRAFISK MANUAL. Hjälpreda för grafisk produktion

GRAFISK PROFIL HJÄLPREDA FÖR GRAFISK PRODUKTION

GRAFISK PROFIL TIDAHOLMS KOMMUN

Formgivning. Vilka företag står bakom djursymbolerna nedan och varför vill man förknippas med just dessa djur? Företaget EMicrosofts logotype.

Vetenskapliga affischer

N A T I O N A L F Ö R E N I N G E N F Ö R T R A F I K S Ä K E R H E T E N S F R Ä M J A N D E

Hur gör man en poster? Sommarforskarskolan 2018

Teckenförrådet Grafisk profil

9 Geometriska begrepp

Grafisk Manual. Fastställd av Ordens Direktorium

Grafiska riktlinjer för

ORDLISTA WEBBDESIGN 100P

1.2 Logotypens färgsättning

Vår nya profil. Stefan Käll, kanslichef

VERSION 2.0 SEPTEMBER grafısk manual

21/01/2016. Stilmallar. styra utseendet av webbplatsen DEL 1. Karin Fahlquist. index.html. recept.html frukt.html grönsaker.html

Grafisk manual Vårdsamverkan Skaraborg

Grafisk manual

INLEDNING. Inledning Logotyp Färger Teckensnitt Tillämpningar

behövs för enhetlighet, tala samma språk, så att användaren kan lära sig och använda det vidare.

QBRITS WP Tema QBRITS-01/02.

Brandskyddsföreningen är en allmännyttig ideell förening som arbetar för ett brandsäkrare Sverige. Brandskydds föreningen är ett ledande

Grafisk profilmanual FÖR REGION JÖNKÖPINGS LÄN

TANA17 Matematiska beräkningar med Matlab

Detta är inte en ny grafisk profilhandbok utan version 2.0 enklare, tydligare och med fokus på innehållet i kommunikationen, inte utseendet.

Intryck som ger avtryck

Typografi, text & designperspektiv

Grafisk profil. för Lokalt Unescocenter i Samverkan - UnescoLUCS

Grafisk Profil. Innehåll: logotyp. teckensnitt/fonter. bilder

Vetenskapliga affischer. Karin Fahlquist

Extramaterial till Matematik Y

Innehållsförteckning. Inledning 4 Vår logotyp 5 Våra färger 9 Vår typografi 11 Dekorelement 14 Bildspråk 18

INLEDNING. Navigera dig genom manualens delar och avsnitt med hjälp av menyn till höger.

Grafisk manual GRAFISK PROFIL OCH BILDSPRÅK

Webbtillgänglighet. Tillgänglighet på webben. Hörselskadades behov. Synskadades behov. Kognitivt funktionshindrades behov. Rörelsehindrades behov

För mycket information! Att presentera vetenskap. Målet med föreläsningen. Planera din presentation besvara dessa frågor: Presentationens struktur

Grafisk manual (kort version)

Gränsöverskridande samverkan

Frågor och svar - Diagnostisk prov ht14 - Webbutveckling 1

diverse egenskapspaletter

GRAFISK MANUAL EQUMENIA

GRAFISK MANUAL. Trollhättans Missionskyrka

Vad är Typografi och Layout

Neuropedagogik Björn Adler, Hanna Adler och Studentlitteratur Bilaga 3:1 Arbeta med grundformerna för bokstäver Kognitiv träning i skrivning

Varumärket - föreningens hjärta Logotyp Logotypens frizon Deviselement Profilfärger Primära färger...

Grafisk profil EN KULTURSKOLA I RÖRELSE Denna grafiska manual tillhör festivalen En Kulturskola i Rörelse som arrangeras av Kulturskolan i

Innehållsförteckning. Inledning 4 Vår logotyp 5 Våra färger 9 Våra typsnitt 11 Designelement 14 Bildspråk 18

FORSBERGS SKOLA DISTANSKURS BREV 2

Hej! Helena Leach Designer. Date: September 2015 Subject: Identitet Dummy

Grafisk profil. företagsmärke profilfärger och typsnitt Grafiska element och bilder officemallar profilprodukter

RKM REGIONALA KOLLEKTIVTRAFIKMYNDIGHETEN NORRBOTTEN. Grafisk profilmanual

S vintagebröllo LSA p E EL P SAS LLO VINTAGEBRÖ Grafisk manual

Grafisk manual Ture Johanssons Trävaru

Kommunikationspolicy samt Grafisk profil för Kungsbacka Ridklubb

INNEHÅLL. Om vår grafiska profil 3. Logotyp 3. Färger 3. Typsnitt 4. Brev, fax och skrivelser 4. Meddelandeblock och visitkort 4

Våra visuella riktlinjer

Exempel på hur man kan bygga enkla former i Illustrator

Klyvklingor / Ripping Blades.

Ordlista 5A:1. term. faktor. täljare. nämnare. Dessa ord ska du träna. Öva orden

Forma komprimerat trä

PM: THS grafiska profil. Regelverk

S.M.A.R.T UF 07/ GRAFISK PROFIL Emin Karalic. Grafisk profil 2014/2015

Philip Skånberg KOMS 17/18 TEKNOLOGKÅREN 2.0 GRAFISK PROFIL

23 dialekter ett grafiskt språk

Grafisk profil Arne Lorentzon AB

Örebro Kommunikationsplattform. Version

Det ska synas att det är vi. Vår gra ska pro l

Ett företag i Golvkedjan Grafisk Guideline

SÄKER KOMPETENS Grafisk PrOfiL

Riktlinjer kring grafisk profil för arbete med hemsidor och trycksaker

Grafisk manual. version 1.2

GRAFISK PROFILMANUAL

Ma B - Bianca Övning lektion 1. Uppgift nr 10. Uppgift nr 1 Givet funktionen f(x) = 4x + 9 Beräkna f(6) Rita grafen till ekvationen.

Grafisk profil för Ottenby Åkeri

Lednat som låg udenr dem var sdöra Mpedaled, och där fnans rkat igntineng anant än ögislda sakogr. Men när öenrn

Fundera tillsammans. Victor är 5 år och Åsa är 8 år. Hur gammal kommer Victor att vara när Åsa är dubbelt så gammal som hon är nu?

GRAFISK PROFIL GUIDELINES REGARDING LOGOTYPE AND TYPOGRAPHY

Vår visuella identitet

Transkript:

Typogra(i och Fonter

Kontrollfrågor Jag vet skillnaden på font, typsni4 och typsni4sfamilj Jag vet vilka må4 som används när man tar fram e4 typsni4 Jag vet vad som menas med fontbredder så som propor<onell, kondenserad och monospace Jag vet vad en serif är och hur den kan se ut (slab, bracked, näbb, sporre, etc.) Jag vet varför en webbutvecklare behöver ha kännedom om foncamiljer

Font En font är en specifik storlek, vikt och s<l hos e4 typsni4. Fonten består av e4 antal glyfer (tecken). Unicode (den standardiserade uppsä4ningen av glyfer) består sedan 2015 av 120737 glypher som stöder 129 olika scripts (exempelvis armeniska är e4 script men svenska är bara några av tecknen i den la<nska uppsä4ningen) En font kan stödja en hel version av unicode eller hela eller delar av specifika uppsä4ningar av scripts eller symboler. Vissa fonter är olika i olika storlekar (12pt och 8pt har inte iden<ska glyfer) medan andra fonter är lika. Ibland används font när man menar typsni4 och ibland när man menar typsni4sfamilj.

Typsnitt och typsnittsfamilj E4 typsni4 är en samling av en eller flera fonter I olika vikter, former eller olika storlekar En typsni4sfamilj är en samling relaterade typsni4 som hålls samman av e4 gemensamt tema (exempelvis en familj som består av) E4 vanligt typsni4 E4 monospaced typsni4 E4 kondenserat typsni4 E4 kursivt handskrivs-liknande typsni4 Där varje typsni4 kan ha en eller flera fonter.

Mått X-height är den normala höjden (för bokstaven x) H är lite högre än x-höjden (ascent) och även högre än höjden för de vanliga bokstäverna Baseline är linjen texten hamnar på, men vissa bokstäver exv p går under den linjen (descent) Se mer på h4p://typedia.com/learn/only/anatomy-of-atypeface/

Stroke Width Vissa egenskaper från kalligrafi (skriva med penna) finns kvar I fonter. Vissa fonter skiljer på uppåtgående drag med pennan och nedåtgående drag. (upward stroke / downward stroke) Notera a4 A är smalare <ll vänster och V är smalare <ll höger då rit-riktningen är ner-upp för V och upp-ner för A. I den sista bokstaven finns inte någon skillnad mellan upward och downward stroke.

Kaligra(isk Lutning (Axis) Lutningen (stroke axis, stress, stress angle, design axis) motsvarar med vilken vinkel en kaligrafipenna hålls mot papperet. I exemplet nedan är den y4re profilen iden<sk på alla tre bokstäverna. Den första bokstaven har inte någon skillnad på tjockleken I den andra skiljer sig ver<kala och horisontella linjerna åt, men lutningen är rak. Den tredje bokstaven har en tydlig lutning på tjockleken hos linjerna

Fontbredd I en propor<onerlig font är vissa glypher (exempelvis i l t ) smalare än andra glypher och vissa glypher är bredare än andra bokstäver (exempelvis M och W ) I en monospace-font är alla bokstäver lika breda (I gamla skrivmaskiner och gamla skrivare var alla bokstäver lika breda) I en kondenserad font så är bokstäverna rela<vt smala. Nedan är tjockleken samma, men <ll höger är mera kondenserat. Kondenserad font kan vara an<ngen monospaced eller propor<onell

Serifer Serifer är de streck som avslutar bokstäverna när man skriver med penna eller hackar bokstäver ur stenblock. Det finns flera typer av serifer Slab (Egyp<an) - Horisontella Tjocka Fyrkan<ga Serifer Hairline - Tunna Horisontella Serifer ovast Fyrkan<ga Rundade (Bracketed) Serifer har en mjuk ovast rundad övergång mot serifen Små (pe<t-serif) - är serifer som är nästan osynliga. Kan vara hairline, slab eller rundade Seriferna måste inte vara horisontella utan kan luta åt olika riktningar. Det finns många olika sä4 som serifer kan varieras på.

Sporrar och Näbbar Sporrar (Spurs) är små serifer på rundade bokstäver (C, S, G etc) Näbbar (beaks) är överdrivna serifer på vissa raka bokstäver. Terminaler (slut på strokes) kan an<ngen vara lutande, raka eller runda

Svans och Finialer En svans (tail) är förlängning/specialisering av en sned linje för e4 dekora<vt syve. Vanligt på bokstaven R Finialer är böjda slutpunkter på rundade glyfer. Kan avslutas på många olika sä4, med serif, svans, sporre, näbb, terminaler (rakt, vinklat eller rundat på olika vis)

Klassiska (Serif) Humanist/Vene,an (rö4er I 1500-talets venedig) exempelvis Centaur Korta Tjocka Rundade Serifer Lutande Serifer på Ascenders Låg kontrast mellan up och down stroke Garalde / Aldine exv Garamond Större kontrast mellan up och down stroke Större axis-lutning på strokes Transi,onal exv Bulmer, Baskerville, Times Roman Ännu Större kontrast Nästan ingen axis-lutning på strokes Modern (Serif) Didone / Didot / Bodini Ännu större kontrast på strokes Hairline-serifer Mechanis,c / Egyp,an / Slab (rö4er I industriella revolu<onen 1800-talet) Nästan ingen kontrast mellan strokes Stora rektangulära serifer som ej är rundade Lineal (Sans-serif) Grotesque exv Grotesque, Headline Lite Kontrast mellan strokes Har sporrar på enstaka bokstäver exempelvis R och G Horisontella terminatorer Neo-Grotesque exv Univers, Helve<ca, Arial Ingen kontrast, mycket uniformt ucormade Lutande terminatorer Geometriska exv Futura Helt byggda av geometriska former exv rektanglar och cirklar, utan olikhet mellan glyfer Inga olika terminatorer, ingen kontrastskillnad Liknande geometriska lösningar återkommer i flera glyfer. Calligraphics Flera olika typer som skall everlikna olika typer av handskriv / kilskriv Klasser

Fonter och Rättigheter Fonter får ovast inte återges Fonter får ovast inte inbäddas I dokument Fonter får ovast inte användas på webbsidor Finns några få öppna fonter som får återges Google/MicrosoV/Adobe har donerat några fonter Webbläsarna innehåller några öppna fonter Finns några crea<ve-commons-fonter Några font-företag stämmer web-sidor som använder deras fonter utan a4 betala, och det är höga siffror, hundratusentals kronor per font Vissa fonter saknar vissa glyfer <ll exempel svenska tecken, dyrare fonter har ova fler glyfer (man får vad man betalar för) Logotyper har ova unika fonter som skapas för den logotypen, för a4 undvika a4 betala för dyr font (bara några glyfer behövs)

VAMPS Aug 2017 Universal Music Group is being sued by HypeForType, which accuses the record label of using "pirated" copies of its fonts for the logo of The Vamps. The font is widely used for artwork, promocon material and merchandising of the popular BriCsh band, and the font creator is looking for a minimum of $1.25 million in damages. The font maker has filed a lawsuit accusing the major label of using its "Nanami Rounded" and "Ebisu Bold" fonts without permission. According to a complaint, filed in a New York federal court, Universal failed to obtain a proper license for its use, so they are essencally using pirated fonts.. Köpte en standard-användar-licens Uppgraderade inte <ll använda för kommersiellt bruk -licens

Varför behöver man känna till font-klasser? Webbläsarna väljer fonter som är så lika den familj man valt som möjligt Har man inte rä4 font: Har man valt Futura försöker webbläsaren hi4a en annan geometrisk lineal font a4 ersä4a den med, går inte det försöker den med en annan lineal (sans-serif) font Har man valt Garamond försöker webbläsaren hi4a en annan klassisk Garalde-font, går det inte försöker den med annan klassisk (serif) font EVersom kondenserade fonter och monospace inte är officiella familjer kan webbläsare gissa ganska långt bort Man behöver därmed veta ganska noga vad en font har för egenskaper och vilken klass av font man valt. Man kan ange en lista med fonter som man vill välja om de inte finns <llgängliga, så behöver inte webbläsaren gissa så mycket. Då blir det ännu vik<gare a4 kunna sina font-klasser och font-familjer.

Göra en egen font / Logotyp Vilken typ/klass av typsni4 är det (eller tolkning/revival eller medvetet bryta mot regler/vissa regler?) Skall den ha hög x-height eller låg? Skall den vara kondenserad, monospaced eller propor<onell? Med eller utan serifer? och om serifer, vilken typ. Skall upward och downward strokes ha samma tjocklek? Skall strokes ha kalligrafisk lutning? Skall man ha serifer, näbbar, sporrar och/eller terminaler och hur skall de se ut? Hur skall man få det konsekvent?