about.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
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

<!DOCTYPE html>
<html lang="de">
  <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" />

    <!-- font general -->
    <link rel="preconnect" href="https://fonts.googleapis.com" />
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
    <link
      href="https://fonts.googleapis.com/css2?family=Inter&display=swap"
      rel="stylesheet"
    />
    <!-- font navbar -->
    <link rel="preconnect" href="https://fonts.googleapis.com" />
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
    <link
      href="https://fonts.googleapis.com/css2?family=Archivo+Black&display=swap"
      rel="stylesheet"
    />
    <!-- FA icons -->
    <link
      href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.2.1/css/all.min.css"
      rel="stylesheet"
    />
    <link rel="icon" href="images/favicon-AR.ico" type="image/x-icon" />
    <link href="style.css" rel="stylesheet" />

    <title>Arne Rief - Webentwickler</title>
  </head>
  <body>
    <!-- NAVBAR -->
    <header>
      <nav role="navigation">
        <ul>
          <li>
            <a href="index.html" aria-label="Zurück zur Hauptseite"
              ><h1>Arne Rief</h1></a
            >
          </li>
          <li>
            <a href="about.html" aria-label="Über mich Infoseite">Über mich</a>
          </li>
          <li>
            <a href="index.html#projects" aria-label="Projekte">Projekte</a>
          </li>
          <li><a href="index.html#contact" aria-label="Kontakt">Kontakt</a></li>
          <li>
            <a
              href="https://linkedin.com/in/arne-rief"
              target="_blank"
              aria-label="Mein LinkedIn Profil"
              ><i class="fa-brands fa-linkedin"></i
            ></a>
          </li>
          <li>
            <a
              href="https://github.com/Arrief"
              target="_blank"
              aria-label="Mein Github Account"
              ><i class="fa-brands fa-github"></i
            ></a>
          </li>
          <li>
            <a href="about-en.html" aria-label="Switch to English language"
              >🇬🇧</a
            >
          </li>
        </ul>
      </nav>
    </header>

    <main>
      <section class="about-section">
        <figure class="portrait-container">
          <img src="images/portrait.webp" alt="Arne Rief" />
        </figure>
        <article class="text-container text-about">
          <p>
            Hallo, mein Name ist <span class="text-emphasis">Arne Rief</span>.
            Ursprünglich hatte ich eine akademische Karriere als
            Geschichtswissenschaftler geplant, als meine natürliche Neugier und
            meine <span class="text-emphasis">Liebe fürs Lernen</span> mich dazu
            brachten, mich am Programmieren zu versuchen. Als ich dann meine
            ersten Schritte im Programmieren unternommen hatte, stellte ich
            fest, dass ich so viel Spaß daran (und offenbar auch ein Talent
            dafür) habe, dass ich mich dazu entschloss, dieses neue Hobby zu
            einem neuen Karrierepfad für mich zu machen.
          </p>
          <p>
            Bisher habe ich die Reise auf diesem neuen Pfad sehr genossen. Denn
            hier habe ich ein
            <span class="text-emphasis"
              >kreatives und dynamisches Betätigungsfeld</span
            >
            gefunden für meine
            <span class="text-emphasis"
              >analytische Denkenweise, mein Auge fürs Detail und meinen
              Antrieb, immer Neues zu lernen und sowohl persönlich als auch
              beruflich zu wachsen</span
            >. Für <span class="text-emphasis">neue Herausforderungen</span> bin
            ich immer offen und bereit. Ich freue mich darauf, von Ihnen zu
            hören!
          </p>
        </article>
      </section>
    </main>

    <!-- FOOTER -->
    <footer>
      <address>
        <dl>
          <dt>LinkedIn:</dt>
          <dd>
            <a
              href="https://linkedin.com/in/arne-rief"
              target="_blank"
              aria-label="Mein LinkedIn Profil"
              ><i class="fa-brands fa-linkedin big-icon"></i
            ></a>
          </dd>
          <dt>Github:</dt>
          <dd>
            <a
              href="https://github.com/Arrief"
              target="_blank"
              aria-label="Mein Github Account"
              ><i class="fa-brands fa-github big-icon"></i
            ></a>
          </dd>
          <dt>Email:</dt>
          <dd>
            <a href="#contact" aria-label="Zur Kontaktform">
              <i class="fa-solid fa-envelope big-icon"></i
            ></a>
          </dd>
        </dl>
      </address>
      <p>&copy; 2023 Arne Rief</p>
    </footer>
  </body>
</html>