Accentsconagua
Artikelrubrik
Någon enkel text som hjälper oss med
Läs mer?
Share
Dreaded av många webbdesigners, SEO verkar ofta som huvudvärk bättre kvar till kodare eller marknadsföring analytiker, men det finns ingen anledning att stå runt på sidan. I denna snabba handledning bygger vi en enkel HTML-mall medan du lägger ner några bra metoder som kan påverka din webbplatss SEO direkt från ordet gå.
SEO eller sökmotoroptimering är det sätt på vilket du ställer in din webbplats för att rankas mer högt av sökmotorer och påverkar hur informationen visas i sökresultaten. Borta är de dagar då du köpte Google Adwords var det bästa sättet att dyka upp på toppen av en sökfråga, särskilt eftersom många annonsörer inte är relevanta för sökresultat som har lett till att användarna missbrukar sponsrade länkar mer och mer. Adwords kommer studsa tillbaka, men det finns sätt att påverka din sökmotor som står idag.
Först måste vi förstå att sökrobotarna, särskilt Google-spindeln, läser källan till dina sidobeslutande antaganden enligt innehållet och markeringen. Logisk HTML-hierarki är avgörande när det gäller att bestämma vikten av innehåll, men buzz på internet berättar att Google också börjar basera sina resultat på din sociala närvaro såväl som din sida. Det är rätt, du kan glömma Facebook och Twitter som enkla spelverktyg, de kan hjälpa till att göra eller bryta din webbplats.
Låt oss börja med att titta på en grundläggande HTML-uppställning:
SEO Webdesign handledning
Denna struktur följer inställda standarder så att webbläsare vet vad du ska göra av din sida. Överst i vår kod fastställer vi vilken typ av dokument det är och vilket språk det är skrivet. Mellan våra taggar vi informerar webbläsaren om att vi använder standard utf-8 charset. Vi har sedan titeln på vår webbplats och vi har lagt till ett villkorligt uttalande för att ladda HTML5 shiv vilket kompenserar för kompatibilitetsproblem med IE 9. Den taggar, självklart, fastställa var innehållet på vår sida kommer att visas.
Lätt och enkelt rätt? Men i sanning har vi redan utelämnat viktig information.
Låt oss gå tillbaka till början av vår kod och lägga till följande rad kod direkt efter öppningen märka:
Den här raden berättar för sökmotorer vad som ska visas på sökresultaten direkt under din sidtitel. I så fall kan resultaten på Google presenteras som sådan:
Notera: En punkt som är mycket viktig och ofta förbises är att du ska skräddarsy både titel och Metataggar av varje sida på din webbplats specifikt för varje sidans innehåll. För titeln kan det vara så enkelt som
Koden inom vår taggar ser nu ut som följer:
SEO Webdesign handledning
Notera: För information om varför vi har försummat att inkludera meta sökord, kolla in diskussionen i kommentarerna.
Vanliga på nästan alla webbsidor är länkar till CSS-filer och Javascript-kod eller bibliotek. Om vi ska följa Googles kodningsförslag bör vi försöka hålla våra externa frågor (HTTP-förfrågningar) åtminstone, så målet är att hålla CSS och Javascript-tillgångar nere till en fil, om möjligt. Låt oss lägga till generiska förfrågningar för våra externa filer i vår mall.
För det första länkar vi till vårt externa stilark genom att lägga till följande kod strax före stängande tagg:
Nästa gör vi samma för vår Javascript-fil genom att lägga till följande rad:
Vi lägger till javascript till slutet av vår sida, strax före stänger taggen så att vår kod hamnar enligt följande:
SEO Webdesign handledning
Varför lade vi till Javascript-frågan i slutet av sidan? Två anledningar:
En annan regel att tänka på är att om du har mer än en CSS- eller Javascript-fil, följ alltid hierarkiereglerna och lägg den viktigaste filen först och lägg resten i följd. När allt kommer omkring kan du inte använda en otrolig Javascript-funktion som använder jQuery-biblioteket om du inte ringer upp jQuery-biblioteket först.
Vi är nästan färdiga med vår mall, men vi kan göra med att lägga till lite innehåll. Med införandet av HTML5 gör din webbplats SEO-vänlig blivit mycket lättare; ordentlig semantik ger sökmotorer mycket specifika instruktioner om vad du ska hitta och var du ska hitta den. Låt oss lägga till några vanliga element som vi förmodligen kommer att använda på de flesta webbplatser vi designar.
Höger under tagg och före tagg, låt oss lägga till följande rader av kod:
Webbsida namn
Artikelrubrik
Någon enkel text som hjälper oss med
Läs mer?
Vår kod ska nu visas som följer:
SEO Webdesign handledning Webbsida namn
Artikelrubrik
Någon enkel text som hjälper oss med
Läs mer?
Där vi en gång skulle ha använt div-containrar har vi nu genomfört mer beskrivande markering. De , , , , , och element beskriva deras innehåll perfekt. För mer information om var och när HTML5-element ska användas, kolla vad HTML5-läkare har att säga.
Nu har vi en mycket grundläggande sidmall som kan anpassas till något projekt så länge du håller följande regler i åtanke hela tiden:
Vi är nästan färdiga, bara 2 saker som hjälper till att göra din webbplats sökmotorvänlig.
Jag är säker på att du har läst artiklar som anger att du ska ha en webbplatskarta. Vi kommer att expandera på det genom att lägga till 2 filer till vår webbplatss rotmapp som hjälper till med att navigera och indexera din webbplats och kataloger.
För det första sitemap.xml fil. Den här filen är inget annat än en översyn av filer och mappar som du kan lägga i ordning av betydelse. I grund och botten gör vi hälften av arbetet för sökmotorerna. Jag har inkluderat en exempelfil i nedladdningspaketet. Här är förklaringen på vad det betyder och vad du ska ändra för din webbplats.
Du hittar några rader med kod som liknar detta för varje länk / mapp:
http://www.example.com/ 2011-08-31 dagligen 1,0
I sin enklaste termer är en XML-webbplatskarta, vanligen kallad Sitemap, med huvudstaden S-en lista över sidorna på din webbplats. Skapa och skicka in en webbplatskarta hjälper till att se till att Google känner till alla sidor på din webbplats, inklusive webbadresser som kanske inte kan upptäckas av Googles normala sökrobot. Googles verktyg för webbansvariga
Du kan hitta olika online-sitemapverktyg för att skapa en webbplatskarta för dig, men jag har funnit att dessa generatorer ofta inte gör det bästa jobbet för dig specifikt, så jag föredrar att göra det manuellt.
Därefter skapar vi en enkel robots.txt-fil. Den här filen finns för att lägga till villkor som robotar följer. Om du till exempel vill berätta för sökmotorer att ignorera en sida eller mapp skulle du lägga till följande kod:
Användaragent: * Tillåt: /category/design.html
Men i allmänhet kan du bara lämna filen tom. Google ger en bättre förklaring om hur du kan tillåta sidor.
Vårt sista steg, även om detta bara är en gång din webbplats är igång, är att registrera din webbplats med Googles verktyg för webbansvariga.
När du har anmält dig behöver du bara följa anvisningarna för att lägga till din webbplats och berätta för Google var du hittar både dina sitemap.xml och robots.txt-filer. Det här är de grundläggande stegen för att få resultat, men om du vill ta saker ännu längre, kolla in den här fantastiska nybörjarens genomgång om hur du använder fler funktioner.
Genom att använda den här enkla mallen gör du en bra start när du optimerar webbplatsens SEO-prestanda. Både din ranking och hur sökmotorer visar din webbplats i sökresultaten kan påverkas med bara en liten ansträngning från din sida.
Jag hoppas att du gillade den här handledningen, tack för att du läste!
