-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathinnholduuvsceo.html
More file actions
288 lines (283 loc) · 16.3 KB
/
Copy pathinnholduuvsceo.html
File metadata and controls
288 lines (283 loc) · 16.3 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
<!DOCTYPE html>
<html lang="nb">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="keywords" content="UU, SEO, Search Engines Utforming, Design, Brukervennlig">
<meta name="description" content="UU, også kjent som Universell Utforming er en av metodene for at siden din skal være tilgjengelige for alle.
Sammen med SEO er dette en bra kombo! Finn ut hvordan og hva det er!">
<meta name="author" content="Rafay Akbani">
<meta property="og:url" content="https://itstud.hiof.no/~rafaya/Spartech/innholduuvsceo.html" />
<meta property="og:type" content="article" />
<meta property="og:title" content="Spartech.no" />
<meta property="og:description" content="UU og SEO har en stor sammenheng når det kommer til god flyt og attraksjon av nettsider. Se hvorfor..." />
<meta property="og:image" content="https://itstud.hiof.no/~rafaya/Spartech/images/uuvsseo.webp" />
<meta property="og:image:alt" content="uu vs seo" />
<meta name="twitter:title" content="Spartech.no">
<meta name="twitter:card" content="website">
<meta property="twitter:domain" content="itstud.hiof.no">
<meta property="twitter:url" content="https://itstud.hiof.no/~rafaya/Spartech/innholduuvsceo.html">
<meta name="twitter:description" content="UU og SEO har en stor sammenheng når det kommer til god flyt og attraksjon av nettsider. Se hvorfor...">
<meta name="twitter:image" content="https://itstud.hiof.no/~rafaya/Spartech/images/uvsseo.webp">
<link rel="stylesheet" type="text/css" href="css/innholdstyle.css">
<link rel="apple-touch-icon" href="images/apple-touch-icon.png">
<link rel="icon" type="image/x-icon" href="images/spartech-favicon-16-16.webp">
<!--så på https://www.w3schools.com/html/html_favicon.asp tut om hvordan man legger til favicon-->
<title>UU VS SEO Article - Spartech</title>
</head>
<body>
<!--Nettside header-->
<div id="front-page-container">
<!--Nettside header-->
<header>
<!--Nettsidens hovedmeny med logo over menypunktene-->
<nav>
<a href="index.html" title="Tilbake til hovedmeny">
<img id="logo" src="images/spartech-high-resolution-logo-color-on-transparent-background.webp" alt="spartech logo"
/></a>
<!--lagde min egen logo på https://app.logo.com/dashboard/logo_e5596280-ff68-4f74-8b9f-ebeebd1777a5/your-logo-files, var gratis-->
<a href="#" id="ham-icon" aria-label="hamburger icon" onclick="hamMenu()"
><i class="fa-solid fa-bars"></i
></a>
<!--javascript knappen for hamburger meny som jeg tokk fra responsive design forelesningen
https://github.com/ackarlse/webutvikling2022-->
<ul id="nav-menu" style="display: block">
<li>
<a href="index.html"><i class="fa-solid fa-house"></i> Hjem</a>
</li>
<li>
<a href="innholduuvsceo.html"
><i class="fa-solid fa-hands-holding-circle"></i> UU vs SEO</a
>
</li>
<li>
<a href="innholdcss.html"
><i class="fa-solid fa-desktop"></i> CMS</a
>
</li>
<li>
<a href="innholdanalyse.html"
><i class="fa-solid fa-magnifying-glass-chart"></i> Analyse</a
>
</li>
<li>
<a href="kontaktoss.html"
><i class="fa-solid fa-arrow-up-right-from-square"></i>
Kontakt</a
>
</li>
</ul>
</nav>
<div class="article-img"></div>
</header>
<main>
<ul id="breadcrumbs">
<li><a href="index.html">Hjem</a></li>
<li><a href="innholduuvsceo.html">UU vs SEO</a></li>
</ul>
<div class="article-content">
<h2>Oktober 27, 2022</h2>
<h1>Universell Utforming vs Search Engine Optimization</h1>
<p>
Universell Utforming (UU) og Search Engine Optimization (SEO) er to forskjellige begreper som er nødvendig for at en nettside skal
oppnå de målene man trenger for god flyt og betjening.
Det er viktig å holde tanke på de to begrepene når det gjelder gevinst av salg, og brukervennlighet.
Man vil jo at brukeren skal få en god opplevelse når de er på siden din.
Men hva er egentlig Universell Utforming eller Search Engine Optimization?
Vi starter med å forklare grunnleggende om UU og hvorfor det er en prioritet.
Så får vi se hvordan det henger sammen med SEO.
</p>
<div class="text-line"></div>
<span class="title-colored">Universell Utforming</span>
<p>
Universell Utforming (SEO) betyr egentlig at tjenester skal være tilgjengelige for alle, altså ordet "accessibility".
Dette er et veldig viktig verktøy for at IKT-systemer, det fører til at alle får det samme brukeropplevelsen og tjenesten uavhengig av kjønn,
funksjonsevne, sykdommer, alder og utdanningsbakgrunn. Da tenker vi på de to setningene;
lik tilgang for alle, eller likeverdig tilgang hvis lik tilgang ikke er mulig er hovedmålet.
Det finnes systemer som er ment for å veilede og hjelpe de med problemer angående hørsel (døve, og dårlig hørsel),
syn (blindhet, fargeblind, og svaksynte), motorisk (responstid, dårlig tastaturbruk, og skjelvinger), og
kognisjon (læringsutfordringer, memorering av ting, og løse problemer).
</p>
<p>
Det er lovpålagt for minstekrav for Universell Utforming.
Følger man disse reglene så er man på god steg.
Alle nye nettsider skal følge minstekrav ifølge den 1. juli 2014 regelen, eksisterende nettsider trenger oppdatering på design
for å følge minstekravet etter 1.7.2014 eller senest 1.1.2021,
det skal også være et krav for tilgjengelighetserklæring fra 2023 som kommer ut snart.
Det finnes forskrifter om universell utforming som stiller krav på at nettsider oppfyller 35 av 61 suksesskriterium, ifølge WCAG 2.0.
Tre nivåer av krav: A-krav, AA-krav og AAA-krav.
De kravene kan være eksempel på at ting skal være kodet som det ser ut som (A-nivå),
man kan endre tekst til 200% størrelse uten tap av funksjon og innhold (AA-nivå) og at brukeren kan navigere på flere måter (AA-nivå).
Det finnes flere nivåer som kan leses på https://www.uutilsynet.no/wcag-standarden/wcag-20-standarden/86.
Oppnår man en fornemmelse, brukbart, forståelig og robusthet på nettsiden, fører det til god brukerveiledning, brukervennlighet og god salg.
</p>
<div class="text-line"></div>
<span class="title-colored">Search Engine Optimization</span>
<p>
Search Engine Optimization (SEO) betyr rett og slett at nettsiden skal være mer synlig for brukere som søker det på Google, Opera, osv.
Produkter og tjenester skal være relatert til søkefeltet som er viktig for alle bedrifter, det fører til bedre salg og interesse.
Hvis brukeren søker på spesifikke ting de leter etter, kan det da øke oppmerksomheten og attraksjonen for nettsiden din. En god markedsføring selvfølgelig.
SEO er fornuftig for brukeropplevelse fordi de leter etter det de trenger, og for bedriften fordi de kommer høyere opp i rangeringslista i søkefeltet.
Ved prinsipper som å bruke relevante keyword, meta descriptions, headlines, og URL med keywords kan man da sikre på at nettsiden blir mer brukervennlig og attraktiv for search engines.
</p>
<p>
Hovedmålet er å få nettside på rangering nr.1 i lista ved brukersøk.
Search Engine Optimization brukes bots som går fra en search engine til en annen og henter inn info om de sidene, deretter blir det rangert etter en indeks.
Disse indeksene er en type bibliotek hvor en search engine hjelper deg finne den nettsiden du leter etter når du søker på f.eks Google eller Bing.
Algoritmen bestemmer rekkefølge siden skal være på ifølge indeks rangeringen, ved å analysere hundrevis av faktorer og innhold.
Dette medfører til en type god User Experience. Det er på den måten bots estimerer hvor bra en nettside kan være når brukeren søker etter de trenger.
Man kan ikke betale for å være oppe på indeks lista, derfor er det god SEO prinsipp bra, og er da også en god sammenheng med UU.
</p>
<div class="text-line"></div>
<span class="title-colored">UU vs SEO Tabell</span>
</div>
<div class="table-list">
<div class="table-item"><i class="fa-solid fa-table"></i></div>
<div class="table-item">Utforming</div>
<div class="table-item">Koding</div>
<div class="table-item">UU</div>
<div class="table-info">Nettsiden er utformet på en måte slik at det skal være tilgjengelige for alle.</div>
<div class="table-info">Blir kravene fulgt, blir siden bra, riktig bruk av tags og semantiske tags</div>
<div class="table-item">SEO</div>
<div class="table-info">SEO == UU. Bra utforking fører til bedre attraksjon for brukere, og bedre gevinst for bedriften</div>
<div class="table-info">Kommer høyere opp i indeks rangeringen, som resulterer flere brukertrafikk</div>
</div>
<p id="sources">
Kilder:
https://hiof.instructure.com/courses/6307, https://www.uutilsynet.no/veiledning/kvifor-universell-utforming-av-ikt/240, https://searchengineland.com/guide/what-is-seo,
https://mailchimp.com/marketing-glossary/seo/
</p>
<div id="return-to-main-page">
<a href="#">Tilbake til startsiden ^</a>
</div>
</main>
<aside>
<article>
<img src="images/cms.webp" alt="cms picture">
<!--Image by <a href="https://www.freepik.com/free-vector/flat-design-cms-transparent-screen-with-apps_11588039.htm#query=cms&position=2&from_view=search">Freepik</a>-->
<h2>CMS</h2>
<h3>Oktober 30, 2022</h3>
<p>
Det finnes mange forskjellige CMS typer. Alle av dem kan variere med funksjoner, metoder og prinsipper...
</p>
<a class="button-article" href="innholdcss.html">Trykk her for mer</a>
</article>
<article>
<img src="images/analyze.webp" alt="analyze picture">
<!--<a href="https://www.freepik.com/free-photo/analytics-plan-strategy-insight-concept_17106787.htm#query=analyze%20website&position=4&from_view=search&track=sph">Image by rawpixel.com</a> on Freepik-->
<h2>Analyse</h2>
<h3>September 27, 2022</h3>
<p>
Nettsiden her skal bli analysert ved hjelp av verktøy. Vi skal se om SEO, UU og generelle regler blir fulgt...
</p>
<a class="button-article" href="innholdanalyse.html">Trykk her for mer</a>
</article>
</aside>
<section>
<div id="section-background"></div>
<h2 id="section-title">FAQ</h2>
<h3 id="section-undertitle">Support</h3>
<p id="section-p">Ikke nøl med å ta <a href=kontaktoss.html id="section-contact">kontakt <i class="fa-solid fa-arrow-up-right-from-square"></i>.</a> Det finnes ingen dumme spørsmål.</p>
</section>
<footer>
<div id="share-buttons">
<iframe title="fb share" src="https://www.facebook.com/plugins/share_button.php?href=https%3A%2F%2Fitstud.hiof.no%2F~rafaya%2FSpartech%2Finnholduuvsceo.html&layout=button&size=large&width=77&height=28&appId" width="77" height="28" style="border:none;overflow:hidden"
allowFullscreen allow="autoplay; clipboard-write; encrypted-media; picture-in-picture; web-share">
</iframe>
<a href="https://twitter.com/share?ref_src=twsrc%5Etfw" class="twitter-share-button" data-size="large" data-url="https://itstud.hiof.no/~rafaya/Spartech/innholduuvsceo.html" data-show-count="false">Tweet</a><script async src="https://platform.twitter.com/widgets.js"></script>
</div>
<div class="container-for-services-policies-socials">
<!--Oppsettet for footer, alle info innenfor services, policy or socials
Ideen for oppsettet fikk jeg fra https://www.youtube.com/watch?v=VUydBuotmR4-->
<div class="services-list">
<h3>Services</h3>
<ul>
<li><a href="innholduuvsceo.html">UU vs SEO</a></li>
<li><a href="innholdcss.html">CMS</a></li>
<li><a href="innholdanalyse.html">Analyse</a></li>
</ul>
</div>
<div class="policies-list">
<h3>Legals</h3>
<ul>
<li><a href="#">Cookies</a></li>
<li><a href="#">Privacy Policy</a></li>
<li><a href="#">Code of Conduct</a></li>
</ul>
</div>
<div class="socials-list">
<h3>Sosiale medier</h3>
<ul>
<li>
<a href="https://www.facebook.com/" title="Finn oss på Facebook"
><i class="fa-brands fa-square-facebook"></i
></a>
</li>
<li>
<a
href="https://www.instagram.com/"
title="Finn oss på Instagram"
><i class="fa-brands fa-square-instagram"></i
></a>
</li>
<li>
<a
href="https://twitter.com/?lang=en"
title="Finn oss på Twitter"
><i class="fa-brands fa-square-twitter"></i
></a>
</li>
<li>
<a href="https://www.linkedin.com/" title="Finn oss på LinkedIn"
><i class="fa-brands fa-linkedin"></i
></a>
</li>
</ul>
</div>
</div>
<!--slutt på første footer container oppsettet-->
<div class="container-for-contacts-copyright">
<!--Starten av samme oppsett som originale footer container, bar med kontakt info, copyright tekst or link under-->
<div class="contacts-list">
<h3>Kontakt</h3>
<ul>
<li>
<a href="tel:+4797951330"
>+47 97951330 <i class="fa-solid fa-phone"></i
></a>
</li>
<li>
<a
href="https://www.google.com/maps/@37.7887775,-122.3963437,3a,75y,227.76h,111.29t/data=!3m6!1e1!3m4!1sBDAlqbenY21wzDuFjTjxrw!2e0!7i16384!8i8192"
>
184 1st St, SF, CA, USA
<i class="fa-solid fa-map-location"></i
></a>
</li>
<li>
<a href="kontaktoss.html">Karriere <i class="fa-solid fa-handshake"></i></a>
</li>
</ul>
</div>
<div class="hidden-list">
<a href="index.html" title="Tilbake til hovedsiden"
><i class="fa-solid fa-globe"></i
></a>
</div>
<div class="copyright">
<p>
© Akbanikov Corp. is an organization that owns the
copyrighted property of © Spartech, © Akbani Investments Inc. and ©
Raf Sauer Firearms & Defense. Copyright 2022. All rights reserved.
</p>
</div>
</div>
</footer>
</div>
<!--Fikk javascriptet fra forelesningen av responive design
https://github.com/ackarlse/webutvikling2022-->
<script src="javascript/menuphone.js"></script>
<script src="https://kit.fontawesome.com/9d3da43acb.js" crossorigin="anonymous"></script>
</body>
</html>