-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathomdennesiden.html
65 lines (62 loc) · 3 KB
/
omdennesiden.html
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
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Om denne siden</title>
<script src="https://use.fontawesome.com/c53f53fb76.js"></script>
<link rel="stylesheet" type="text/css" href="css/artikler.css">
<script src="css/scripts.js"></script>
</head>
<body>
<header>
<nav class="navbar">
<h1>Oblig 2</h1>
<a class="navKnapper" href="mathml.html">MathML</a>
<a class="navKnapper" href="svg.html">SVG</a>
<a id="hjemmeKnappLink" href="index.html">
<i class="fa fa-home" aria-hidden="true"></i>
</a>
<a class="navKnapper" href="git.html">GitHub</a>
<a class="navKnapper" href="kalender.html">Kalender</a>
</nav>
</header>
<section class="wrapper">
<div class="artikkel1">
<article class="omsidenartikkel">
<h2>Om denne siden</h2>
<p>
Artikkelsidene har en main wrapper med to kolonner der hver av kolonnene dekker 50% av bredden på wrapperen. Denne artikkelen bruker to bilder og to bokser for tekst, da jeg ville ha to bilder på denne siden. Brukte boxmodel-metoden til å lage denne siden
da jeg allerede var ferdig med å designe og kode både forsiden og artikkelsidene innen jeg lærte noe om flexbox og CSS grid. På toppen av nettstedet er det en navigasjonsbar som gir linker til alle sidene på nettstedet. Brukere kan altså navigere
til hvor som helst på nettstedet uten å måtte gå tilbake til den forrige siden. På footeren på forsiden er det informasjon om forelesningstimer til web og infprog. Det er også en timer som forteller hvor lenge det er til neste oblig frist. Timeren
er laget i javascript. La inn timeren fordi det er en kul feature og det var en grei trening i javascript.
</p>
</article>
<a class="omsidenbilder" href="bilder/forsiden.png"><img src="bilder/artboard.png" width="550" height="550" alt="Sketsj av forsiden" /></a>
<a class="omsidenbilder" href="bilder/artikkel.png"><img src="bilder/artikkelfikset.png" width="550" height="550" alt="Sketsj av artikkelsiden" /></a>
<article class="omsidenartikkel">
<p>
Jeg fant inspirasjon i sidene som står i tabellen nedenfor fordi de så relativt enkle og minimalistiske. Det hadde i tillegg designelementer som jeg trodde jeg kunne implementere med den kunnskapen jeg har til nå.
</p>
<table>
<tr>
<th>URL</th>
<th>Beskrivelse</th>
</tr>
<tr>
<td><a href="https://www.douchebags.com">Hovedside</a></td>
<td>Jeg fant denne siden og likte designet.</td>
</tr>
<tr>
<td><a href="https://douchebags.com/stories-jonolssoncamo">Artikler</a></td>
<td>Dette var inspirasjonen til artikkelsidene.</td>
</tr>
<tr>
<td><a href="https://unsplash.com/">Bilder</a></td>
<td>Bildene på hovedsiden ble hentet herfra.</td>
</tr>
</table>
</article>
</div>
</section>
</body>
</html>