{"id":265247,"date":"2023-08-21T09:47:00","date_gmt":"2023-08-21T06:47:00","guid":{"rendered":"https:\/\/inform.click\/mobilvanlig-och-webbplatshastighet-tva-viktiga-saker-att-tanka-pa-nar-du-designar-en-webbplats\/"},"modified":"2023-08-21T10:11:00","modified_gmt":"2023-08-21T07:11:00","slug":"mobilvanlig-och-webbplatshastighet-tva-viktiga-saker-att-tanka-pa-nar-du-designar-en-webbplats","status":"publish","type":"post","link":"https:\/\/inform.click\/sv\/mobilvanlig-och-webbplatshastighet-tva-viktiga-saker-att-tanka-pa-nar-du-designar-en-webbplats\/","title":{"rendered":"Mobilv\u00e4nlig och webbplatshastighet \u2013 tv\u00e5 viktiga saker att t\u00e4nka p\u00e5 n\u00e4r du designar en webbplats?"},"content":{"rendered":"<p>\n  I dagens web 2.0-v\u00e4rld kretsar allt kring Internet. Om du letar efter en r\u00f6rmokare g\u00e5r du till webben. Om du letar efter lokal restaurang g\u00e5r du till webben. Om du vill k\u00f6pa ett hus, gissa vad? Du g\u00e5r till webben.\n<\/p>\n<p>\n  Inte l\u00e4ngre m\u00e4nniskor anv\u00e4nder de gula sidorna f\u00f6r att hitta ett f\u00f6retag f\u00f6r ett behov eller behov. De g\u00e5r till webben eftersom det ger den mest exakta och snabbaste informationen.\n<\/p>\n<p>\n  F\u00f6r att f\u00e5 denna information f\u00f6r fem till sju \u00e5r sedan gick en person till sitt hem eller f\u00f6retag, station\u00e4r eller b\u00e4rbar dator, h\u00e4mtade en webbl\u00e4sare och s\u00f6kmotor och gjorde en s\u00f6kning.\n<\/p>\n<p>\n  Idag har landskapet helt f\u00f6r\u00e4ndrats eftersom m\u00e4nniskor inte bara g\u00e5r till b\u00e4rbara och station\u00e4ra datorer f\u00f6r att f\u00e5 information \u2013 de anv\u00e4nder mobila enheter inklusive smartphones och surfplattor.\n<\/p>\n<h5>\n  \u00c4r din webbplats mobilv\u00e4nlig?<br \/>\n<\/h5>\n<p>\n  Det betyder att en webbplats som ser bra ut p\u00e5 en station\u00e4r eller b\u00e4rbar dator f\u00f6rmodligen inte ser s\u00e4rskilt bra ut n\u00e4r den visas via en handh\u00e5llen mobil enhet. Kopian \u00e4r alldeles f\u00f6r liten, l\u00e4nkarna \u00e4r sm\u00e5 och du m\u00e5ste bl\u00e4ddra i sidled f\u00f6r att se allt inneh\u00e5ll. Inte bara \u00e4r sajten inte anv\u00e4ndarv\u00e4nlig utan den kan nu ocks\u00e5 ha en inverkan (en mycket viktig \u2013 potentiellt extremt negativ inverkan) p\u00e5 s\u00f6kmotorerna \u2013 s\u00e4rskilt Google.\n<\/p>\n<p>\n  Vad exakt \u00f6vers\u00e4tter det ocks\u00e5? I grund och botten om din webbplats inte \u00e4r anpassningsbar f\u00f6r en mobil enhet, kan den f\u00f6rlora organisk ranking hos s\u00f6kmotorerna. Det betyder att n\u00e4r n\u00e5gon bes\u00f6ker Google p\u00e5 sin telefon eller surfplatta och s\u00f6ker efter en r\u00f6rmokare finns det en god chans att du inte kommer upp och om du g\u00f6r det kommer den med st\u00f6rsta sannolikhet inte att finnas p\u00e5 f\u00f6rsta sidan av resultaten.\n<\/p>\n<p>\n  Dessutom s\u00e4tter Google nu en &#8221;mobilv\u00e4nlig&#8221; etikett p\u00e5 sina mobila s\u00f6kresultat. En webbplats \u00e4r kvalificerad f\u00f6r denna etikett om den uppfyller f\u00f6ljande kriterier som detekteras av Googles algoritm:\n<\/p>\n<ul>\n<li>Undvik programvara som inte \u00e4r vanlig p\u00e5 mobila enheter som Adobe Flash.\n  <\/li>\n<li>Anv\u00e4nd textstorlekar som \u00e4r l\u00e4sbara utan att zooma.\n  <\/li>\n<li>L\u00e4nkarna \u00e4r placerade tillr\u00e4ckligt l\u00e5ngt ifr\u00e5n varandra s\u00e5 att den r\u00e4tta l\u00e4tt kan knackas \u00e5t f\u00f6r anv\u00e4ndaren.\n  <\/li>\n<li>Inneh\u00e5llet passar sk\u00e4rmen s\u00e5 anv\u00e4ndning beh\u00f6ver inte rullas horisontellt f\u00f6r att se.\n  <\/li>\n<\/ul>\n<h5>\n  Det mobilv\u00e4nliga testet<br \/>\n<\/h5>\n<p>\n  En webbansvarig eller f\u00f6retags\u00e4gare kan kontrollera hur mobilv\u00e4nlig deras webbplats \u00e4r genom att bes\u00f6ka <a href=\"https:\/\/www.google.com\/webmasters\/tools\/mobile-friendly\/\" target=\"_blank\" rel=\"noopener\">Googles mobilv\u00e4nliga testsida<\/a>. Om sajten inte klarar testet kommer Google att f\u00f6rse dig med information och tips om hur du g\u00f6r sajten mobilv\u00e4nlig.\n<\/p>\n<p>\n  M\u00e5nga inneh\u00e5llshanteringssystem (CMS) som WordPress, Drupal och Joomla erbjuder nu hj\u00e4lp med hur du migrerar din skrivbordsv\u00e4nliga webbplats till en anpassningsbar, mobilanpassad webbplats.\n<\/p>\n<p>\n  Innan du g\u00f6r detta vill du dock se till att du s\u00e4kerhetskopierar din nuvarande webbplats och uppdaterar ditt nuvarande CMS till den senaste versionen. I vissa situationer kommer en uppdatering till den senaste versionen automatiskt att till\u00e4mpa n\u00f6dv\u00e4ndiga s\u00e4kerhetsuppgraderingar och g\u00f6ra din webbplats mobilv\u00e4nlig. Om processen inte utl\u00f6ses automatiskt, se till att driva uppdateringen manuellt f\u00f6r att f\u00f6rhindra s\u00e4kerhetsintr\u00e5ng.\n<\/p>\n<p>\n  Om CMS du anv\u00e4nder erbjuder anpassade teman, se till att versionen du v\u00e4ljer \u00e4r mobilv\u00e4nlig. Om inte, kanske du m\u00e5ste b\u00f6rja om igen.\n<\/p>\n<h5>\n  Hur snabbt laddas din webbplats?<br \/>\n<\/h5>\n<p>\n  F\u00f6rutom att g\u00f6ra din webbplats mobilv\u00e4nlig \u00e4r en annan viktig sak att t\u00e4nka p\u00e5 n\u00e4r du designar din webbplats. Om en webbplats tar f\u00f6r l\u00e5ng tid att ladda, finns det en bra m\u00f6jlighet att anv\u00e4ndaren kommer att studsa och g\u00e5 till en som laddas snabbare. Faktum \u00e4r att enligt m\u00e5nga unders\u00f6kningar och studier f\u00f6rv\u00e4ntar sig n\u00e4stan h\u00e4lften av webbanv\u00e4ndarna att en webbplats ska laddas p\u00e5 tv\u00e5 sekunder eller mindre. Samma personer kommer att \u00f6verge en webbplats som inte laddas inom tre sekunder. F\u00f6r att g\u00f6ra saken \u00e4nnu st\u00f6rre s\u00e4ger 79 % av webbshopparna som har problem med webbplatsens prestanda att de inte kommer att \u00e5terv\u00e4nda till sajten f\u00f6r att k\u00f6pa igen och cirka 44 % av dem skulle ber\u00e4tta f\u00f6r en v\u00e4n om de hade en d\u00e5lig upplevelse av att shoppa online.\n<\/p>\n<p>\n  F\u00f6rutom att f\u00f6rlora potentiella kunder eftersom din laddningstid \u00e4r l\u00e5ng, kan en l\u00e5ngsam webbplats faktiskt skada din ranking hos Google ocks\u00e5. Det beror p\u00e5 att Google har indikerat att webbplatsens hastighet \u00e4r en av signalerna som anv\u00e4nds av dess algoritm f\u00f6r att rangordna sidor. En l\u00e5ngsam webbsidahastighet inneb\u00e4r ocks\u00e5 att s\u00f6kmotorn kan genoms\u00f6ka f\u00e4rre sidor, vilket kan inneb\u00e4ra att f\u00e4rre sidor indexeras av Google. Detta betyder i huvudsak att du tappar aff\u00e4rer om din webbplats laddas l\u00e5ngsamt.\n<\/p>\n<h5>\n  Googles test av Page Speed \u200b\u200bInsights<br \/>\n<\/h5>\n<p>\n  I likhet med det mobilv\u00e4nliga testet erbjuder Google ett kostnadsfritt verktyg f\u00f6r <a href=\"https:\/\/developers.google.com\/speed\/pagespeed\/insights\/\" target=\"_blank\" rel=\"noopener\">Page Speed \u200b\u200bInsights<\/a>. Det h\u00e4r verktyget m\u00e4ter prestandan f\u00f6r en webbsida f\u00f6r b\u00e5de station\u00e4ra och mobila enheter.\n<\/p>\n<p><a href=\"https:\/\/inform.click\/wp-content\/uploads\/2022\/11\/post-236276-6381f6fe8cd79.webp\" data-rel=\"lightbox\"><img decoding=\"async\" class=\"SDStudio-light-box-enable SDStudio-editor-tools-md-imp\" src=\"https:\/\/inform.click\/wp-content\/uploads\/2022\/11\/post-236276-6381f6fe8cd79.webp\" alt=\"\" \/><\/a><\/p>\n<p>\n  N\u00e4r du kopierar och klistrar in URL:en i verktyget kommer en po\u00e4ng mellan noll och hundra po\u00e4ng att visas. Ju h\u00f6gre po\u00e4ng desto b\u00e4ttre \u00e4r din webbplats f\u00f6r Googles algoritm och en po\u00e4ng p\u00e5 85 eller h\u00f6gre indikerar att sidan fungerar bra.\n<\/p>\n<p>\n  Med Page Speed \u200b\u200bInsights l\u00e4r du dig hur din webbplats kan f\u00f6rb\u00e4ttras p\u00e5 olika nyckelaspekter, inklusive den tid som f\u00f6rflutit fr\u00e5n det \u00f6gonblick en anv\u00e4ndare beg\u00e4r en ny sida till det \u00f6gonblick som ovansidans inneh\u00e5ll p\u00e5 den nya sidan renderas av webbl\u00e4saren. Den m\u00e4ter ocks\u00e5 den tid som f\u00f6rflutit fr\u00e5n det \u00f6gonblick en anv\u00e4ndare beg\u00e4r en ny sida till det \u00f6gonblick sidan \u00e4r helt renderad av webbl\u00e4saren.\n<\/p>\n<p>\n  Eftersom anv\u00e4ndarnas n\u00e4tverk i h\u00f6g grad kan p\u00e5verka denna hastighet, tar Page Speed \u200b\u200bInsights endast h\u00e4nsyn till de n\u00e4tverksoberoende aspekterna av sidans prestanda. Det inkluderar serverkonfigurationen, HTML-strukturen och anv\u00e4ndningen av externa resurser som bilder, CSS och JavaScript.\n<\/p>\n<p>\n  Genom att till exempel optimera din kod (inklusive att ta bort mellanslag, kommatecken och andra on\u00f6diga tecken) kan du dramatiskt <a href=\"https:\/\/inform.click\/sv\/hur-kan-jag-forbattra-wordpress-webbplatsens-hastighet-8-enkla-men-effektiva-tips\/\" title=\"\u00f6ka din sidhastighet.\">\u00f6ka din sidhastighet.<\/a> Ta ocks\u00e5 bort kodkommentarer, formatering och oanv\u00e4nd kod. Google rekommenderar att du anv\u00e4nder <a href=\"https:\/\/developer.yahoo.com\/yui\/compressor\/\" target=\"_blank\" rel=\"noopener\">YUI Compressor<\/a> f\u00f6r b\u00e5de CSS och JavaScript.\n<\/p>\n<p>\n  Minskningen av omdirigeringar kommer ocks\u00e5 att f\u00f6rb\u00e4ttra webbplatsens hastighet. Det beror p\u00e5 att varje g\u00e5ng en sida omdirigeras till en annan sida f\u00e5r bes\u00f6karen ytterligare tid att v\u00e4nta p\u00e5 att HTTP-f\u00f6rfr\u00e5gan-svarscykeln ska slutf\u00f6ras. Till exempel, om ditt mobila omdirigeringsm\u00f6nster ser ut s\u00e5 h\u00e4r: &#8221;ABC.com -&gt; www.ABC.com -&gt; m.ABC.com -&gt; m.ABC.com\/home&#8221;, g\u00f6r var och en av dessa tv\u00e5 ytterligare omdirigeringar din sida ladda l\u00e5ngsammare.\n<\/p>\n<p>\n  Webbansvariga b\u00f6r alltid anv\u00e4nda webbl\u00e4sarcache. Det inkluderar objekt som bilder, stilmallar och annat. Detta sker s\u00e5 att en bes\u00f6kare som kommer tillbaka till din webbplats inte beh\u00f6ver ladda om hela sidan. Genom att anv\u00e4nda ett verktyg som <a href=\"https:\/\/addons.mozilla.org\/en-US\/firefox\/addon\/YSlow\/\" target=\"_blank\" rel=\"noopener\">YSlow<\/a> kan du se om du redan har ett utg\u00e5ngsdatum inst\u00e4llt f\u00f6r din cache. N\u00e4r det har uppt\u00e4ckts kan du st\u00e4lla in ett &#8221;expires&#8221;-huvud f\u00f6r hur l\u00e4nge du vill att informationen ska cachelagras. Om inte din webbplats \u00e4ndras ofta \u00e4r ett \u00e5r en rimlig tid att st\u00e4lla in den p\u00e5.\n<\/p>\n<p><a href=\"https:\/\/inform.click\/wp-content\/uploads\/2022\/11\/post-236276-6381f7009187a.webp\" data-rel=\"lightbox\"><img decoding=\"async\" class=\"SDStudio-light-box-enable SDStudio-editor-tools-md-imp\" src=\"https:\/\/inform.click\/wp-content\/uploads\/2022\/11\/post-236276-6381f7009187a.webp\" alt=\"\" \/><\/a><\/p>\n<p>\n  Leta alltid efter s\u00e4tt att f\u00f6rb\u00e4ttra din servers svarstid. F\u00f6r att g\u00f6ra detta titta p\u00e5 olika prestandaflaskhalsar som l\u00e5ngsamma databasfr\u00e5gor, l\u00e5ngsam routing eller brist p\u00e5 tillr\u00e4ckligt minne. Optimala serversvarstider b\u00f6r vara under 200 millisekunder.\n<\/p>\n<h5>\n  Bilder kan ocks\u00e5 spela en stor roll f\u00f6r hastigheten p\u00e5 din webbplats.<br \/>\n<\/h5>\n<p>\n  PNG \u00e4r vanligtvis det b\u00e4sta filformatet f\u00f6r grafik med f\u00e4rre \u00e4n 16 f\u00e4rger. JPEG \u00e4r i allm\u00e4nhet det perfekta formatet f\u00f6r foton. Se till att de ocks\u00e5 \u00e4r komprimerade f\u00f6r webben och \u00e4r helt inte n\u00f6dv\u00e4ndigt f\u00f6r att ladda upp 200 och 300 DPI-bilder.\n<\/p>\n<p><a href=\"https:\/\/inform.click\/wp-content\/uploads\/2022\/11\/post-236276-6381f7028727e.webp\" data-rel=\"lightbox\"><img decoding=\"async\" class=\"SDStudio-light-box-enable SDStudio-editor-tools-md-imp\" src=\"https:\/\/inform.click\/wp-content\/uploads\/2022\/11\/post-236276-6381f7028727e.webp\" alt=\"\" \/><\/a><\/p>\n<p>\n  Ett tips du kanske vill prova \u00e4r att anv\u00e4nda <a href=\"http:\/\/csssprites.com\/\" target=\"_blank\" rel=\"noopener\">CSS-sprites<\/a> f\u00f6r att skapa en mall f\u00f6r bilder som du anv\u00e4nder ofta som ikoner, din logotyp och andra vanliga knappar. CSS sprites kommer att kombinera dina bilder till en st\u00f6rre bild som laddas p\u00e5 en g\u00e5ng. Det betyder f\u00e4rre HTTP-f\u00f6rfr\u00e5gningar, vilket motsvarar att spara p\u00e5 laddningstid genom att inte tvinga anv\u00e4ndare att v\u00e4nta p\u00e5 att flera bilder ska laddas.\n<\/p>\n<p>\n  Slutligen, ett annat alternativ f\u00f6r att \u00f6ka dina webbplatsers laddningshastighet \u00e4r att anv\u00e4nda ett inneh\u00e5llsdistributionsn\u00e4tverk eller CDN. Dessa n\u00e4tverk av servrar anv\u00e4nds f\u00f6r att f\u00f6rdela belastningen av att leverera inneh\u00e5ll. I grund och botten inneb\u00e4r detta att kopior av din webbplats lagras i flera, geografiskt olika datacenter s\u00e5 att anv\u00e4ndare har snabbare och mer tillf\u00f6rlitlig \u00e5tkomst till webbplatsen var i v\u00e4rlden de fysiskt befinner sig.\n<\/p>\n<p>\n  \u00c4ven om det kan vara sp\u00e4nnande och givande att skapa en bra webbplats, vill du se till att den \u00e4r korrekt optimerad. Det inkluderar att se till att den \u00e4r mobilv\u00e4nlig och hastighetsv\u00e4nlig. Om inte finns det stor m\u00f6jlighet att du kan f\u00f6rlora potentiellt nya och \u00e5terkommande aff\u00e4rer.\n<\/p>\n<\/p>\n<div id=\"PostUnique_PostSource\" style=\"padding-top: 50px\">\n  Inspelningsk\u00e4lla: <a target=\"_blank\" rel=\"noopener nofollow\" data-pssr=\"\" href=\"http:\/\/www.instantshift.com\/2015\/09\/09\/mobile-friendly-site-speed\/\">instantshift.com<\/a>\n<\/div>\n","protected":false},"excerpt":{"rendered":"<p>I dagens web 2.0-v\u00e4rld kretsar allt kring Internet. Om du letar efter en r\u00f6rmokare g\u00e5r du till webben. Om du letar efter lokal restaurang g\u00e5r du till webben. Om du vill k\u00f6pa ett hus, gissa vad? Du g\u00e5r till webben. Inte l\u00e4ngre m\u00e4nniskor anv\u00e4nder de gula sidorna f\u00f6r att hitta ett f\u00f6retag f\u00f6r ett behov eller behov. De g\u00e5r till webben eftersom det ger den mest exakta och snabbaste informationen. F\u00f6r att f\u00e5 denna information f\u00f6r fem till sju \u00e5r sedan, skulle en person g\u00e5 till sitt hem eller f\u00f6retags skrivbord eller &#8230;<\/p>\n","protected":false},"author":1,"featured_media":155657,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":"","_wp_rev_ctl_limit":""},"categories":[61,126,204,152],"tags":[],"class_list":["post-265247","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-web-och-wordpress","category-web-verktyg","category-webbdesign","category-webbtips-och-tricks"],"_links":{"self":[{"href":"https:\/\/inform.click\/sv\/wp-json\/wp\/v2\/posts\/265247","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/inform.click\/sv\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/inform.click\/sv\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/inform.click\/sv\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/inform.click\/sv\/wp-json\/wp\/v2\/comments?post=265247"}],"version-history":[{"count":0,"href":"https:\/\/inform.click\/sv\/wp-json\/wp\/v2\/posts\/265247\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/inform.click\/sv\/wp-json\/wp\/v2\/media\/155657"}],"wp:attachment":[{"href":"https:\/\/inform.click\/sv\/wp-json\/wp\/v2\/media?parent=265247"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/inform.click\/sv\/wp-json\/wp\/v2\/categories?post=265247"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/inform.click\/sv\/wp-json\/wp\/v2\/tags?post=265247"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}