cliffable.com/about.html at main · cliffable/cliffable.com · GitHub

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

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>About Cliff Smith | Cloud Engineering Portfolio | Cliffable</title>
  <meta name="description"
    content="About Cliff Smith and Cliffable, a cloud engineering portfolio focused on building and documenting real-world AWS architecture projects.">
  <meta name="robots" content="index, follow">
  <link rel="canonical" href="https://cliffable.com/about.html">

  <!-- Google Fonts -->
  <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=Montserrat:wght@400;600&display=swap" rel="stylesheet">

  <link rel="stylesheet" href="styles.css">

  <link rel="icon" type="image/x-icon" href="/favicon/favicon.ico">
  <link rel="icon" type="image/png" sizes="32x32" href="/favicon/favicon-32x32.png">
  <link rel="icon" type="image/png" sizes="16x16" href="/favicon/favicon-16x16.png">
  <link rel="apple-touch-icon" sizes="180x180" href="/favicon/apple-touch-icon.png">
  <!-- Google tag (gtag.js) -->
  <script async src="https://www.googletagmanager.com/gtag/js?id=G-L41X6NGBMK"></script>
  <script>
    window.dataLayer = window.dataLayer || [];
    function gtag() { dataLayer.push(arguments); }
    gtag('js', new Date());

    gtag('config', 'G-L41X6NGBMK');
  </script>
</head>

<body>

  <header>
    <div class="container header-inner">
      <div class="logo">
        <a href="/">
          <img src="/assets/logos/cliffable-logo-white-v2.svg" alt="Cliffable logo" height="60">
        </a>
      </div>

      <nav class="main-nav">
        <a href="/projects/">Projects</a>
        <a href="/field-notes/">Field Notes</a>
        <a href="/about.html">About</a>
        <a href="/contact.html">Contact</a>
      </nav>

    </div>
  </header>

  <main>
    <section class="page-hero">
      <div class="container">
        <h1>About Cliff Smith</h1>
      </div>
    </section>

    <section class="about">
      <div class="container">
        <div class="about-content">
          <img src="/assets/images/cliff-smith-headshot.jpg" alt="Cliff Smith" class="about-photo">

          <div class="about-text">
            <p>
              I’m Cliff Smith, a cloud engineer building and documenting real-world AWS architecture projects through
              Cliffable.
            </p>

            <p>
              I’ve spent over 25 years as a music educator and performer, running my own teaching practice and working
              with students at all levels.
            </p>

            <p>
              That experience shapes how I approach cloud architecture — breaking systems down, thinking through design
              decisions, and building in a clear, structured way.
            </p>

            <p>
              Cliffable is where I document that work. Each project is built and written up as a <a
                href="/projects/">cloud architecture case study</a>, with diagrams, decisions, and trade-offs.
            </p>
          </div>
        </div>
      </div>
    </section>

    <section>
      <div class="container">
        <h2>How I work</h2>
        <p>
          I learn by building. Each project starts with a clear idea, then gets designed and implemented step by step.
        </p>
        <p>
          I focus on understanding how services fit together, making deliberate design decisions, and keeping the
          architecture as simple as possible.
        </p>
        <p>
          Everything is written up as I go — diagrams, decisions, and trade-offs — so the work is clear and repeatable.
        </p>
      </div>
    </section>

  </main>

  <footer>
    <div class="container footer-content">
      <div class="footer-contact">
        <p class="footer-heading">Contact</p>
        <div class="footer-links">
          <a href="mailto:mailcliffsmith@gmail.com">Email</a>
          <a href="https://www.linkedin.com/in/cliff-smith-london/" target="_blank"
            rel="noopener noreferrer">LinkedIn</a>
          <a href="https://github.com/cliffable" target="_blank" rel="noopener noreferrer">GitHub</a>
        </div>
      </div>

      <div class="footer-meta">
        <p>© 2026 Cliff Smith</p>
      </div>
    </div>
  </footer>

</body>

</html>