SEO-strategieën voor JavaScript-toepassingen

Wanneer we een website ontwikkelen, gebruiken we vaak JavaScript, omdat dit ideaal is voor het maken van innovatieve websites met meerdere client-side functionaliteiten. Een van de meest gebruikte technologieën is AJAX.
Er doorheen kaders Wat JQuery, Prototype, Mootools en andere, die het mogelijk maken om verzoeken aan de server te doen, het resultaat te ontvangen en het laden van bepaalde inhoud op de pagina te activeren zonder het web te vernieuwen en volledig transparant voor de gebruiker.
Momenteel zijn de meeste webpagina's sterk afhankelijk van JavaScript om client-side-effecten en functionaliteiten te creëren, dit brengt bekende risico's met zich mee op het gebied van SEO, linkproblemen of incompatibiliteit, technische storingen, downloadsnelheid, enz.
We zullen in deze tutorial wat zien strategieën voor het ontwikkelen van AJAX-websites en -applicaties problemen in de SEO branche voorkomen.

Voor- en nadelen van het gebruik van AJAX


De voordelen op het gebied van gebruikerservaring zijn duidelijk: snelle pagina's, minder overhead voor de server die alleen de bestelling verwerkt en de inhoud retourneert die nodig is voor de gebruiker. Veel webfunctionaliteiten van de nieuwe generatie zijn niet gemakkelijk te realiseren zonder het gebruik van JavaScript of JQuery, aangezien de gebruiker op een element van het web moet klikken en de browser niet de hele pagina hoeft bij te werken, maar slechts een blok met inhoud en zelfs verschillende informatie weergeven voor verschillende gebruikers.
Het nadeel is dat de geretourneerde inhoud mogelijk niet zichtbaar is voor zoekmachines en dat de bot de JQuery- of Ajax-code vaak niet zal ontleden. Een probleem is dat de inhoud van een pagina alleen zichtbaar is voor de browser, maar niet op de server, de manier van volgen van de robots kan ervoor zorgen dat ze bepaalde inhoud niet zien of dat sommige links mislukken omdat de robot JavaScript niet kan begrijpen die erg complex zijn .
Google heeft de Ajax- en Javascript-crawlmogelijkheden van zijn robots voortdurend verder ontwikkeld, terwijl Bing en Yahoo niet veel zijn geëvolueerd.
Zelfs zoekmachines kunnen de meest relevante inhoud voor een zoekopdracht niet nauwkeurig weergeven, dus overmatig gebruik van deze technologie kan leiden tot een slechte positionering in zoekresultaten.

Voorbeelden van html-elementen en -blokken die SEO verbeteren


Als we een blok moeten maken, laten we dan semantische namen toepassen op de klassen, dat wil zeggen, met een gevoel dat de inhoud beschrijft:
Voorbeeld van een blok dat wat inhoud toont
Het zou beter zijn om elk blok html-code een meer semantische betekenis te geven, zodat de robots kunnen begrijpen welke inhoud ze zullen tonen:
De structuur is duidelijk te traceren, zelfs als de inhoud niet in de HTML is gegenereerd. Aangezien semantische markup trefwoorden bevat, is het belangrijk om de juiste HTML-tags voor de inhoud te gebruiken, bij twijfel kunnen we de W3school Html-handleiding raadplegen.
Net als geordende of ongeordende lijsten, is een doel van definitielijsten om de lijst met gerichte inhoud weer te geven, zoals in het bovenstaande geval, het kan nieuws of een lijst met producten zijn. Dit zorgt voor meer trefwoorddichtheid, minder rommel in de code.
Een van de belangrijkste aspecten is dat de inhoud die Javascript voor de gebruiker genereert dezelfde inhoud is die exact gelijk is aan de inhoud die wordt getoond aan zoekmachines of zoekrobots.
Google geeft als mogelijke oplossing aan dat als onze website technologieën bevat waar zoekmachines geen toegang toe hebben of niet kunnen interpreteren, zoals JavaScript of Ajax, we beschrijvende tekst of bladwijzers moeten gebruiken zodat deze elementen kunnen laten zien welke inhoud zou overeenkomen. daarmee de toegankelijkheid van de site te verbeteren. Veel gebruikers gebruiken mobiele apparaten, niet-standaard browsers, verouderde software en trage verbindingen, dus ze kunnen problemen ondervinden bij het bekijken van inhoud of het gebruik van bepaalde functionaliteit.

Links en parameter op URL


Google gebruikt bij voorkeur de hasjbang als een parameter in een url, omdat het op deze manier voor u gemakkelijker is om uw links te interpreteren wanneer we een hastabang naar de site als parameter doorgeven.
Een veelgebruikt voorbeeld is op de Twitter-website. Google gebruikt het om de inhoud van die statische pagina te bewaren en op te vragen. Om te laten zien wat de herschreven URL's bevatten, volgen hier enkele voorbeelden:
Deze URL gegenereerd door een zoekopdracht is beter en meer semantisch SEO
www.miweb.com/#!madrid/productos
Deze twee url's zijn moeilijker te begrijpen voor robots, maar de laatste verbetert de semantiek ongetwijfeld enigszins.
www, miweb, com /?tmp = madrid / producten
www.miweb.com/?ciudad=madrid&seccion=productos
Zolang we kunnen doen Semantische SEO naar gegenereerde inhoud en dezelfde inhoud tonen die een gebruiker in zoekmachines zou zien, is dit geen groot probleem.

Uitschuifbare navigatiebalken en tabbladen


In het geval dat de inhoud in tabbladen wordt gedistribueerd, waarbij de inhoud verandert met behulp van jQuery of een ander raamwerk, afhankelijk van het tabblad waarin we ons positioneren, moet er een onafhankelijke url zijn voor elk tabblad, wanneer de gebruiker op een tabblad klikt, kan een verzoek worden ingediend ook naar de server worden gemaakt om volledig nieuwe inhoud te genereren. De structuur van elke link kan er ongeveer zo uitzien:
www.miweb.com?tab=verkoop
www.miwebe.com/?tab=clientes
www.miweb.com/?tab=productos
De truc met de tabbladen is gemaakt met CSS en Javascript, de server retourneert de inhoud van alle tabbladen met het eerste paginaverzoek. Wanneer de gebruiker op een tabblad klikt, zorgen de klassen die zijn gedefinieerd in CSS ervoor dat de browser de inhoud die aan een tabblad is gekoppeld, verbergt en alleen de inhoud toont die verband houdt met het aangeklikte tabblad, terwijl de andere verborgen zijn, maar ze zijn in de code dit Het is toegestaan , dus het is goed om een ​​semantische betekenis aan de structuur te geven.
Het is ook erg belangrijk om het crawlen van Javascript- of CSS-bestanden in robots.txt van onze website niet toe te staan, omdat dit de positionering en indexering van uw inhoud kan schaden en kan leiden tot het mislukken van de crawlstatistieken.
Een van de richtlijnen van Google-webmaster Er staat specifiek dat deze bestanden niet mogen worden gevolgd, maar ook niet om ze te blokkeren of te verbergen voor bots.

Google Webmasterhulpprogramma's om het crawlen te verifiëren en te analyseren


Google Webmasterhulpprogramma's geeft ons de mogelijkheid om Google te informeren door het eigendom van onze website te verifiëren. Log in met uw Google- of Gmail-account en dan kunnen we onze website verifiëren.

Nadat u de woning heeft geverifieerd, sitemap.xml om de site te crawlen en vervolgens begint Google met het indexeren van uw url's.
Het duurt ongeveer twee weken voordat de links correct worden weergegeven in Google Zoeken.
Er is geen gemakkelijke manier om te controleren of alles werkt, maar er zijn enkele hulpmiddelen om u te helpen zien wat er aan de hand is. Het beste is om de Explore as Googlebot-tool te gebruiken, die ons precies laat zien wat Google ziet bij het crawlen van de website. U hebt toegang tot Google Webmasterhulpprogramma's in Diagnostische gegevens.
Met behulp van de Google-tools voor Webmasters Tools kunnen we de geïndexeerde links controleren en deze links corrigeren of verwijderen, zodat uw website is geoptimaliseerd voor zoekmachines en links heeft zonder het risico te worden bestraft die onder andere uw SEO helpen verbeteren.Vond je deze Tutorial leuk en heb je eraan geholpen?Je kunt de auteur belonen door op deze knop te drukken om hem een ​​positief punt te geven
wave wave wave wave wave