-
Notifications
You must be signed in to change notification settings - Fork 0
/
colophon.html
80 lines (65 loc) · 5.83 KB
/
colophon.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
<!doctype html>
<html lang="en-GB" class="no-js">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1.0">
<title>iOlla. Colophon</title>
<link rel="icon" type="image/x-icon" href="https://iolla.net/favicon.ico" sizes="any">
<link rel="icon" type="image/svg+xml" href="https://iolla.net/favicon.svg">
<link rel="apple-touch-icon" href="https://iolla.net/apple-touch-icon.png" sizes="180x180">
<link rel="manifest" href="https://iolla.net/manifest.webmanifest">
<meta name="description" content="Technical, visual & environmental data">
<link href="https://iolla.net/assets/css/iolla.css" rel="stylesheet">
<link href="https://iolla.net/assets/css/palette.css" rel="stylesheet">
</head>
<body id="iolla-net">
<header class="header">
<a class="logo" href="https://iolla.net" rel="home">iOlla</a>
<nav class="menu">
<a class="menu-item" href="https://iolla.net/services.html">Services</a>
<a class="menu-item" href="https://iolla.net/info.html">Info</a>
<a class="menu-item" href="https://iolla.net/projects.html">Work</a>
<div class="user-toggle">
<div role="status" class="[ visually-hidden ][ js-mode-status ]"></div>
<button class="[ toggle-button ] [ js-mode-toggle ]" aria-label="Toggle website colour palette">
<span class="toggle-button__icon" aria-hidden="true"></span>
</button>
</div>
</nav>
</header>
<main class="main xlpad" role="main">
<header class="wrap">
<h1>Colophon</h1>
</header>
<div class="text wrap">
<h2><em>Technical</em></h2>
The iolla website is dynamically generated by a <a href="https://getkirby.com" rel="noreferrer" target="_blank">Kirby CMS</a> engine with liminal substrate and static deployment. User controlled <a href="https://piccalil.li/tutorial/create-a-user-controlled-dark-or-light-mode" rel="noreferrer" target="_blank">contrast mode</a> by Piccalilli. Code crafted in <a href="https://www.barebones.com/products/bbedit" rel="noreferrer" target="_blank">BBEdit</a>. SVG pictograms and icons created in <a href="https://affinity.serif.com/en-gb/designer" rel="noreferrer" target="_blank">Designer</a>. Served to you this day via <a href="https://github.com" rel="noreferrer" target="_blank">Github</a> and <a href="https://www.cloudflare.com/en-gb" rel="noreferrer" target="_blank">Cloudflare</a>.
<h2><em>Accessibility</em></h2>
From the outset I have made every effort to make my website simple, easy to use and accessible to everyone. However, the web is constantly evolving which makes this is an ongoing process. If you discover a usability or accessibility issue that I have overlooked then please let me know to help me put things right. Thank you for your assistance.
<h2><em>Sustainability</em></h2>
What is <a href="https://sustainablewebdesign.org" rel="noreferrer" target="_blank">sustainable web design</a>?<br>
<a href="https://www.websitecarbon.com/website/iolla-net" rel="noreferrer" target="_blank">Website Carbon</a><br>
<a href="https://digitalbeacon.co/report/iolla-net" rel="noreferrer" target="_blank">Digital Beacon</a><br>
<a href="https://www.thegreenwebfoundation.org/green-web-check/?url=iolla.net" rel="noreferrer" target="_blank">Green Hosting</a>
<h2><em>Visual</em></h2>
<a href="https://en.wikipedia.org/wiki/Montserrat_(typeface)" rel="noreferrer" target="_blank">Montserrat typeface</a> by Julieta Ulanovsky.
<p><a href="https://paxtonhouse.co.uk" rel="noreferrer" target="_blank">Paxton House</a> photograph used with kind permission.<br />
Variations Scotland photography by <a href="https://willcopestakemedia.com" rel="noreferrer" target="_blank">Will Copestake</a>.</p> </div>
</main>
<footer class="footer" role="contentinfo">
<nav class="footer-menu">
<ul>
<li><a class="menu-item" href="https://iolla.net">Home</a></li>
<li><a class="menu-item" href="https://iolla.net/services.html">Services</a></li>
<li><a class="menu-item" href="https://iolla.net/info.html">Info</a></li>
<li><a class="menu-item" href="https://iolla.net/projects.html">Work</a></li>
</ul>
</nav>
<div class="footer-privacy"><div><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 40 40" aria-hidden="true"><path d="M20.056 38.48c10.116 0 18.492-8.394 18.492-18.492 0-10.116-8.394-18.492-18.51-18.492-10.099 0-18.474 8.375-18.474 18.492 0 10.098 8.394 18.492 18.492 18.492Zm0-3.083c-8.557 0-15.392-6.852-15.392-15.409s6.817-15.41 15.374-15.41c8.556 0 15.41 6.853 15.428 15.41.018 8.556-6.853 15.409-15.41 15.409ZM18.061 28.6c.598 0 1.106-.29 1.468-.852l8.286-13.036c.2-.344.435-.761.435-1.16 0-.798-.725-1.323-1.486-1.323-.453 0-.907.272-1.252.815l-7.523 12.057-3.572-4.605c-.435-.58-.833-.744-1.341-.744-.78 0-1.396.635-1.396 1.451 0 .381.163.779.417 1.124l4.424 5.421c.453.598.942.851 1.54.851v.001Z" /></svg>
<a href="https://iolla.net/privacy.html">Privacy</a></div>
</div>
<div class="footer-copyright">© 2003 / 2024 <a class="colophon" href="https://iolla.net/colophon.html"><span class="iolla">iOlla</span> <span role="tooltip" class="read-iolla">Colophon</span><b class="heart"><svg viewBox="0 0 40 40" xmlns="http://www.w3.org/2000/svg"><path d="M35.453,6.86c-4.064,-4.063 -10.654,-4.063 -14.718,-0c-0.279,0.28 -0.494,0.599 -0.735,0.899c-0.241,-0.3 -0.456,-0.619 -0.735,-0.899c-4.064,-4.063 -10.654,-4.063 -14.718,-0c-4.063,4.063 -4.063,10.654 0,14.717l15.453,14.611l15.453,-14.611c4.063,-4.063 4.063,-10.654 -0,-14.717Z" /></svg></b></a></div>
<a class="footer-peak" aria-hidden="true" tabindex="-1" aria-label="return to top of page" href="#iolla-net"><svg width="100%" height="100%" viewBox="0 0 12 24"><path d="m6 2.5c-1.047 2.891-2.556 5.593-4.47 8l3.47-1.22v12.22h2v-12.22l3.47 1.22c-1.913-2.407-3.423-5.109-4.47-8z" /></svg></a>
</footer>
<script src="https://iolla.net/assets/js/script.js"></script></body>
</html>