Typografi: 10 typsnitt i stället för AI-webbplatsernas Inter

En AI-byggd webbplats känns ofta igen innan man har läst ett enda ord. En stor del av kännetecknen sitter i typografin: samma typsnitt, samma storlekar och samma små vanor upprepas från webbplats till webbplats. Den här guiden går igenom hur du känner igen AI-typografi, vilka fria typsnitt som fungerar i stället för Inter och hur du sätter texten så att den inte ser ut som en mall.

Så känner du igen AI-typografi

ChatGPT, Claude och Codex, liksom sidgeneratorer som v0, Bolt och Lovable, bygger på samma startmallar och landar därför i samma typografiska lösningar. De vanligaste kännetecknen:

• Inter eller Geist i all text, från rubriker till knappar.
• Ett ord i rubriken satt i kursiv antikva, oftast Instrument Serif eller Fraunces.
• En spärrad versaletikett ovanför varje rubrik.
• Ett monospace-typsnitt i siffror, datum och små etiketter.
• Metadata kedjade med mittpunkter, till exempel lästid, datum och kategori i rad.
• En pil efter varje länk.
• All text i nästan samma storlek och vikt.

Inget av dessa är fel i sig, men tillsammans berättar de för besökaren att webbplatsen kommer från en mall. Det enklaste stället att börja är typsnittet.

10 fria typsnitt i stället för Inter

Allt nedan finns på Google Fonts och är fritt även för kommersiellt bruk. För ett finländskt företag är den naturligaste starten Finlandica, Finlands nationella typsnitt, ritat av Helsinki Type Studio.

Om du vill ha en enda rekommendation: Host Grotesk passar rakt in i Inters ställe, Finlandica ger ett finländskt varumärke en egen röst, och Newsreader eller Literata bär lång text som en blogg eller en guide.

Så ser texten inte ut som en mall

Att byta typsnitt hjälper, men uttrycket beror lika mycket på hur texten sätts.

• Gör en tydlig skillnad i storlek och vikt mellan rubrik och brödtext.
• Knip in teckenavståndet i stora rubriker en aning, men inte i brödtexten.
• Brödtext på 16–20 pixlar, 45–90 tecken per rad och radavstånd på 130–150 procent av typsnittsstorleken.
• Framhäv ett ord i rubriken med vikt eller färg, inte genom att byta typsnitt mitt i meningen.
• Rada upp siffror med font-variant-numeric: tabular-nums. Du behöver inget monospace-typsnitt.
• Skilj metadata åt med luft eller ge varje uppgift en egen plats i stället för mittpunkter.
• Stryk versaletiketten ovanför rubriken när rubriken redan säger samma sak.
• Två typsnitt räcker, så länge det andra är tydligt annorlunda, till exempel en antikva till en grotesk.

Betalda typsnitt

När du vill ha ett uttryck som konkurrenterna saknar är ett betalt typsnitt ofta billigare än många tror. Helsinki Type Studio prissätter sin webblicens efter månadsbesökare: en enskild skärning börjar på 70 euro, och hela familjen Allee upp till 500 000 besökare kostar 1 050 €. Helsingfors stads Helsinki Grotesk Pro kostar 70 euro per skärning.

Andra gjuterier i Finland och närområdet är Typolar, Paavola Type Studio och Hurme Design, svenska Letters from Sweden, isländska Or Type och norska Monokrom. Av de fria finländska typsnitten är Jaapokki ett etablerat rubriktypsnitt.

Licenser i korthet

• Typsnitten i Google Fonts får användas också kommersiellt, men ladda ner filerna till din egen server. Att ladda från Googles servrar skickar besökarens IP-adress till Google, och regiondomstolen i München dömde ut ersättning för det 2022.
• Gratis är inte detsamma som fritt. Fontshares Satoshi och Switzer får inte ändras eller lämnas vidare till en utomstående formgivare, och licensen kan sägas upp.
• För ett betalt typsnitt är det avgörande vem som äger licensen. Byråns licens får inte driva kundens webbplats, så begär licensen i kundens namn.
• Prenumerationstypsnitt slutar fungera när betalningarna upphör. Adobe Fonts och webblicenser med årsavgift är dåliga val som bestående varumärkestypsnitt.

Tekniskt genomförande

I Next.js laddar next/font ner typsnitten under byggfasen och levererar dem från din egen domän, så ingen förfrågan når Google. Från ett variabelt typsnitt följer som standard bara viktaxeln med, så begär optisk storlek med inställningen axes. Standardtemana i WordPress har levererat typsnitten från temakatalogen sedan version 6.2. Om temat eller sidbyggaren hämtar typsnittet från en utomstående server, åtgärda det.

Så väljer du typsnitt

• Se först på vad dina konkurrenter använder. Om tre av fyra kör på Inter har du en enkel chans att skilja dig.
• Välj ett typsnitt som har kursiv och tillräckligt många vikter. Utan kursiv ser framhävningarna i brödtexten klumpiga ut.
• Föredra ett variabelt typsnitt: du får alla vikter med en enda fil.
• Testa rubrikerna med den längsta verkliga texten, inte med lorem ipsum. Finska sammansatta ord fäller många layouter.
• Läs licensen innan du installerar typsnittet på kundens webbplats, och hosta alltid filerna själv.

Typografin är bara ett av AI:s fingeravtryck. Nästa del i serien handlar om färg, och om varför den violetta gradienten blev AI-webbplatsernas kännetecken.