SEO-anpassad webbdesign: checklista
En checklista för URL-struktur, rubrikhierarki, hastighet och strukturerad data i designfasen, så att du slipper fel som är svåra att rätta efter lansering.
Aurora YazılımRedaktionen
6 min läsning
SEO-anpassad webbdesign innebär att webbplatsen från början byggs så att sökmotorer lätt kan genomsöka och förstå den. Begripliga URL:er, en enda H1 per sida och en logisk rubrikhierarki, en snabb och mobilanpassad struktur, unika titel- och beskrivningstaggar, interna länkar, sitemap och strukturerad data är de viktigaste delarna av designen.
Varför bygger man en SEO-anpassad webbplats från början?
SEO ses ofta som en tjänst som läggs till först när webbplatsen har lanserats. Men en stor del av de beslut som avgör synligheten i sökresultaten fattas under design och utveckling: sidstrukturen, URL-upplägget, hur rubrikerna kodas, hur bilderna laddas och med vilken teknik sidorna byggs.
Fattas de besluten fel liknar SEO-arbetet efteråt att lappa en byggnads grund utifrån. Att ändra URL-strukturen kräver omdirigeringar, och att göra ett tungt gränssnitt lättare kräver ny kodning. Att göra rätt från början är både billigare och mer varaktigt.
Checklistan nedan samlar de tekniska och strukturella punkter som bör gås igenom under planerings- och utvecklingsfasen i ett webbprojekt.
Webbplatsstruktur och URL-upplägg
Sökmotorer upptäcker webbplatsen via länkar. En logisk hierarki gör att både användaren och sökroboten lätt hittar det de söker. Sambandet mellan webbplatsstruktur och SEO är därför direkt: viktiga sidor ska gå att nå från startsidan med några få klick.
- Planera en separat, permanent sida för varje tjänst eller produktgrupp.
- Skriv URL:erna korta, läsbara och utan specialtecken (å, ä, ö): till exempel /web-tasarimi/kurumsal-web-sitesi/.
- Använd inte datum, id-nummer eller onödiga parametrar i URL:er.
- Fastställ en enda konsekvent form för versaler och gemener, snedstreck på slutet och val av www.
- Visa sidans plats i webbplatsen med breadcrumbs (sökvägsnavigering).
- Lämna inga föräldralösa sidor (sidor som ingen länkar till).
Rubrikhierarki och metataggar
I den visuella designen skiljer sig rubriker åt genom storlek och färg, men i koden sker det med taggarna H1 till H6. Om en designer använder H1 bara för att få en text att se stor ut, eller om en utvecklare kodar alla rubriker med samma tagg, missförstår sökmotorn sidans struktur.
- Varje sida ska ha exakt en H1 som beskriver sidans huvudämne.
- Använd H2 och H3 i ordning så att de speglar innehållets avsnitt.
- Använd en CSS-klass, inte en rubriktagg, för att styra visuell storlek.
- Varje sida ska ha en unik title-tagg där det viktigaste sökordet står nära början.
- Metabeskrivningen ska förklara nyttan med sidan; samma text ska inte upprepas på alla sidor.
- Definiera Open Graph-taggar för hur sidan ser ut när den delas.
<title>Webbdesign för företag | Företagsnamn</title>
<meta name="description" content="Kort beskrivning som förklarar sidans nytta.">
<link rel="canonical" href="https://www.ornek.com/web-tasarimi/kurumsal-web-sitesi/">
<meta property="og:title" content="Webbdesign för företag">
<meta property="og:image" content="https://www.ornek.com/img/paylasim.jpg">Hastighet och Core Web Vitals
Sidhastighet hänger direkt ihop med designbeslut. En stor introvideo, många typsnittsvikter eller tunga animationsbibliotek gör sidan långsam hur bra koden än är.
Googles gränsvärden för Core Web Vitals kan användas som designmål: 2,5 sekunder för LCP, 200 millisekunder för INP och 0,1 för CLS. Detaljerna om måtten har vi gått igenom i inlägget vad är Core Web Vitals och praktiska metoder i guiden så gör du webbplatsen snabbare.
- Bilder i WebP eller AVIF, i rätt storlek och med angiven bredd och höjd.
- Bilder utanför skärmen laddas sent; huvudbilden prioriteras.
- Typsnitt i WOFF2, bara de vikter och teckenuppsättningar som behövs.
- Ingen oanvänd CSS och JavaScript; icke-kritiska skript skjuts upp.
- Cache, komprimering och vid behov CDN är inställda.
Mobilanpassning och tillgänglighet
Google använder i första hand mobilversionen när webbplatser indexeras. Innehåll som döljs eller kortas ned på mobilen kan också räknas som saknat av sökmotorn. Därför bör man i mobildesign bygga om layouten i stället för att klippa innehållet; mer om det på vår sida mobilanpassad design.
Tillgänglighet och SEO överlappar också på många punkter. Meningsfulla alternativtexter för bilder, beskrivande länktexter, rätt rubrikordning och tillräcklig färgkontrast gör det lättare både för användare med funktionsnedsättning och för sökmotorer att förstå innehållet.
Tekniska SEO-inställningar i designen
Osynliga men avgörande tekniska inställningar avgör om webbplatsen genomsöks och indexeras. I designfasen för teknisk SEO bör följande punkter kontrolleras:
- Hela webbplatsen öppnas via https och http-adresser omdirigeras permanent.
- XML-sitemapen uppdateras automatiskt och skickas in till Search Console.
- robots.txt blockerar bara de områden som verkligen inte ska genomsökas.
- Varje sida har rätt canonical-adress; filter- och sorteringssidor skapar inte duplicerat innehåll.
- Det finns en egen, användbar 404-sida och inga trasiga länkar.
- På flerspråkiga webbplatser används hreflang-taggar och en separat URL per språk.
- Innehållet syns i HTML även utan att JavaScript körs.
User-agent: *
Disallow: /panel/
Sitemap: https://www.ornek.com/sitemap.xmlStrukturerad data
Strukturerad data berättar för sökmotorn med ett standardiserat språk vad uppgifterna på sidan betyder: det här är ett företag och det här är dess adress, det här är en produkt och det här är dess pris, det här är en vanlig fråga. Ordlistan Schema.org och formatet JSON-LD är den vanligaste metoden.
Strukturerad data höjer inte rankingen direkt, men den gör att du kan komma i fråga för utökade visningar i sökresultaten och hjälper innehållet att förstås rätt. Markeringen måste stämma exakt överens med uppgifterna som faktiskt syns på sidan.
- Organization eller LocalBusiness på företagswebbplatser
- Service eller Product på tjänste- och produktsidor
- Article i blogginlägg, BreadcrumbList i sökvägsnavigeringen
- FAQPage i avsnitt med vanliga frågor
<script type="application/ld+json">
{
"@context": "https://schema.org",
"@type": "Organization",
"name": "Företagsnamn",
"url": "https://www.ornek.com/",
"logo": "https://www.ornek.com/img/logo.png",
"telephone": "+90-000-000-00-00"
}
</script>Plan för innehåll och interna länkar
Hur stabil den tekniska grunden än är är det innehållet som för sökmotorn till besökaren. Genom att redan i designfasen bestämma vilken sökintention varje sida ska möta kan textytor och avsnitt planeras därefter. Sökordsanalys bör göras tillsammans med sitemapen.
Interna länkar leder både användaren och rankingstyrkan vidare mellan sidor. Länka från tjänstesidor till relevanta blogginlägg, och från blogginlägg till tjänstesidor, med naturliga och beskrivande texter. Använd meningsfulla uttryck som »design av företagswebbplats« i stället för »klicka här«.
När man förnyar en befintlig webbplats förhindrar en jämförelse av den här planen med det gamla innehållet att värdefulla sidor försvinner. Vad man bör tänka på vid en förnyelse har vi samlat i guiden förnya webbplats; våra övriga designinlägg hittar du i kategorin webbdesign.
Mätning efter lansering
En SEO-anpassad webbplats bör mätas från dagen den lanseras. Lägg till webbplatsen i Search Console, skicka in sitemapen och följ rapporterna om indexering och Core Web Vitals. Följ organisk trafik, landningssidor och konverteringar separat i analysverktyget.
Under de första månaderna uppdaterar du innehåll och rubriker genom att granska vilka sidor som har fått synlighet, i vilka sökningar du visas och klickfrekvenserna. Det här är ett löpande arbete; för regelbunden rapportering och förbättring kan du få hjälp av vår tjänst SEO och analys. På hastighetssidan bör även kontinuerlig uppföljning med hastighet och prestanda ingå i den tidsplanen.
Vanliga frågor
01Ger en SEO-anpassad webbplats förstaplatsen?
Ingen design kan lova en viss placering. En SEO-anpassad struktur lägger den grund som krävs för att webbplatsen ska genomsökas rätt, förstås och ge en bra upplevelse; rankingen avgörs i sin tur av innehållets kvalitet, konkurrensen och förtroendesignaler tillsammans.
02Är min nuvarande webbplats SEO-anpassad, hur vet jag det?
Indexerings- och upplevelserapporterna i Search Console, resultaten från PageSpeed Insights och rubrikstrukturen i sidans källkod är en bra start. En omfattande teknisk genomsökning avslöjar också dolda problem som trasiga länkar och duplicerat innehåll.
03Är webbplatser byggda med JavaScript lämpliga för SEO?
De kan vara det, men innehållet måste levereras som färdig HTML för sökmotorn. Strukturer med rendering på serversidan eller statisk generering löser det här problemet från början.
04När ger SEO-arbetet resultat?
Tiden varierar med webbplatsens ålder, konkurrensen och mängden innehåll. Effekten av tekniska rättelser börjar synas efter genomsökning, medan innehåll och auktoritet oftast byggs upp under flera månader.
SEO-anpassad webbdesign gör sökbarhet till en del av webbplatsens grund i stället för ett lager som läggs till efteråt. För att tillämpa den här listan i ditt projekt redan från början, från URL-struktur till strukturerad data, kan du läsa om vår tjänst SEO-anpassad webbdesign; planerar du en ny webbplats kan du lära känna vårt övergripande tillvägagångssätt inom webbdesign.
