Så här omdirigerar du mobilanvändare på din webbplats

Så här omdirigerar du mobilanvändare på din webbplats

har du någonsin försökt skriva webbadressen m.facebook.com på skrivbordet? Prova det, och du kommer att se att webbplatsen ser konstig ut på storskärmen.

på samma sätt kan du försöka öppna en slumpmässig lokal webbplats på din mobil. Du kan stöta på några webbplatser som inte är optimerade för mobil och därmed kastar du bort vid första ögonkastet. Sådana webbplatser har en tendens att förlora sin mobila publik till sina konkurrenter.

responsiv webbdesign

dessa dagar, alla bra CMS plattformar kan du bygga webbplatser med responsiv design, som anpassar sig beroende på skärmstorlek.

det är viktigt att granska hur din webbplats visas på olika enheter – det kan betyda skillnaden mellan att hålla dina besökare engagerade på din webbplats och att förlora dem, aldrig att återvända.

det är viktigt att också nämna att eftersom Google flyttade till mobile first indexing är mobilversionen av din webbplats det som räknas för Google, vilket innebär att det inte är troligt att det fungerar bra i sökningen om det får besökare att få en dålig användarupplevelse.

mobila webbplatser

även om det blir mer och mer ovanligt, vissa företag föredrar fortfarande att ha en separat webbplats för mobila användare. Detta kommer med massor av potentiella problem som lätt kan undvikas.

kontrollera att din webbplats är mobilvänlig

du kan kontrollera att din webbplats har konfigurerats korrekt för mobil genom att köra en gratis WooRank-recension.

när du går ner den separata mobilwebbplatsen, tdet finns två viktiga saker som måste tas om hand för att säkerställa en bra mobil webbupplevelse för dina mobilanvändare:

1. skapa en mobil webbplats som ger en bra användarupplevelse
2. omdirigera din webbplats för mobila användare

naturligtvis, om du har en mobil webbplats som skapats med hjälp av verktyg för lyhörd webbdesign, du skulle inte behöva oroa dig för att omdirigera dina mobila besökare.

omdirigera din mobilwebbplats

om du skapar en separat mobilwebbplats men inte konfigurerar den för att omdirigera till dina mobilanvändare på rätt sätt, skulle hela tiden och ansträngningen för att skapa en mobilwebbplats gå till spillo.

därför, idag kommer vi att diskutera de olika sätt på vilka du kan omdirigera mobila användare till din mobila webbplats. Omdirigeringar gäller endast om du har en separat mobilwebbplats.

hur omdirigerar jag till en mobil webbplats?

nu när du håller på att lära dig att omdirigera dina mobilanvändare till din mobilwebbplats, låt oss förklara hur omdirigeringen fungerar.

det finns skrivbordswebbläsaren för användare av stationära datorer och mobila webbläsare för användare av mobila enheter. Båda dessa webbläsartyper skickar data i form av en’ user-agent ’ till webbservern där din webbplats finns. Denna ’User-agent’ innehåller information som kommer att tala om för webbservern vilken typ av enhet webbläsaren öppnas i. Denna information innehåller namnet på webbläsaren, versionen och annan information om ditt operativsystem.

försök till exempel att ange följande URL på din smartphone – detectmobilebrowser.com. informationen du ser där liknar den information som skickas till din webbserver från alla mobila enheter som din webbplats nås från.

annat än ’user-agent’ – metoden för detektering finns det ytterligare en faktor som hjälper till att upptäcka mobilanvändare. Den faktorn är skärmupplösningen. Men med moderna enheter är skärmupplösningar högre för ännu mindre smarttelefonskärmar. Därför är User-agent-faktorn den vanligaste metoden som används för att identifiera mobila användare.

Låt oss nu komma till affärer och prata om de olika metoderna som du kan använda en omdirigering till din webbplats för dina mobilanvändare.

• Plugin-metoden
• Javascript-metoden
• PHP-metoden
• den .htaccess-metoden
• den nya CSS @media-metoden

Plugin-metoden

om du använder en CMS-plattform (Content Management System) som WordPress eller Joomla har du tur. De har färdiga plugins som hjälper till att omdirigera mobila användare till din mobila webbplats.

några av dessa CMS-specifika mobila omdirigeringspluggar är följande:

för WordPress –enkel mobil URL – omdirigering, WordPress Mobile Pack
för Joomla – enkel Mobildetektering
för Magento – URL-omdirigeringar
för Drupal-enkel mobil omdirigering,mobil JS-omdirigering
om din webbplats skapas i något annat CMS, prova en Google-sökning efter ett plugin som hjälper till med mobila omdirigeringar för just det CMS.

JavaScript-metoden

med en JavaScript-kod kan du omdirigera dina mobila besökare till din mobila webbplats. Denna JS-kod kan antingen upptäcka skärmstorlek eller användaragenten.

JS-koden som använder skärmstorleken finns i följande artikel: Så här omdirigerar du din webbplats till sin mobilversion.

JS-koden som använder användaragenten – den här koden i följande artice: omdirigera mobila enheter.

du kan använda båda dessa koder på din webbplats. Det finns dock nackdelar med båda dessa metoder.

i skärmstorleksmetoden definierar du skärmupplösningen men idag har vi mindre handhållna skärmar med högre upplösning. Detta kan hamna i felaktig upptäckt av mobilanvändare.

i användaragentmetoden är det svårt att hålla reda på varje ny och kommande användaragent och lägga till dem i JS-koden. Det finns många användaragenter och detta förändras ständigt med att utveckla teknik. Ta till exempel en titt på denna omfattande lista över användaragenter.

och den största nackdelen av allt är för användare som inte har JavaScript installerat på sina telefoner. Även om de flesta telefoner är utrustade med JavaScript väljer vissa att inaktivera det. Vissa gamla Blackberry-modeller stöder inte JavaScript. För att övervinna dessa hinder kan du använda omdirigering av serversidan för webbplatser kodade i PHP eller ASP.

PHP-metoden

om din webbplats är kodad i PHP kan du använda den här metoden för att omdirigera dina mobilanvändare. Fördelen med att använda den här metoden är att du inte är begränsad till webbläsare som körs på JavaScript. Du måste dock lista flera användaragenter.

för att det här skriptet ska fungera måste dina sidtillägg vara.php och ditt webbhotell måste stödja PHP. Lägg till följande kod i avsnittet

på din webbplats.

 <?php $iphone = strpos($_SERVER,"iPhone"); $android = strpos($_SERVER,"Android"); $palmpre = strpos($_SERVER,"webOS"); $berry = strpos($_SERVER,"BlackBerry"); $ipod = strpos($_SERVER,"iPod"); if ($iphone || $android || $palmpre || $ipod || $berry == true) { echo "](https://s3.amazonaws.com/woocms.woorank.com/2020/05/poor-mobile-optimization.png"; } ?>

du hittar den här koden i följande artikel: enkel PHP Mobile Website Redirect Code.

ersätt http://m.site.com med din mobila webbplats URL.

den .htaccess-metoden

en annan alternativ metod för att omdirigera mobilanvändaren till din mobilwebbplats, baserat på MIME-typen som webbläsaren stöder, är .htaccess metod. Så till exempel, om webbläsartypen stöder MIME-typen som innehåller WML (Wireless Markup Language), kommer webbläsaren från en mobil enhet.

du kan placera koden som rekommenderas i den här artikeln med titeln omdirigera till en mobil webbplats med .htaccess.

men innan du klistrar in den här koden, se till att du säkerhetskopierar din befintliga .htaccess-fil. Installera .htaccess-kod felaktigt kan orsaka problem på din webbplats. Om du inte är säker på hur du gör det själv, fråga hjälp av en webbutvecklare.

ersätt http://m.example.com med din mobila webbadress.

den nya CSS @media-metoden

CSS har en inbyggd metod för att upptäcka mobila webbläsare. Den visar sedan CSS-stilar baserat på webbläsarens fönsterstorlek. För detta behöver du inte en separat mobilwebbplats. Du behöver två stilark på en webbsida, den första för mediatypen ”skärm” (för stationära bildskärmar) och den andra för ”handhållen” mediatyp (för smartphones).

för att implementera den här metoden måste du klistra in följande uppsättning koder i taggen

i ditt HTML-dokument.

 <br /> /* Smartphones (portrait and landscape) ----------- */<br /> @media only screen<br /> and (min-device-width : 320px)<br /> and (max-device-width : 480px)<br /> /* Styles */<br />

du hittar den här koden och många andra variationer på den här sidan med titeln Media Queries for Standard Devices.

det finns många nackdelar med att använda denna metod. Det kräver att du lägger till en stor uppsättning CSS-kod på webbplatsen. Det finns fortfarande vissa enheter som inte stöder ’handhållna’ medietyper och återger sidorna med ’screen’ – skärminställningarna istället.

Således finns det många sätt att omdirigera mobila användare till din mobila webbplats, som anges ovan. Du kan placera flera skript på webbplatsens huvudsektion, till exempel skriptet som upptäcker skärmstorleken såväl som användaragenterna.

men ditt jobb är inte gjort förrän du har din mobil omdirigeringar fungerar bra för sökmotorn bots samt. Speciellt när det gäller Google finns det några konfigurationer som du behöver göra så att de skiljer mellan skrivbordsadressen och mobiladressen.

för mer information läs Google webmastercentral blogg om förändringar i ranking av smartphone sökresultat och information om Google-stödda omdirigering tekniker.

du måste lägga till en kanonisk URL till din mobilwebbplats så att Google förstår förhållandet mellan din mobil-URL och skrivbordsadress.

för att hjälpa Googlebot att upptäcka platsen för webbplatsens mobilsidor rekommenderar Google att webbplatser måste:

Lägg till en rel=”alternate” – tagg på skrivbordssidan som pekar på motsvarande mobil-URL.

Lägg till en rel=”canonical” – tagg på mobilsidan som pekar på motsvarande skrivbordsadress.

detta gör att Googles sökrobotar kan förstå förhållandet mellan de två webbadresserna – skrivbord och mobil.

när du har placerat rätt omdirigeringar på din webbplats för dina mobilanvändare är det dags att testa om omdirigeringarna fungerar bra för olika enheter. Att testa det manuellt på alla tillgängliga smarttelefonenheter är ett sätt att göra det. Men du kan också använda dessa mobila emulatorer för att testa korrekt återgivning av din mobila webbplats på olika mobila enheter.

kom ihåg att korrekt användning av mobila omdirigeringar är ett viktigt steg för att säkerställa att din mobila webbplats är sökmotorvänlig. Om din webbplats inte omdirigeras bra för dina mobilanvändare kan du också förlora många värdefulla företag. Därför, för både SEO samt positiva förändringar i omräkningskurser måste du vidta omedelbara åtgärder för att få din webbplats omdirigeras för dina mobila användare med hjälp av någon av ovanstående metoder.

detta blogginlägg uppdaterades den 15 januari 2020