{"id":265040,"date":"2023-06-03T12:16:00","date_gmt":"2023-06-03T09:16:00","guid":{"rendered":"https:\/\/inform.click\/ultimat-guide-till-webbtypografi-regler-ordlista-ideer-och-basta-praxis\/"},"modified":"2023-06-03T12:23:00","modified_gmt":"2023-06-03T09:23:00","slug":"ultimat-guide-till-webbtypografi-regler-ordlista-ideer-och-basta-praxis","status":"publish","type":"post","link":"https:\/\/inform.click\/sv\/ultimat-guide-till-webbtypografi-regler-ordlista-ideer-och-basta-praxis\/","title":{"rendered":"Ultimat guide till webbtypografi: regler, ordlista, id\u00e9er och b\u00e4sta praxis"},"content":{"rendered":"

\n 'En bild s\u00e4ger mer \u00e4n tusen ord.'\n<\/p>\n

\n Oftast f\u00f6rmedlar bilder vad de har att s\u00e4ga. En bild med text g\u00f6r dock ett starkare genomslag.\n<\/p>\n

\n Typografi fungerar som en f\u00f6ljeslagare till din grafik. Typografi \u00e4r inte bara att v\u00e4lja ett slumpm\u00e4ssigt teckensnitt och en punktstorlek fr\u00e5n rullgardinsmenyn i ditt redigeringsprogram. Det \u00e4r ett specialiserat omr\u00e5de inom grafisk design. Det \u00e4r konsten och tekniken att arrangera typ. Det \u00e4r en av de viktiga f\u00e4rdigheterna som kan skilja dig fr\u00e5n resten av designers om du vet hur man anv\u00e4nder den.\n<\/p>\n

\n Vad \u00e4r typografi?
\n<\/h5>\n

\n Innan du b\u00f6rjar med typografins konst och teknik, f\u00f6rst f\u00f6rst\u00e5 vad typografi handlar om. Typografi \u00e4r den visuella texten (skrivet ord). En text \u00e4r en rad ord. Varje visuellt visad text du ser \u00e4r i princip typografi. Text kan kategoriseras p\u00e5 tre s\u00e4tt – visuellt, h\u00f6rbart och digitalt.\n<\/p>\n

\n Typografi \u00e4r mer \u00e4n design av bokst\u00e4ver och tecken. Den inkluderar val av punktstorlek, avst\u00e5nd och linjel\u00e4ngd. P\u00e5 den tiden d\u00e5 Johannes Gutenberg introducerade tryckpressen var s\u00e4ttare tvungna att ordna bokst\u00e4ver och tecken i det fysiska rummet. Nu i datorernas tids\u00e5lder \u00e4r det h\u00e4r jobbet mycket l\u00e4ttare. Du beh\u00f6ver bara hitta typsnitt med \u00f6ppen k\u00e4llkod, ordna bokst\u00e4ver och tecken, och du \u00e4r klar.\n<\/p>\n

\n Vikten av typografi
\n<\/h5>\n

\n Typografi \u00e4r n\u00e5got som du hittar absolut \u00f6verallt. S\u00e4g att det kan vara din smartphone, kaffekopp, skylt, dukar och mycket mer. Typografi finns \u00f6verallt. Valet av typsnitt, bokst\u00e4ver och teckenarrangemang avg\u00f6r hur ditt budskap ska f\u00f6rmedlas.\n<\/p>\n

\n \u00c4ven om det verkar vara en liten faktor enligt din uppfattning, \u00e4r det verkligen inte det. \u00c4ven en enda typjustering kan \u00e4ndra hela utseendet och k\u00e4nslan av ditt konstverk. Om du n\u00e5gonsin m\u00e4rkt Facebook testade ett nytt typsnitt som heter Geneva redan i juni 2016. Det var n\u00e5got tunnare och l\u00e4ttare version av det ursprungliga Helvetica-teckensnittet. Men skillnaden mellan dessa tv\u00e5 typsnitt var m\u00e4rkbar.\n<\/p>\n

\n Regler f\u00f6r typografi\n<\/p>\n

\n I typografi m\u00e5ste du v\u00e4lja typsnitt enligt din layout, rutn\u00e4t, designtema, f\u00e4rgschema och s\u00e5 vidare. H\u00e4r \u00e4r n\u00e5gra typografiregler du b\u00f6r t\u00e4nka p\u00e5 n\u00e4r du arbetar.\n<\/p>\n

\"\"<\/a><\/p>\n

\n Att v\u00e4lja r\u00e4tt typsnitt
\n<\/h5>\n

\n Om du spenderar n\u00e5gra minuter p\u00e5 internet hittar du en h\u00e4pnadsv\u00e4ckande m\u00e4ngd f\u00e4rdiga att anv\u00e4nda s\u00e5v\u00e4l gratis som betalda typsnitt. Men det betyder inte att du beh\u00f6ver spendera timmar p\u00e5 att leta efter de exakta typsnitten du visualiserar i ditt sinne. Du kan b\u00f6rja m\u00e5la \u00e4ven med en begr\u00e4nsad palett. Det finns n\u00e5gra bepr\u00f6vade typsnitt som Helvetica som aldrig kan g\u00e5 fel i n\u00e5got projekt.\n<\/p>\n

\n Ett typsnitt \u00e4r en form av formgivning som bildas av hantverkare som bidrar med alla sina anstr\u00e4ngningar och kunskaper under en l\u00e4ngre tid. De professionellt designade typsnitten erbjuder en m\u00e4ngd olika anpassningar vad g\u00e4ller vikter och stilar f\u00f6r att skapa en komplett familj. Dessutom erbjuder de betydande kerning-par, st\u00f6d f\u00f6r flerspr\u00e5kig anpassning av typinst\u00e4llning.\n<\/p>\n

\n F\u00f6ljande \u00e4r de viktigaste typografiska termerna som \u00f6verv\u00e4gs:\n<\/p>\n

\n Storlek
\n<\/h5>\n

\n Inte alla typsnitt skapas lika. Vissa anv\u00e4nder feta och breda aspekter medan andra \u00e4r tunna och smala. Olika typer av typsnitt kan f\u00e5 olika m\u00e4ngd utrymme p\u00e5 sidan.\n<\/p>\n

\n Tecknets h\u00f6jd betecknas som X-h\u00f6jd. N\u00e4r du kopplar ihop olika typsnitt \u00e4r det bra att bara anv\u00e4nda de typsnitt som har liknande x-h\u00f6jd. \u00c5 andra sidan kallas tecknets bredd f\u00f6r ”set width”, vilket avg\u00f6r hur mycket utrymme bokstaven tar och buffert med andra bokst\u00e4ver.\n<\/p>\n

\n Punktsystem \u00e4r den metod som anv\u00e4nts f\u00f6r att m\u00e4ta typ sedan 1700-talet. En punkt kan m\u00e4tas som 1\/72-tum och 12 punkter kan bilda en pica. Pica \u00e4r enheten f\u00f6r att m\u00e4ta kolumnbredd. Dessutom kan storlekarna m\u00e4tas i pixlar, tum eller millimeter. Det beror p\u00e5 projektets krav.\n<\/p>\n

\n Ledande
\n<\/h5>\n

\n Det vertikala utrymmet mellan varje typrad kallas ledande. Anledningen till att man kallar detta f\u00f6r ledande \u00e4r f\u00f6r att blysliporna anv\u00e4ndes f\u00f6r att dela upp textlinjerna tillbaka p\u00e5 den tiden d\u00e5 metalls\u00e4ttning anv\u00e4ndes. Tumregeln f\u00f6r att f\u00e5 en l\u00e4sbar br\u00f6dtext \u00e4r att anv\u00e4nda ett inledande v\u00e4rde som \u00e4r h\u00f6gre \u00e4n teckenstorleken. Du kan anv\u00e4nda ett ledande v\u00e4rde h\u00f6gre p\u00e5 1,25 till 1,5 g\u00e5nger.\n<\/p>\n

\n Sp\u00e5rning och kerning
\n<\/h5>\n

\n Kerning \u00e4r handlingen som involverar justeringar av utrymmet mellan karakt\u00e4rerna. Det hj\u00e4lper till att skapa ett harmoniskt par.\n<\/p>\n

\n Till exempel – n\u00e4r du anv\u00e4nder en versal av bokstaven 'A' med versaler av bokstaven 'V', k\u00e4rnas de diagonala strecken l\u00e4ngst upp till v\u00e4nster p\u00e5 bokstaven 'V' med den nedre h\u00f6gra delen av 'A'.\n<\/p>\n

\n \u00c5 andra sidan \u00e4r sp\u00e5rning termen som h\u00e4nf\u00f6r sig till avst\u00e5ndet mellan alla tecken som appliceras j\u00e4mnt. Kerning liknar sp\u00e5r, men b\u00e5da \u00e4r inte samma.\n<\/p>\n

\n M\u00e4ta
\n<\/h5>\n

\n M\u00e5ttet \u00e4r en term som f\u00f6rklarar bredden p\u00e5 ett textblock. F\u00f6r en optimal l\u00e4supplevelse b\u00f6r du betrakta m\u00e5ttet som en viktig aspekt av typografi.\n<\/p>\n

\n Hierarki och skala
\n<\/h5>\n

\n Alla typer kan inte anv\u00e4ndas i samma storlek, du m\u00e5ste st\u00e4lla in hierarki f\u00f6r typer. Annars blir det sv\u00e5rt f\u00f6r l\u00e4sarna att f\u00f6rst\u00e5 vilken information som \u00e4r viktigast \u00e4n de andra.\n<\/p>\n

\n Generellt \u00e4r rubriker stora, underrubriker \u00e4r mindre och kroppstypen \u00e4r n\u00e5got mindre \u00e4n underrubriker f\u00f6r att hj\u00e4lpa l\u00e4sarna att f\u00f6rst\u00e5 dess hierarki.\n<\/p>\n

\n Inte bara storlek, anv\u00e4ndning av olika f\u00e4rger, vikt och avst\u00e5nd kan ocks\u00e5 hj\u00e4lpa dig att st\u00e4lla in hierarki i ditt arbete.\n<\/p>\n

\n Ordlista
\n<\/h3>\n

\n Vi har t\u00e4ckt n\u00e4stan alla grundl\u00e4ggande begrepp och terminologi som involverar typografi h\u00e4r.\n<\/p>\n

\"\"<\/a><\/p>\n