-
Notifications
You must be signed in to change notification settings - Fork 8
/
Copy pathmoiety-of-reminiscence.html
154 lines (142 loc) · 7.89 KB
/
moiety-of-reminiscence.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
144
145
146
147
148
149
150
151
152
153
154
<!DOCTYPE html>
<html>
<head>
<link rel="canonical" href="https://hardmath123.github.io/moiety-of-reminiscence.html"/>
<link rel="stylesheet" type="text/css" href="/static/base.css"/>
<title>A Moiety of Reminiscence - Comfortably Numbered</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<meta charset="utf-8"/>
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<link rel="alternate" type="application/rss+xml" title="Comfortably Numbered" href="/feed.xml" />
<!--
<script src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.1/MathJax.js?config=TeX-AMS-MML_HTMLorMML"></script>
<script>
MathJax.Hub.Config({
tex2jax: {inlineMath: [['$','$']]}
});
</script>
-->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/katex.min.css" integrity="sha384-Um5gpz1odJg5Z4HAmzPtgZKdTBHZdw8S29IecapCSB31ligYPhHQZMIlWLYQGVoc" crossorigin="anonymous">
<script defer src="https://cdn.jsdelivr.net/npm/[email protected]/dist/katex.min.js" integrity="sha384-YNHdsYkH6gMx9y3mRkmcJ2mFUjTd0qNQQvY9VYZgQd7DcN7env35GzlmFaZ23JGp" crossorigin="anonymous"></script>
<script defer src="https://cdn.jsdelivr.net/npm/[email protected]/dist/contrib/auto-render.min.js" integrity="sha384-vZTG03m+2yp6N6BNi5iM4rW4oIwk5DfcNdFfxkk9ZWpDriOkXX8voJBFrAO7MpVl" crossorigin="anonymous"></script>
<script>
document.addEventListener("DOMContentLoaded", function() {
renderMathInElement(document.body, {
// customised options
// • auto-render specific keys, e.g.:
delimiters: [
{left: '$$', right: '$$', display: true},
{left: '$', right: '$', display: false},
{left: '\\begin{align}', right: '\\end{align}', display: true},
{left: '\\(', right: '\\)', display: false},
{left: '\\[', right: '\\]', display: true}
],
// • rendering keys, e.g.:
throwOnError : false
});
});
</script>
</head>
<body>
<header id="header">
<script src="static/main.js"></script>
<div>
<a href="/"><span class="left-word">Comfortably</span> <span class="right-word">Numbered</span></a>
</div>
</header>
<article id="postcontent" class="centered">
<section>
<h1>A Moiety of Reminiscence</h1>
<center><em><p>Fifty ways the web has changed</p>
</em></center>
<h4>Saturday, January 23, 2016 · 2 min read</h4>
<blockquote>
<p>I’m not old, but I’m not young either. There are some little details about
the last decade’s websites that bring me a moiety of reminiscence. Some
things have gotten better, some have gotten worse, and some are just
different: but all of them bring back memories of being a curious middle
schooler exploring the secrets of the Web.</p>
<p>Here are fifty things that remind me how far we’ve come and how far we still
have to go.</p>
</blockquote>
<p>When I was young…</p>
<ol>
<li>…you could learn HTML by clicking “view source”.</li>
<li>…you wrote your own CSS, by hand.</li>
<li>…responsive web design was still emerging, and needed copious JavaScript.</li>
<li>…all languages that compiled to JavaScript were listed on Esolangs.org.</li>
<li>…flat design hadn’t taken over. Skeuomorphism was the pretty stuff.</li>
<li>…nobody minded using the browser’s default styles for input elements.</li>
<li>…tables often had black double borders.</li>
<li>…people used the <code><FONT></code> element and the <code>BGCOLOR</code> attribute.</li>
<li>…there were two serious libraries: Underscore and MooTools.</li>
<li>…IIFE was a newfangled trend.</li>
<li>…Figuring out which key was pressed was a struggle.</li>
<li>…cross-browser compatibility was harder. Polyfills were cleverer.</li>
<li>…the best GUI editor was Sublime Text. The vim/emacs war was just as bad.</li>
<li>…“front-end framework” was synonymous with “jQuery”.</li>
<li>…you could right-click all images to save them.</li>
<li>…many people wrote HTML elements and attributes in ALL CAPS.</li>
<li>…people learned web programming from w3schools.</li>
<li>…you either proudly supported IE or proudly didn’t.</li>
<li>…too many sites had nested pull-down-on-hover menus.</li>
<li>…links you’d already clicked appeared purple on most sites.</li>
<li>…people started serious projects in PHP. On purpose.</li>
<li>…your CSS used floats and event handlers, not flexbox or <code>@media</code> queries.</li>
<li>…only Google minified and obfuscated JavaScript.</li>
<li>…colors were bolder, undiluted by today’s weak (uh, subtle) pastel colors.</li>
<li>…xkcd references were a lot 1337er.</li>
<li>…userscripts and userstyles were a much bigger deal.</li>
<li>…URLs had more question marks and ampersands and file extensions in them.</li>
<li>…the OSX “close”, “minimize”, and “maximize” buttons were bigger.</li>
<li>…there was no Node. Using <code>jsc</code> for command-line JS was a nifty hack.</li>
<li>…long polling was a thing. No WebSockets.</li>
<li>…developer tools were basically just ‘inspect element’ and a JS console.</li>
<li>…your average developer knew how to manipulate the DOM without frameworks.</li>
<li>…the hot tech projects had .com domains, not .io domains.</li>
<li>…people set the <code>LANGUAGE</code> attribute on their <code><script></code> tags.</li>
<li>…“mobile site” meant “annoying overlay prompting to install app”.</li>
<li>…we used BBCode instead of Markdown.</li>
<li>…you couldn’t search from the Safari address bar. There was a search bar.</li>
<li>…there was more URL <em>before</em> the <code>#</code> than <em>after</em>.</li>
<li>…we used screenshots of LaTeX documents for math; there was no MathJaX.</li>
<li>…gradients. Enough said.</li>
<li>…every website had some sort of sidebar.</li>
<li>…rounded rectangles might have outnumbered cornered rectangles.</li>
<li>…DOCTYPEs were gnarly beasts longer than Gettysburg Address.</li>
<li>…the Google logo had serifs and a shadow. Google Doodles didn’t move.</li>
<li>…most sites actually had <code>www</code> in their canonical URLs.</li>
<li>…plenty of respectable projects had homepages on SourceForge.</li>
<li>…image-based view counters were pretty hot.</li>
<li>…everything was beginning to look like Bootstrap.</li>
<li>…there were a lot more pop-ups.</li>
<li>…table layouts were beginning to go out of fashion.</li>
</ol>
</section>
<div id="comment-breaker">◊ ◊ ◊</div>
</article>
<footer id="footer">
<div>
<ul>
<li><a href="https://github.com/kach">
Github</a></li>
<li><a href="feed.xml">
Subscribe (RSS feed)</a></li>
<li><a href="https://twitter.com/hardmath123">
Twitter</a></li>
<li><a href="https://creativecommons.org/licenses/by-nc/3.0/deed.en_US">
CC BY-NC 3.0</a></li>
</ul>
</div>
<script>
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,'script','//www.google-analytics.com/analytics.js','ga');
ga('create', 'UA-46120535-1', 'hardmath123.github.io');
ga('require', 'displayfeatures');
ga('send', 'pageview');
</script>
</footer>
</body>
</html>