{"id":257282,"date":"2022-12-22T12:40:00","date_gmt":"2022-12-22T09:40:00","guid":{"rendered":"https:\/\/inform.click\/utforming-av-intuitive-og-brukervennlige-404-sider\/"},"modified":"2022-12-22T12:56:00","modified_gmt":"2022-12-22T09:56:00","slug":"utforming-av-intuitive-og-brukervennlige-404-sider","status":"publish","type":"post","link":"https:\/\/inform.click\/no\/utforming-av-intuitive-og-brukervennlige-404-sider\/","title":{"rendered":"Utforming av intuitive og brukervennlige 404-sider"},"content":{"rendered":"<p>\n  Alle av oss har interagert med en 404-side p\u00e5 et tidspunkt.\n<\/p>\n<p>\n  Disse sidene vises n\u00e5r koblingen er brutt, en side er slettet, eller n\u00e5r brukeren har skrevet inn sideadressen feil. Men uansett \u00e5rsak er det fortsatt en feil som m\u00e5 fikses. I tillegg skader \u00f8delagte koblinger nettstedets rangering, og det er ikke det du trenger. SEO-aspektet p\u00e5 nettstedet ditt er utrolig viktig, s\u00e5 du vil ikke miste trafikken bare fordi du har glemt \u00e5 holde \u00f8ye med 404-varslene.\n<\/p>\n<p>\n  Selv om det er klart at 404 sider m\u00e5 fikses ASAP, kan du aldri virkelig forutsi n\u00e5r brukeren m\u00f8ter en \u00f8delagt lenke. S\u00e5 for \u00e5 v\u00e6re klar og gj\u00f8re den negative opplevelsen til en positiv, m\u00e5 du tilpasse 404-sidene dine og gj\u00f8re dem brukervennlige og intuitive.\n<\/p>\n<p>\n  Klar til \u00e5 l\u00e6re hvordan du kan gj\u00f8re det d\u00e5rlige til det gode? La oss finne ut av det.\n<\/p>\n<h5>\n  Tilpass 404-siden for nettstedet ditt<br \/>\n<\/h5>\n<p>\n  Tenk deg at du surfer p\u00e5 en utrolig fargerik og tiltalende nettside med mange interaktive elementer og plutselig snubler over en tom side med en ren &laquo;404 side ikke funnet&raquo;-melding.\n<\/p>\n<p>\n  Litt av en vekker, ikke sant?\n<\/p>\n<p>\n  404-siden skal ikke fremst\u00e5 som en ubehagelig overraskelse, dette er grunnen til at det er s\u00e5 viktig \u00e5 holde designen den samme som den generelle layouten p\u00e5 nettstedet.\n<\/p>\n<p>\n  For det, hold utseendet p\u00e5 404-siden det samme som utseendet til de andre sidene, inkludert bakgrunn, farger, fonter og andre elementer (hvis aktuelt). I tillegg tar mange nettsteder 404-siden som en mulighet til \u00e5 understreke merkevaren og minne brukerne om den en gang til.\n<\/p>\n<p>\n  N\u00e5r du designer en 404-side for nettstedet ditt, v\u00e6r oppmerksom p\u00e5 meldingen. Et godt utformet budskap er en god mulighet til \u00e5 inkludere et smart ordspill eller minne brukerne om dine produkter\/tjenester p\u00e5 en diskr\u00e9 m\u00e5te.\n<\/p>\n<h5>\n  Forklar hva som skjedde<br \/>\n<\/h5>\n<p>\n  Hvis vi ser p\u00e5 standard 404-siden under Apache, vil vi se f\u00f8lgende:\n<\/p>\n<p><a href=\"https:\/\/inform.click\/wp-content\/uploads\/2022\/11\/post-328429-63845266293ac.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-328429-63845266293ac.webp\" alt=\"\" \/><\/a><\/p>\n<p>\n  Og det er det. Brukeren har ingen anelse om hva som faktisk skjedde og hva han skal gj\u00f8re videre.\n<\/p>\n<p>\n  Fordi du bryr deg om kundene dine og \u00f8nsker \u00e5 avvise enhver ubehagelig opplevelse, gi en forklaring p\u00e5 feilen. Hoved\u00e5rsakene til 404 er vanligvis:\n<\/p>\n<ul>\n<li>Brukeren skrev feil,\n  <\/li>\n<li>Linken er brutt,\n  <\/li>\n<li>Siden eksisterer ikke,\n  <\/li>\n<li>Forbindelsen med serveren er brutt.\n  <\/li>\n<\/ul>\n<p><a href=\"https:\/\/inform.click\/wp-content\/uploads\/2022\/11\/post-328429-6384526b3603b.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-328429-6384526b3603b.webp\" alt=\"\" \/><\/a><\/p>\n<p>\n  Selvf\u00f8lgelig trenger du ikke \u00e5 liste opp alle de ovennevnte problemene. Bare s\u00f8rg for at forklaringen din er forst\u00e5elig.\n<\/p>\n<p>\n  Ved \u00e5 v\u00e6re \u00e6rlig om problemet vil du vinne over brukerne og oppmuntre dem til \u00e5 bli p\u00e5 siden og fortsette \u00e5 surfe p\u00e5 den.\n<\/p>\n<h5>\n  Lag et engasjerende budskap<br \/>\n<\/h5>\n<p>\n  404-siden er en perfekt sjanse for merkevaren til \u00e5 vise frem sin identitet gjennom et godt utformet budskap.\n<\/p>\n<p>\n  De beste eksemplene p\u00e5 404 sider inneholder ofte:\n<\/p>\n<ul>\n<li>Ordspill\n  <\/li>\n<li>Melding relatert til nettstedets produkter eller tjenester\n  <\/li>\n<li>Personlig appell,\n  <\/li>\n<li>Referanser til popkultur og gjenkjennelige hendelser.\n  <\/li>\n<\/ul>\n<p><a href=\"https:\/\/inform.click\/wp-content\/uploads\/2022\/11\/post-328429-6384526eddfe5.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-328429-6384526eddfe5.webp\" alt=\"\" \/><\/a><\/p>\n<p>\n  Fordi 404-side er en feil som standard, m\u00e5 du transformere den til noe helt motsatt aka en positiv og morsom opplevelse.\n<\/p>\n<p>\n  GitHub gjorde en str\u00e5lende jobb med tanke p\u00e5 \u00e5 designe sin 404-side. Den brukte stereotypen om utviklerne og deres kj\u00e6rlighet til &laquo;Star Wars&raquo;-sagaen og brukte den til sin egen fordel ved \u00e5 gj\u00f8re b\u00e5de de visuelle elementene og sidemeldingen umiddelbart gjenkjennelige selv av de som ikke s\u00e5 noen Star Wars-film.\n<\/p>\n<h5>\n  Tilby en handling \u00e5 ta<br \/>\n<\/h5>\n<p>\n  En oppfordring til handling er veldig viktig og er et absolutt must for et 404-siders design.\n<\/p>\n<p>\n  En bruker skal aldri sitte igjen med en tom side og null valg. S\u00e5 selv om noe som 404 skjedde, tilby et alternativ som vil f\u00f8re til en gjensidig fordel.\n<\/p>\n<p><a href=\"https:\/\/inform.click\/wp-content\/uploads\/2022\/11\/post-328429-638452729f69f.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-328429-638452729f69f.webp\" alt=\"\" \/><\/a><\/p>\n<p>\n  Noen av de mest popul\u00e6re CTAene for 404-siden er:\n<\/p>\n<ul>\n<li>en s\u00f8kelinje\n  <\/li>\n<li>hjemmeside\n  <\/li>\n<li>toppprodukter\/tjenester\n  <\/li>\n<li>registrere deg for et produkt eller et nyhetsbrev\n  <\/li>\n<li>et tilbud om en gratis pr\u00f8veperiode\n  <\/li>\n<\/ul>\n<p>\n  V\u00e6r oppmerksom p\u00e5 CTA-knappenes design. De m\u00e5 v\u00e6re lett \u00e5 oppdage og b\u00f8r ikke blande seg med bakgrunnen, ellers vil en bruker ikke legge merke til dem. Tenk ogs\u00e5 p\u00e5 CTA-knappens melding: i stedet for klisjeer som &laquo;Klikk her&raquo;, g\u00e5 med noe mer kreativt (&laquo;Se hva vi har&raquo;).\n<\/p>\n<p>\n  Legg til en s\u00f8kefelt\n<\/p>\n<p>\n  En bruker landet p\u00e5 404-siden fordi han s\u00f8kte etter noe. S\u00e5 gi dem muligheten til \u00e5 pr\u00f8ve igjen ved \u00e5 legge til en s\u00f8kefelt p\u00e5 siden.\n<\/p>\n<p>\n  Du kan st\u00f8tte det med en melding som: &laquo;Det virker som om s\u00f8ket ditt ikke er \u00e5 finne&#8230; Hvorfor ikke pr\u00f8ve igjen?&raquo; Velskrevne CTAer har h\u00f8y engasjementsrate og fungerer godt sammen med bilder.\n<\/p>\n<p>\n  Legg ogs\u00e5 til en hinttekst i s\u00f8kefeltet. En bar med en tekst f\u00e5r bedre engasjement enn en tom.\n<\/p>\n<p>\n  Legg til utgangspunkter\n<\/p>\n<p>\n  En s\u00f8kelinje p\u00e5 404-siden er ikke nok. Hva om brukerne ikke er sikre p\u00e5 hva de trenger?\n<\/p>\n<p>\n  Legg til &laquo;Hjemmeside&raquo; eller andre relevante knapper for \u00e5 navigere brukeren fra en 404-side til potensiell konvertering. I tillegg kan du legge til en &laquo;Kontakt oss&raquo;-knapp for \u00e5 \u00f8ke p\u00e5liteligheten.\n<\/p>\n<p>\n  Noen selskaper bruker 404-siden som en mulighet til \u00e5 minne om sine produkter og tjenester og plassere de tilsvarende koblingene p\u00e5 siden.\n<\/p>\n<p>\n  Vis produktene\/tjenestene dine\n<\/p>\n<p>\n  Hvis du for eksempel er en e-handelsbutikk, kan du plassere de bestselgende produktene dine p\u00e5 404-siden for \u00e5 gi brukerne en sjanse til \u00e5 oppdage de beste produktene dine og (forh\u00e5pentligvis!) kj\u00f8pe dem.\n<\/p>\n<p>\n  N\u00e5r det gjelder de andre nettstedene, kan du garantert tilby noe verdifullt til brukerne dine. Det kan v\u00e6re en gratis pr\u00f8veversjon av et produkt, et tilbud om \u00e5 melde seg p\u00e5 et kurs, eller en guide til nyttige omr\u00e5der p\u00e5 siden.\n<\/p>\n<h5>\n  Gj\u00f8r det morsomt<br \/>\n<\/h5>\n<p>\n  Som vi allerede sa ovenfor, er 404-siden en negativ opplevelse fordi brukeren ikke fikk det tiltenkte resultatet. For \u00e5 l\u00f8se problemet, gj\u00f8r siden interaktiv eller legg til et morsomt element til den.\n<\/p>\n<p><a href=\"https:\/\/inform.click\/wp-content\/uploads\/2022\/11\/post-328429-63845276e501f.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-328429-63845276e501f.webp\" alt=\"\" \/><\/a><\/p>\n<p>\n  Selv om du posisjonerer deg selv som et sv\u00e6rt profesjonelt merke, vil ikke litt humor skade. I tillegg legger mange selskaper til gamification og videoer p\u00e5 404-siden deres for \u00e5 engasjere brukeren og holde ham underholdt.\n<\/p>\n<h5>\n  Sporer 404-feilen<br \/>\n<\/h5>\n<p>\n  404-feilen er ikke brukerens sak. Men det er din oppgave \u00e5 spore den og identifisere \u00e5rsaken til feilen og brukerens reise.\n<\/p>\n<p>\n  Det er et par ting du m\u00e5 huske p\u00e5 n\u00e5r du velger et verkt\u00f8y for 404-feilsporing.\n<\/p>\n<p>\n  Vurder alle 404-feilkilder\n<\/p>\n<p>\n  En 404-feil er kanskje ikke n\u00f8dvendigvis p\u00e5 nettstedet ditt \u2013 en kunde kan \u00e5pne et gammelt nyhetsbrev og f\u00f8lge koblingen, eller det kan vises i s\u00f8keresultatene p\u00e5 Google.\n<\/p>\n<p>\n  S\u00e5 n\u00e5r du velger et verkt\u00f8y for feiloverv\u00e5king, dobbeltsjekk at det s\u00f8ker etter 404-feil overalt, slik at du kan fikse dem alle.\n<\/p>\n<p>\n  Rapport om 404 feilkostnad\n<\/p>\n<p>\n  Som nettstedeier har du sannsynligvis en million ting \u00e5 gj\u00f8re, og \u00e5 fikse 404-feil er kanskje ikke \u00f8verst p\u00e5 listen din.\n<\/p>\n<p>\n  Dette er grunnen til at du trenger et verkt\u00f8y som lar deg vite hvor mye 404-feilene dine koster. Og vi snakker ikke om penger her \u2013 det kan v\u00e6re en prosentandel av tapte konverteringer, \u00f8kt fluktfrekvens, et antall tapte brukere.\n<\/p>\n<p>\n  N\u00e5r du ser hvordan 404-feil p\u00e5virker virksomheten din, vil det v\u00e6re lettere \u00e5 prioritere oppgavene dine og flytte 404-feilene enten opp eller ned p\u00e5 listen.\n<\/p>\n<p>\n  Konstant overv\u00e5king\n<\/p>\n<p>\n  En 404-feil er ikke noe som skjer med jevne mellomrom. Det kan hende at du har det helt fint, og s\u00e5 plutselig f\u00e5r en bruker en 404.\n<\/p>\n<p>\n  Det er derfor sporingsverkt\u00f8yet ditt b\u00f8r overv\u00e5ke 404-feilene konstant og umiddelbart varsle deg n\u00e5r du finner en. P\u00e5 denne m\u00e5ten vil du kunne fikse det i tide og eliminere risikoen for at andre brukere snubler over 404-siden.\n<\/p>\n<h5>\n  Typer sporingsverkt\u00f8y<br \/>\n<\/h5>\n<p>\n  Det finnes forskjellige typer tilgjengelige sporingsverkt\u00f8y som vil hjelpe deg \u00e5 finne 404-feilen og fikse den.\n<\/p>\n<p>\n  Crawl-verkt\u00f8y\n<\/p>\n<p>\n  Crawl-verkt\u00f8y som Screaming Frog er perfekte for raskt \u00e5 skanne nettstedet ditt og sjekke det for \u00f8delagte koblinger.\n<\/p>\n<p>\n  Disse verkt\u00f8yene analyserer koblingene til nettstedet ditt og gir deg beskjed om hvilke som er \u00f8delagte og hva som er \u00e5rsaken til feilen. I tillegg er crawl-verkt\u00f8y vanligvis enkle \u00e5 administrere og installere.\n<\/p>\n<p>\n  Den st\u00f8rste feilen med slike verkt\u00f8y er at de kun analyserer lenkene p\u00e5 nettstedet ditt \u2013 og husker du hva vi sa om viktigheten av avansert analyse? I tillegg forteller ikke crawl-verkt\u00f8y deg kostnadene for en 404-feil, men hjelper deg bare med \u00e5 identifisere den.\n<\/p>\n<p>\n  Et gjennomgangsverkt\u00f8y er definitivt nyttig, og du b\u00f8r distribuere det med jevne mellomrom bare for \u00e5 sikre at alt er bra med butikken din. Men ikke glem \u00e5 utf\u00f8re regelmessige og avanserte analyser for \u00e5 sikre at det ikke er andre feil som du kanskje har forlatt ubemerket.\n<\/p>\n<p>\n  Verkt\u00f8y for tilbakekobling\n<\/p>\n<p>\n  I motsetning til gjennoms\u00f8kingsverkt\u00f8y, fokuserer tilbakekoblingsverkt\u00f8yene p\u00e5 eksterne kilder som leder brukerne til de \u00f8delagte koblingene p\u00e5 nettstedet ditt.\n<\/p>\n<p>\n  Link Explorer av Moz er et av verkt\u00f8yene som hjelper deg med \u00e5 finne nettsidene som tar brukerne til nettstedet ditt. En slik analyse er veldig nyttig for SEO-en din, da du kan eliminere 404-koblingene og forbedre rangeringen av nettstedet ditt.\n<\/p>\n<p>\n  Men igjen, p\u00e5 samme m\u00e5te som med gjennoms\u00f8kingsverkt\u00f8y, dekker tilbakekoblingssporingsverkt\u00f8yene bare ett aspekt ved \u00e5 identifisere de \u00f8delagte koblingene. Hvis du vil finne alle 404-feillenker, inkludert de i de gamle nyhetsbrevene eller p\u00e5 sosiale medier, trenger du en mer omfattende analyse.\n<\/p>\n<p>\n  Sporing med Google Analytics\n<\/p>\n<p>\n  En av de vanligste og mest effektive m\u00e5tene \u00e5 spore feilen p\u00e5 404 sider er med Google Analytics.\n<\/p>\n<p>\n  For det m\u00e5 du kopiere denne koden:\n<\/p>\n<pre><code>\n&lt;script&gt;\n&lt;![CDATA[\n\u00a0\n\u00a0\u00a0\u00a0\/\/ Create Tracker - Send to GA\n\u00a0\u00a0\u00a0\/\/ Replace UA-11111111-11 with your own Tracking ID\n\u00a0ga('create', 'UA-11111111-11');\n\u00a0\u00a0\u00a0ga('send', {\n\u00a0\u00a0\u00a0\u00a0\u00a0hitType: 'event',\n\u00a0\u00a0\u00a0\u00a0\u00a0eventCategory: '404 Response',\n\u00a0\u00a0\u00a0\u00a0\u00a0eventAction: window.location.href,\n\u00a0\u00a0\u00a0\u00a0\u00a0eventLabel: document.referrer\n});\n]]&gt;\n&lt;\/script&gt;<\/code><\/pre>\n<p>\n  og legg den til p\u00e5 404-feilsiden\/malen. Bare husk \u00e5 lime inn ID-en til Google-kontoen din i koden.\n<\/p>\n<p>\n  Etter det vil du kunne se hvilke eksakte nettadresser som for\u00e5rsaker 404-feilen og hvor folk f\u00e5r dem.\n<\/p>\n<h5>\n  Og til slutt: fiks problemet!<br \/>\n<\/h5>\n<p>\n  Ulykker vil skje og det er et faktum. Det er bedre \u00e5 ha en pen 404-side p\u00e5 forh\u00e5nd enn febrilsk \u00e5 fikse problemet mens de irriterte brukerne venter.\n<\/p>\n<p>\n  Imidlertid er 404 en feil og m\u00e5 fikses. Avhengig av feilprioriteten kan du omdirigere koblingen, gjenopprette siden eller korrigere kildelenken. Gj\u00f8r ogs\u00e5 f\u00f8lgende:\n<\/p>\n<ul>\n<li>Introduser automatiserte og vanlige 404-rapporter for \u00e5 holde \u00f8ye med 404-sider og fikse dem i tide,\n  <\/li>\n<li>Sett opp sanntidsvarsler p\u00e5 404,\n  <\/li>\n<li>Utf\u00f8r en revisjon for \u00e5 identifisere eventuelle \u00f8delagte koblinger.\n  <\/li>\n<\/ul>\n<p>\n  Alt i alt b\u00f8r en brukervennlig 404-side gi verdi for brukeren, v\u00e6re konsistent n\u00e5r det gjelder generell nettstedsdesign og hjelpe deg med \u00e5 navigere p\u00e5 nettstedet. Ved \u00e5 f\u00f8lge disse reglene vil du beholde brukerne og samtidig \u00f8ke konverteringene dine.\n<\/p>\n<\/p>\n<div id=\"PostUnique_PostSource\" style=\"padding-top: 50px\">\n  Opptakskilde: <a target=\"_blank\" rel=\"noopener nofollow\" data-pssr=\"\" href=\"http:\/\/www.instantshift.com\/2019\/10\/16\/user-friendly-404-pages\/\">instantshift.com<\/a>\n<\/div>\n","protected":false},"excerpt":{"rendered":"<p>Alle av oss har interagert med en 404-side p\u00e5 et tidspunkt. Disse sidene vises n\u00e5r koblingen er brutt, en side er slettet, eller n\u00e5r brukeren har skrevet inn sideadressen feil. Men uansett \u00e5rsak er det fortsatt en feil som m\u00e5 fikses. I tillegg skader \u00f8delagte koblinger nettstedets rangering, og det er ikke det du trenger. SEO-aspektet p\u00e5 nettstedet ditt er utrolig viktig, s\u00e5 du vil ikke miste trafikken bare fordi du har glemt \u00e5 holde \u00f8ye med 404-varslene. Selv om det er klart at 404 sider m\u00e5 fikses \u2026<\/p>\n","protected":false},"author":1,"featured_media":187867,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":"","_wp_rev_ctl_limit":""},"categories":[226,57,200],"tags":[],"class_list":["post-257282","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-laereboker","category-web-og-wordpress","category-webdesign-2"],"_links":{"self":[{"href":"https:\/\/inform.click\/no\/wp-json\/wp\/v2\/posts\/257282","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/inform.click\/no\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/inform.click\/no\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/inform.click\/no\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/inform.click\/no\/wp-json\/wp\/v2\/comments?post=257282"}],"version-history":[{"count":0,"href":"https:\/\/inform.click\/no\/wp-json\/wp\/v2\/posts\/257282\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/inform.click\/no\/wp-json\/wp\/v2\/media\/187867"}],"wp:attachment":[{"href":"https:\/\/inform.click\/no\/wp-json\/wp\/v2\/media?parent=257282"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/inform.click\/no\/wp-json\/wp\/v2\/categories?post=257282"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/inform.click\/no\/wp-json\/wp\/v2\/tags?post=257282"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}