-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathcolophon.html
135 lines (110 loc) · 5.72 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
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
<!DOCTYPE html>
<html lang="en">
<head>
<title>Mx.Poesu • Colophon</title>
<link rel="icon" type="image/x-icon" href="images/favicon.ico">
<link rel="stylesheet" href="style.css">
<link rel="preload" href="font/ReenieBeanie.woff2" as="font" type="font/woff2" crossorigin>
<link rel="preload" href="font/Raleway.4.woff2" as="font" type="font/woff2" crossorigin>
<link rel="alternate" type="application/rss+xml" title="Mx.Poesu • artist" href="/feed.xml">
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="Portfolio of artist Mx.Poesu">
<meta name="keywords" content="artist, traditional art, drawing">
<meta name="author" content="El Poesu">
<meta property="og:description" content="View all my artworks and blog posts, find me on Fediverse, send an email, or make a donation! 🌟">
<meta property="og:image" content="images/linkPreview.webp">
<meta name="pinterest" content="nopin">
<meta name="pinterest" content="nohover">
</head>
<body>
<header id="header">
<a class="skip-link" href='#main'>Skip to content ↡</a>
<p class="skip" style="text-align: left;"><a href="index.html">↞ Back</a></p>
</header>
<main id="main">
<div class="longread">
<h1>Colophon</h1>
<p>This site is under active construction now and will always be (I like the concept of a digital garden). I've grasped the basics of HTML and CSS and strive to continue learning, it's pretty exciting. JavaScript is still foreign to me. Feel free to reach out if something's broken c:</p>
<br>
<p>The website is static and currently hosted on Github Pages.</p>
<br>
<p><b>Applications and services:</b></p>
<ul class="star">
<li><a href="https://notepad-plus-plus.org/">Notepad++</a> for manually coding every page.</li>
<li><a href="https://vertexshare.com/webp-converter.html">Webp Converter</a> to compress and convert images to .webp.</li>
<li><a href="https://thereadtime.com/">Website for calculating reading time</a>.</li>
<li><a href="https://guestbooks.meadowing.club/">Guestbooks</a> — FOSS guestbook.</li>
<li><a href="https://komments.cloud/">Komments.cloud</a> — FOSS commenting system.</li>
<li>Adobe Photoshop for editing images (mostly removing background and colour correction).</li>
<li>CorelDRAW for vector graphics.</li>
<li>FastStone Image Viewer for batch converting images.</li>
<li><a href="https://glaze.cs.uchicago.edu/">Glaze</a> for protecting artworks from genAI.</li>
</ul>
<br>
<p><b>Fonts used:</b></p>
<ul class="star">
<li><a href="https://fonts.google.com/specimen/Reenie+Beanie">Reenie Beanie</a> — headings.</li>
<li><a href="https://fonts.google.com/specimen/Raleway">Raleway</a> — main text.</li>
</ul>
<br>
<h2>To do</h2>
<ul class="star">
<li>Lazy loading backwards compatibility.</li>
<li>Spoiler (blurred images and texts).</li>
<li>Artwork placeholders.</li>
<li>Move from Github to SourceHut or something (damm, it's stupidly hard to find an alternative that allows NSFW images).</li>
</ul>
<br>
<h2>Log</h2>
<ul style="height: 200px; overflow-y: scroll;">
<li><span class="date">2025-01-28:</span> now artworks are displayed on the home page instead of a separate page.</li>
<li><span class="date">2025-01-13:</span> header and footer reworked in compliance to the DRY (don't repeat yourself) principle.</li>
<li><span class="date">2024-12-03:</span> footer completely reworked.</li>
<li><span class="date">2024-11-28:</span> moved from Giscus to Komments.cloud.</li>
<li><span class="date">2024-11-20:</span> created <a href="interests/yt.html">YouTubers library.</a></li>
<li><span class="date">2024-11-16:</span> added lots of stuff in <a href="https://mxpoesu.github.io/interests/websites.html">the Website library.</a></li>
<li><span class="date">2024-11-15:</span> starting to log significant changes!</li>
</ul>
<br>
<h2>Design history</h2>
<div style="height: 350px; overflow-y: scroll;">
<figure>
<a href="wip/design-001.webp" target="_blank"><img src="wip/design-001.webp" alt="Screenshots of the website's home page"></a>
<figcaption>2024-08-25</figcaption>
</figure>
<figure>
<a href="wip/design-002.webp" target="_blank"><img src="wip/design-002.webp" alt=""></a>
<figcaption>2024-08-28</figcaption>
</figure>
<figure>
<a href="wip/design-003.webp" target="_blank"><img src="wip/design-003.webp" alt=""></a>
<figcaption>2024-09-02</figcaption>
</figure>
<figure>
<a href="wip/design-004.webp" target="_blank"><img src="wip/design-004.webp" alt=""></a>
<figcaption>2024-09-13</figcaption>
</figure>
<figure>
<a href="wip/design-005.webp" target="_blank"><img src="wip/design-005.webp" alt=""></a>
<figcaption>2024-09-25</figcaption>
</figure>
<figure>
<a href="wip/design-006.webp" target="_blank"><img src="wip/design-006.webp" alt=""></a>
<figcaption>2024-10-20</figcaption>
</figure>
<figure>
<a href="wip/design-007.webp" target="_blank"><img src="wip/design-007.webp" alt=""></a>
<figcaption>2024-12-31</figcaption>
</figure>
<figure>
<a href="wip/design-008.webp" target="_blank"><img src="wip/design-008.webp" alt=""></a>
<figcaption>2025-01-11</figcaption>
</figure>
</div>
</div>
</main>
<a class="back-link" href='#header'>↑</a>
<p style="text-align: center; padding-bottom: 45px;">©2024—2025 by <a href="../index.html">Poesu</a> ♡</p>
</body>
</html>