Show sourcecode

The following files exists in this folder. Click to view.

test/ex/includes/

footer.php
header.php

header.php

1 lines UTF-8 Unix (LF)
1
<!DOCTYPE html>
<!-- Eftersom jag tänkte att överdelen och underdelen av startsidan kanske lämpligen kunde finnas med på alla sidor
(särskilt eftersom överdelen har en navigationsmeny) så har jag lagt dessa delar i varsin php-fil, vilket då ger mig två
filer jag smidigt kan inkludera på varje sida som skall ha någon eller båda av dessa delar. */

<!-- Jag har valt att skriva HTML-koden (och CSS-koden) på så vis att den upplösning för mobilskärmar som jag valt som
den minsta upplösning med vilken sidan skall visas korrekt är utgångsläget för koden, eftersom det för mig känns bäst
att för responsiv design ha ett utgångsläge från vilket man kodmässigt antingen *enbart* förstorar eller förminskar.

Ex. så innebär detta att HTML- (och CSS-koden) har som utgångsläge att visa kolumnen som i mallen för desktop-sajten är
mittenkolumnen som den översta kolumnen (tekniskt sett, den "vänstra" kolumnen, eftersom det, med min lösning, är den
vänstra kolumnen som hamnar överst), vilket enligt uppgiftsbeskrivningen skulle vara fallet för mobil-sajten. -->
<html lang='sv'>
<head>
    <title>Nicolas Dubray</title>
    <meta charset="utf-8">
    <meta name="viewport"
          content="width=device-width, initial-scale=1">
    <link rel="stylesheet" href="stylesheets/main.css" type="text/css">
    <link rel="stylesheet" href="stylesheets/responsive.css" type="text/css">
</head>
<body>
<div id="wrapper">
    <header>
        <!-- Jag har valt att för loggan inte direkt i HTML-koden skapa en img-tag som innehar logo-bilden utifall att
        jag skulle vilja påverka val av logga i CSS-filer, ex. om jag skulle vilja ange en annan logga för utskrift.
        Jag har givit divisionen nedan "logo" som ett id eftersom jag har tänkt att det på varje sida skall finnas
        maximalt en sådan här logga.

        Loggan har jag dessutom gjort till en länk som tar en till startsidan, för att göra den användarbar samt för att
        följa den logo-"standarden". -->
        <a href="startsida.php"><div id="logo"></div></a>
        <!-- Jag har omslutit de länkar genom vilka man kan navigera runt sig till sajtens olika sidor med nav-taggar,
        eftersom sådana taggar ämnade för att innehålla navigerings-element, ex. just text-länkar, liksom mina. -->
        <nav>
            <a href="ommig.php">            OM MIG         </a>
            <a href="minatjanster.php">     MINA TJÄNSTER  </a>
            <a href="showcase.php">         SHOWCASE       </a>
            <a href="kontakt.php">          KONTAKT        </a>
        </nav>
        <!-- Jag har omslutit mina nyckelord med div-taggar vilka jag givit den semantiska betydelsen "keywords" eftersom
        jag inte känner till någon HTML-tag som redan har den semantiska betydelsen. Jag har satt betydelsen som ett id
        eftersom jag har tänkt att det på varje sida maximalt skulle finnas en sådan här division för nyckelord. -->
        <div id="keywords">
            <!-- Jag har valt att lista olika mjukvaruteknologier jag behärskar, i varierande utsträckning, som del av
            en punktlista  eftersom det i mall-bilderna för både desktop- och mobil-sidan uppgiftsbeskrivningen står
            att man skulle ha en "Kort text / punkter om dig själv för att fånga intresse från en potentiell klient".
            Jag har omslutit list-föremålen med strong-taggar för att bestyrka deras vikt. -->
            <ul>
                <li><strong>C++, C#, C, Java, Python, Assembler</strong></li>
                <li><strong>HTML, PHP, CSS</strong></li>
                <li><strong>DirectX</strong></li>
            </ul>
        </div> <!-- END KEYWORDS -->
    </header>