---
/2012-election.md
2012
2024-01-01
---
/ab-test#beeline-reader-text-highlighting
2024-01-01
---
/ab-test#blockquote-formatting
2024-01-01
---
/ab-test#cse
2024-01-01
---
/ab-test#deep-reinforcement-learning
2024-01-01
---
/ab-test#floating-footnotes
2024-01-01
---
/ab-test#font-size-toc-background
2024-01-01
---
/ab-test#fonts
2024-01-01
---
/ab-test#indented-paragraphs
2024-01-01
---
/ab-test#line-height
2024-01-01
---
/ab-test#list-symbol-and-font-size
2024-01-01
---
/ab-test#max-width
2024-01-01
---
/ab-test#moving-sidebar-metadata-into-page
2024-01-01
---
/ab-test#null-test
2024-01-01
---
/ab-test#section-header-capitalization
2024-01-01
---
/ab-test#text-background-color
2024-01-01
---
/ab-test#toc-formatting
2024-01-01
---
/ab-test#training-a-neural-net-to-generate-css
2024-01-01
---
/about#anonymous-feedback
2024-01-01
---
/about#colophon
2024-01-01
---
/about#information-organizing
2024-01-01
---
/about#long-content
2024-01-01
---
/about#markdown-checker
2024-01-01
---
/about#writing-checklist
2024-01-01
---
/about.md
2024-01-01
---
/archiving#fixing-redirects
2024-01-01
---
/archiving#preemptive-local-archiving
Archiving URLs § Preemptive Local Archiving
Gwern
2011-03-10
2023-03-02
<div class="page-description-annotation">
<p>Archiving the Web, because nothing lasts forever: statistics, online archive services, extracting URLs automatically from browsers, and creating a daemon to regularly back up URLs to multiple sources.</p>
</div>
<p>In 2020-02, because of the increasing difficulty of repairing old links, I switched Gwern.net’s primary linkrot defense to <strong>preemptive local archiving</strong>: automatically mirroring locally all PDFs & web pages using manually-reviewed (and edited) <a href="https://github.com/gildas-lormeau/SingleFile/" id="FNxhcGu8" class="link-annotated" data-link-icon="github" data-link-icon-type="svg" title="'SingleFile', Lormeau 2024">SingleFile</a> snapshots.</p>
<p>While it costs more time upfront (and presented some subtle UX problems like the <a href="/archiving#the-arxiv-problem">“Arxiv problem”</a>), it reduces total linkrot work.</p>
<div class="columns TOC">
<ul>
<li><a href="/archiving#link-rot" id="toc-link-rot">Link Rot</a></li>
<li><a href="/archiving#linkrot-quantities" id="toc-linkrot-quantities">Linkrot Quantities</a></li>
<li><a href="/archiving#detection" id="toc-detection">Detection</a></li>
<li><a href="/archiving#prevention" id="toc-prevention">Prevention</a>
<ul>
<li><a href="/archiving#remote-caching" id="toc-remote-caching">Remote Caching</a></li>
<li><a href="/archiving#local-caching" id="toc-local-caching">Local Caching</a>
<ul>
<li><a href="/archiving#caching-proxy" id="toc-caching-proxy">Caching Proxy</a></li>
<li><a href="/archiving#batch-job-downloads" id="toc-batch-job-downloads">Batch Job Downloads</a></li>
<li><a href="/archiving#daemon" id="toc-daemon">Daemon</a></li>
<li><a href="/archiving#cryptographic-timestamping-local-archives" id="toc-cryptographic-timestamping-local-archives">Cryptographic Timestamping Local Archives</a></li>
<li><a href="/archiving#resource-consumption" id="toc-resource-consumption">Resource Consumption</a></li>
<li><a href="/archiving#url-sources" id="toc-url-sources">URL Sources</a>
<ul>
<li><a href="/archiving#browser-history" id="toc-browser-history">Browser History</a></li>
<li><a href="/archiving#document-links" id="toc-document-links">Document Links</a></li>
<li><a href="/archiving#website-spidering" id="toc-website-spidering">Website Spidering</a></li>
</ul></li>
</ul></li>
<li><a href="/archiving#fixing-redirects" id="toc-fixing-redirects">Fixing Redirects</a>
<ul>
<li><a href="/archiving#gwern-net-redirect-fixing" id="toc-gwern-net-redirect-fixing">Gwern.net Redirect Fixing</a></li>
</ul></li>
<li><a href="/archiving#preemptive-local-archiving" title="‘Archiving URLs § Preemptive Local Archiving’, Gwern 2011" id="toc-preemptive-local-archiving">Preemptive Local Archiving</a>
<ul>
<li><a href="/archiving#local-snapshots" id="toc-local-snapshots">Local Snapshots</a></li>
<li><a href="/archiving#workflow" id="toc-workflow">Workflow</a></li>
<li><a href="/archiving#the-arxiv-problem" id="toc-the-arxiv-problem">The Arxiv Problem</a>
<ul>
<li><a href="/archiving#every-cs-problem" id="toc-every-cs-problem">Every CS Problem…</a></li>
</ul></li>
</ul></li>
</ul></li>
<li><a href="/archiving#reacting-to-broken-links" id="toc-reacting-to-broken-links">Reacting To Broken Links</a>
<ul>
<li><a href="/archiving#automatic-internet-archive-repairs" id="toc-automatic-internet-archive-repairs">Automatic Internet Archive Repairs</a>
<ul>
<li><a href="/archiving#why-not-internet-archive" title="‘Archiving URLs § Why Not Internet Archive?’, Gwern 2011" id="toc-why-not-internet-archive">Why Not Internet Archive?</a></li>
</ul></li>
</ul></li>
<li><a href="/archiving#external-links" id="toc-external-links">External Links</a></li>
<li><a href="/archiving#appendices" id="toc-appendices">Appendices</a>
<ul>
<li><a href="/archiving#filter-urls" id="toc-filter-urls"><code>filter-urls</code></a></li>
<li><a href="/archiving#sort-key-compression-trick" title="‘Archiving URLs § sort</code> key compression trick’, Gwern 2011" id="toc-sort-key-compression-trick"><code>sort</code> Key Compression Trick</a></li>
<li><a href="/archiving#cryptographic-timestamping" id="toc-cryptographic-timestamping">Cryptographic Timestamping</a></li>
</ul></li>
</ul>
</div>
---
/archiving#remote-caching
2024-01-01
---
/archiving#why-not-internet-archive
Archiving URLs § Why Not Internet Archive?
Gwern
2011-03-10
2023-03-02
<div class="page-description-annotation">
<p>Archiving the Web, because nothing lasts forever: statistics, online archive services, extracting URLs automatically from browsers, and creating a daemon to regularly back up URLs to multiple sources.</p>
</div>
<p>The Internet Archive’s archives should be rehosted when you use them, and it should not be relied on as the only host of an archived webpage: because rehosting is a better reader experience, and the <a href="https://en.wikipedia.org/wiki/Internet_Archive">IA</a> is a dangerous single-point-of-failure with several factors increasing its risk of failure.</p>
<div class="columns TOC">
<ul>
<li><a href="/archiving#link-rot" id="toc-link-rot">Link Rot</a></li>
<li><a href="/archiving#linkrot-quantities" id="toc-linkrot-quantities">Linkrot Quantities</a></li>
<li><a href="/archiving#detection" id="toc-detection">Detection</a></li>
<li><a href="/archiving#prevention" id="toc-prevention">Prevention</a>
<ul>
<li><a href="/archiving#remote-caching" id="toc-remote-caching">Remote Caching</a></li>
<li><a href="/archiving#local-caching" id="toc-local-caching">Local Caching</a>
<ul>
<li><a href="/archiving#caching-proxy" id="toc-caching-proxy">Caching Proxy</a></li>
<li><a href="/archiving#batch-job-downloads" id="toc-batch-job-downloads">Batch Job Downloads</a></li>
<li><a href="/archiving#daemon" id="toc-daemon">Daemon</a></li>
<li><a href="/archiving#cryptographic-timestamping-local-archives" id="toc-cryptographic-timestamping-local-archives">Cryptographic Timestamping Local Archives</a></li>
<li><a href="/archiving#resource-consumption" id="toc-resource-consumption">Resource Consumption</a></li>
<li><a href="/archiving#url-sources" id="toc-url-sources">URL Sources</a>
<ul>
<li><a href="/archiving#browser-history" id="toc-browser-history">Browser History</a></li>
<li><a href="/archiving#document-links" id="toc-document-links">Document Links</a></li>
<li><a href="/archiving#website-spidering" id="toc-website-spidering">Website Spidering</a></li>
</ul></li>
</ul></li>
<li><a href="/archiving#fixing-redirects" id="toc-fixing-redirects">Fixing Redirects</a>
<ul>
<li><a href="/archiving#gwern-net-redirect-fixing" id="toc-gwern-net-redirect-fixing">Gwern.net Redirect Fixing</a></li>
</ul></li>
<li><a href="/archiving#preemptive-local-archiving" title="‘Archiving URLs § Preemptive Local Archiving’, Gwern 2011" id="toc-preemptive-local-archiving">Preemptive Local Archiving</a>
<ul>
<li><a href="/archiving#local-snapshots" id="toc-local-snapshots">Local Snapshots</a></li>
<li><a href="/archiving#workflow" id="toc-workflow">Workflow</a></li>
<li><a href="/archiving#the-arxiv-problem" id="toc-the-arxiv-problem">The Arxiv Problem</a>
<ul>
<li><a href="/archiving#every-cs-problem" id="toc-every-cs-problem">Every CS Problem…</a></li>
</ul></li>
</ul></li>
</ul></li>
<li><a href="/archiving#reacting-to-broken-links" id="toc-reacting-to-broken-links">Reacting To Broken Links</a>
<ul>
<li><a href="/archiving#automatic-internet-archive-repairs" id="toc-automatic-internet-archive-repairs">Automatic Internet Archive Repairs</a>
<ul>
<li><a href="/archiving#why-not-internet-archive" title="‘Archiving URLs § Why Not Internet Archive?’, Gwern 2011" id="toc-why-not-internet-archive">Why Not Internet Archive?</a></li>
</ul></li>
</ul></li>
<li><a href="/archiving#external-links" id="toc-external-links">External Links</a></li>
<li><a href="/archiving#appendices" id="toc-appendices">Appendices</a>
<ul>
<li><a href="/archiving#filter-urls" id="toc-filter-urls"><code>filter-urls</code></a></li>
<li><a href="/archiving#sort-key-compression-trick" title="‘Archiving URLs § sort</code> key compression trick’, Gwern 2011" id="toc-sort-key-compression-trick"><code>sort</code> Key Compression Trick</a></li>
<li><a href="/archiving#cryptographic-timestamping" id="toc-cryptographic-timestamping">Cryptographic Timestamping</a></li>
</ul></li>
</ul>
</div>
---
/aria#faster
2024-01-01
---
/aunn#generalizing-mlps
2024-01-01
---
/aunn#pondering
2024-04-03
---
/backstop#black-box-vs-white-box-optimization
2024-01-01
---
/backstop#burnout
2024-08-24
---
/backstop#clune-2019
2024-01-01
---
/backstop#deep-bayes
2024-04-30
---
/backstop#internet-community-design
2024-01-01
---
/backstop#knuth
2024-01-01
---
/backstop#learning-backprop
2024-01-01
---
/backstop#meta-learning-paradigms
2024-01-01
---
/backstop#taxonomy-of-pain
2024-01-01
---
/banner#implementation-in-browser-randomization-of-banner-ads
2024-01-01
---
/banner#replication
2024-01-01
---
/banner#schlitz
2024-01-01
---
/biggan#px-biggan-downloads
2024-01-01
---
/bitcoin-is-worse-is-better#contemporary-objections
2024-01-01
---
/bitcoin-is-worse-is-better#wei-dai
2024-01-01
---
/blackmail#fanfiction
2024-01-01
---
/blackmail#march
2024-01-01
---
/blackmail#september
2024-01-01
---
/causality#overview-the-current-situation
2024-01-01
---
/changelog#2018
2024-01-01
---
/changelog#2020
2024-01-01
---
/changelog#2021
2024-01-01
---
/changelog#2022
2024-01-01
---
/changelog#2023
2024-01-01
---
/changelog#2024
2024-01-01
---
/changelog#section-2
2024-01-01
---
/charity-is-not-about-helping#koch-brothers
2024-01-01
---
/charity-is-not-about-helping#the-hope-function
2024-01-01
---
/clone#liability-threshold-model
2024-01-01
---
/co2-coin#co2-credit-flaws
2024-01-01
---
/coin-flip#cc
2024-01-01
---
/complexity#control
2024-01-01
---
/conscientiousness#conscientiousness
2024-01-01
---
/crop#figure
2024-01-01
---
/culture-is-not-about-esthetics#citation-rates
2024-01-01
---
/culture-is-not-about-esthetics#they-snatched-societys-brain
2024-01-01
---
/danbooru2021#danbooru2017
Danbooru2017 is a large-scale anime image database with 2.9m+ images annotated with 77.5m+ tags; it can be useful for machine learning purposes such as image recognition and generation.
2024-01-01
---
/danbooru2021#danbooru2018
Danbooru2018 is a large-scale anime image database with 3.3m+ images annotated with 92.7m+ tags; it can be useful for machine learning purposes such as image recognition and generation.
2024-01-01
---
/danbooru2021#danbooru2019
Danbooru2019 is a large-scale anime image database with 3.69m+ images annotated with 108m+ tags; it can be useful for machine learning purposes such as image recognition and generation.
2024-01-01
---
/danbooru2021#danbooru2020
Danbooru2020 is a large-scale anime image database with 4.2m+ images annotated with 130m+ tags; it can be useful for machine learning purposes such as image recognition and generation.
2024-01-01
---
/danbooru2021#download
2024-01-01
---
/danbooru2021#publications
2024-01-01
---
/death-note-anonymity#communicating-with-a-death-note
2024-01-01
---
/death-note-anonymity#de-anonymization
2024-01-01
---
/design#backlink
Design Of This Website § Backlink
Gwern
2010-10-01
2023-04-20
<figure><img class="float-right page-thumbnail outline invert-not" height="1140" width="1345" src="/doc/design/2020-12-25-gwern-gwernnet-recursivepopups.png" title="Screenshot of Gwern.net demonstrating recursive popup functionality, allowing arbitrarily deep hypertext exploration of references and links." alt="" /></figure><div class="page-description-annotation">
<p>Meta page describing Gwern.net, the self-documenting website’s implementation and experiments for better ‘semantic zoom’ of hypertext; technical decisions using <a href="https://en.wikipedia.org/wiki/Markdown">Markdown</a> and static hosting.</p>
</div>
<p>Gwern.net implements <a href="/doc/www/maggieappleton.com/345a8b4c553c965a0cc1a1c16e943eadc3ebc557.html" id="KMXyP41y" class="link-live" data-link-icon="maggie-appleton" data-link-icon-type="svg" data-link-icon-color="#04a4ba" data-url-archive="/doc/www/maggieappleton.com/345a8b4c553c965a0cc1a1c16e943eadc3ebc557.html" data-url-original="https://maggieappleton.com/bidirectionals" title="A Short History of Bi-Directional Links">“bidirectional”</a> <a href="https://en.wikipedia.org/wiki/Hyperlink" class="link-annotated-partial id-not link-live" data-link-icon="wikipedia" data-link-icon-type="svg" data-url-html="https://en.m.wikipedia.org/wiki/Hyperlink#bodyContent" title="Hyperlink">hyperlinks</a><a href="/design#fn6" class="footnote-ref" role="doc-noteref"><sup>6</sup></a> or <a href="https://en.wikipedia.org/wiki/Backlink" class="link-annotated-partial link-live" data-link-icon="wikipedia" data-link-icon-type="svg" data-url-html="https://en.m.wikipedia.org/wiki/Backlink#bodyContent" title="Backlink"><strong>backlinks</strong></a> (<a href="/design#backlinks" class="aux-links" data-link-icon="arrows-pointing-inwards-to-dot" data-link-icon-type="svg">eg. this page</a>): links are both forwards (the normal kind) from the current page outwards to another; but also <em>backwards</em>, showing where on other pages is the current page linked.</p>
<p>Its backlinks are especially good because popups provide frictionless navigation; and our careful implementation means they can be provided in-context near the referenced content, and even between arbitrary URLs (via annotations).</p>
<div class="columns TOC">
<ul>
<li><a href="/design#benefit" id="toc-benefit">Benefit</a></li>
<li><a href="/design#principles" id="toc-principles">Principles</a></li>
<li><a href="/design#features" id="toc-features">Features</a>
<ul>
<li><a href="/design#backlink" title="‘Design Of This Website § Backlink’, Gwern 2010" id="toc-backlink">Backlink</a>
<ul>
<li><a href="/design#backlink-features" id="toc-backlink-features">Backlink Features</a>
<ul>
<li><a href="/design#in-context" id="toc-in-context">In-Context</a></li>
<li><a href="/design#popups" id="toc-popups">Popups</a></li>
</ul></li>
<li><a href="/design#implementation" id="toc-implementation">Implementation</a>
<ul>
<li><a href="/design#other-uses" id="toc-other-uses">Other Uses</a></li>
</ul></li>
</ul></li>
<li><a href="/design#similar-links" id="toc-similar-links">Similar Links</a></li>
<li><a href="/design#link-bibliographies" id="toc-link-bibliographies">Link Bibliographies</a></li>
<li><a href="/design#tags" title="‘Design Of This Website § Tags’, Gwern 2010" id="toc-tags">Tags</a>
<ul>
<li><a href="/design#properties" id="toc-properties">Properties</a></li>
<li><a href="/design#use-appearance" id="toc-use-appearance">Use & Appearance</a></li>
<li><a href="/design#features-1" id="toc-features-1">Features</a>
<ul>
<li><a href="/design#future-tag-features" id="toc-future-tag-features">Future Tag Features</a></li>
</ul></li>
</ul></li>
</ul></li>
<li><a href="/design#abandoned" id="toc-abandoned">Abandoned</a></li>
<li><a href="/design#tools" id="toc-tools">Tools</a>
<ul>
<li><a href="/design#implementation-details" id="toc-implementation-details">Implementation Details</a></li>
</ul></li>
<li><a href="/design#external-links" id="toc-external-links">External Links</a></li>
<li><a href="/design#appendix" id="toc-appendix">Appendix</a>
<ul>
<li><a href="/design#returns-to-design" title="‘Design Of This Website § Returns To Design?’, Gwern 2010" id="toc-returns-to-design">Returns To Design?</a></li>
</ul></li>
</ul>
</div>
---
/design#future-tag-features
2024-01-01
---
/design#in-context
2024-01-01
---
/design#semantic-zoom
2024-01-01
---
/design#sort-by-magic
2024-12-11
---
/design#tags
Design Of This Website § Tags
Gwern
2010-10-01
2023-04-20
<figure><img class="float-right page-thumbnail outline invert-not" height="1140" width="1345" src="/doc/design/2020-12-25-gwern-gwernnet-recursivepopups.png" title="Screenshot of Gwern.net demonstrating recursive popup functionality, allowing arbitrarily deep hypertext exploration of references and links." alt="" /></figure><div class="page-description-annotation">
<p>Meta page describing Gwern.net, the self-documenting website’s implementation and experiments for better ‘semantic zoom’ of hypertext; technical decisions using <a href="https://en.wikipedia.org/wiki/Markdown">Markdown</a> and static hosting.</p>
</div>
<p>Gwern.net implements a simple hierarchical/DAG <a href="https://en.wikipedia.org/wiki/Tag_(metadata)" class="link-annotated-partial id-not link-live" data-link-icon="wikipedia" data-link-icon-type="svg" data-url-html="https://en.m.wikipedia.org/wiki/Tag_(metadata)#bodyContent" title="Tag (metadata)">tag</a> system for all links, modeled on <a href="https://en.wikipedia.org/wiki/Help:Category" class="link-live" data-link-icon="wikipedia" data-link-icon-type="svg" data-url-html="https://en.m.wikipedia.org/wiki/Help:Category#bodyContent" title="Help:Category">Wikipedia’s categories</a> (see <a href="/static/build/Tags.hs" id="3gozdf-1" data-link-icon="code" data-link-icon-type="svg" data-link-icon-color="#5e5086"><code>Tags.hs</code></a>).</p>
<p>It is designed to be browsed via pop-ups, and integrate naturally with the filesystem.</p>
<div class="columns TOC">
<ul>
<li><a href="/design#benefit" id="toc-benefit">Benefit</a></li>
<li><a href="/design#principles" id="toc-principles">Principles</a></li>
<li><a href="/design#features" id="toc-features">Features</a>
<ul>
<li><a href="/design#backlink" title="‘Design Of This Website § Backlink’, Gwern 2010" id="toc-backlink">Backlink</a>
<ul>
<li><a href="/design#backlink-features" id="toc-backlink-features">Backlink Features</a>
<ul>
<li><a href="/design#in-context" id="toc-in-context">In-Context</a></li>
<li><a href="/design#popups" id="toc-popups">Popups</a></li>
</ul></li>
<li><a href="/design#implementation" id="toc-implementation">Implementation</a>
<ul>
<li><a href="/design#other-uses" id="toc-other-uses">Other Uses</a></li>
</ul></li>
</ul></li>
<li><a href="/design#similar-links" id="toc-similar-links">Similar Links</a></li>
<li><a href="/design#link-bibliographies" id="toc-link-bibliographies">Link Bibliographies</a></li>
<li><a href="/design#tags" title="‘Design Of This Website § Tags’, Gwern 2010" id="toc-tags">Tags</a>
<ul>
<li><a href="/design#properties" id="toc-properties">Properties</a></li>
<li><a href="/design#use-appearance" id="toc-use-appearance">Use & Appearance</a></li>
<li><a href="/design#features-1" id="toc-features-1">Features</a>
<ul>
<li><a href="/design#future-tag-features" id="toc-future-tag-features">Future Tag Features</a></li>
</ul></li>
</ul></li>
</ul></li>
<li><a href="/design#abandoned" id="toc-abandoned">Abandoned</a></li>
<li><a href="/design#tools" id="toc-tools">Tools</a>
<ul>
<li><a href="/design#implementation-details" id="toc-implementation-details">Implementation Details</a></li>
</ul></li>
<li><a href="/design#external-links" id="toc-external-links">External Links</a></li>
<li><a href="/design#appendix" id="toc-appendix">Appendix</a>
<ul>
<li><a href="/design#returns-to-design" title="‘Design Of This Website § Returns To Design?’, Gwern 2010" id="toc-returns-to-design">Returns To Design?</a></li>
</ul></li>
</ul>
</div>
---
/design-graveyard#auto-dark-mode
2024-01-01
---
/design-graveyard#automatic-smallcaps
2024-01-01
---
/design-graveyard#disqus-comments
2024-01-01
---
/design-graveyard#djvu-files
2024-01-01
---
/design-graveyard#interviews
Design Graveyard § Interviews
Gwern
2010-10-01
2024-09-03
<figure><img class="float-right page-thumbnail outline invert-not" height="296" width="437" src="/doc/cs/linkrot/archiving/2020-03-03-meganwarnock-picardfacepalmcartoon.jpg" title="Cartoon drawing of Captain Picard facepalming, expressing my frustration with web development, my website readers, and the world in general." alt="" /></figure><div class="page-description-annotation">
<p>Meta page describing Gwern.net website design experiments and post-mortem analyses.</p>
</div>
<p>A particularly unsatisfying area of website formatting was <em>interviews</em> (and roundtables or panels or discussions in general). There is no accepted way to format interviews which can handle interviews in an easy-to-write way with clear depiction of topics & speaker transitions, and nice typography: approaches using paragraphs, tables, definition lists, and unordered lists all have flaws.</p>
<p>After using the conventional formatting of paragraph-separated speakers and experimenting with various alternatives over the years, we abandoned it for a custom approach.</p>
<p>Interviews are now formatted a two-level list of topics and then nested in that are speaker statements; these double-lists are parsed by JS to style speakers correctly and use CSS to create a 3-column layout which can be read vertically with minimal clutter.</p>
<div class="columns TOC">
<ul>
<li><a href="/design-graveyard#gitit" id="toc-gitit">Gitit</a>
<ul>
<li><a href="/design-graveyard#rss-feed" id="toc-rss-feed">RSS Feed</a></li>
</ul></li>
<li><a href="/design-graveyard#jquery-sausages-scrollbar" id="toc-jquery-sausages-scrollbar">JQuery Sausages Scrollbar</a></li>
<li><a href="/design-graveyard#beeline-reader" id="toc-beeline-reader">Beeline Reader</a></li>
<li><a href="/design-graveyard#google-custom-search-engine" id="toc-google-custom-search-engine">Google Custom Search Engine</a></li>
<li><a href="/design-graveyard#tufte-css-sidenotes" id="toc-tufte-css-sidenotes">Tufte-CSS Sidenotes</a></li>
<li><a href="/design-graveyard#djvu-files" id="toc-djvu-files">DjVu Files</a></li>
<li><a href="/design-graveyard#darcsgithub-repo" id="toc-darcsgithub-repo">Darcs/Github Repo</a></li>
<li><a href="/design-graveyard#long-urls" id="toc-long-urls">Long URLs</a>
<ul>
<li><a href="/design-graveyard#http" id="toc-http">HTTP</a></li>
<li><a href="/design-graveyard#space-separated-urls" id="toc-space-separated-urls">Space-Separated URLs</a></li>
<li><a href="/design-graveyard#www-subdomain" id="toc-www-subdomain"><code>www</code> Subdomain</a></li>
<li><a href="/design-graveyard#simplified-urls" id="toc-simplified-urls">Simplified URLs</a></li>
</ul></li>
<li><a href="/design-graveyard#ads" id="toc-ads">Ads</a></li>
<li><a href="/design-graveyard#donation-links" id="toc-donation-links">Donation Links</a></li>
<li><a href="/design-graveyard#google-web-fonts" id="toc-google-web-fonts">Google Web Fonts</a></li>
<li><a href="/design-graveyard#mathjax" id="toc-mathjax">MathJax</a></li>
<li><a href="/design-graveyard#quote-syntax-highlighting" id="toc-quote-syntax-highlighting">Quote Syntax Highlighting</a></li>
<li><a href="/design-graveyard#rubrication" id="toc-rubrication">Rubrication</a></li>
<li><a href="/design-graveyard#wikipedia-popups-js" id="toc-wikipedia-popups-js"><code>wikipedia-popups.js</code></a></li>
<li><a href="/design-graveyard#link-screenshot-previews" id="toc-link-screenshot-previews">Link Screenshot Previews</a></li>
<li><a href="/design-graveyard#automatic-dark-mode" id="toc-automatic-dark-mode">Automatic Dark Mode</a></li>
<li><a href="/design-graveyard#multi-column-footnotes" id="toc-multi-column-footnotes">Multi-Column Footnotes</a></li>
<li><a href="/design-graveyard#hyphenopoly-hyphenation" id="toc-hyphenopoly-hyphenation">Hyphenopoly Hyphenation</a></li>
<li><a href="/design-graveyard#knuth-plass-line-breaking" id="toc-knuth-plass-line-breaking">Knuth-Plass Line Breaking</a></li>
<li><a href="/design-graveyard#autopager" id="toc-autopager">Autopager</a></li>
<li><a href="/design-graveyard#automatic-smallcaps" id="toc-automatic-smallcaps">Automatic Smallcaps</a></li>
<li><a href="/design-graveyard#disqus-comments" id="toc-disqus-comments">Disqus Comments</a></li>
<li><a href="/design-graveyard#double-spaced-sentences" id="toc-double-spaced-sentences">Double-Spaced Sentences</a></li>
<li><a href="/design-graveyard#link-icon-css-regexps" title="‘Design Graveyard § Link-Icon CSS Regexps’, Gwern 2010" id="toc-link-icon-css-regexps">Link-Icon CSS Regexps</a>
<ul>
<li><a href="/design-graveyard#css-regexps" id="toc-css-regexps">CSS Regexps</a>
<ul>
<li><a href="/design-graveyard#problems" id="toc-problems">Problems</a></li>
</ul></li>
<li><a href="/design-graveyard#static-link-icon-attributes" id="toc-static-link-icon-attributes">Static Link-Icon Attributes</a>
<ul>
<li><a href="/design-graveyard#links-js" id="toc-links-js"><code>links.js</code></a></li>
<li><a href="/design-graveyard#linkicon-hs" id="toc-linkicon-hs"><code>LinkIcon.hs</code></a>
<ul>
<li><a href="/design-graveyard#features" id="toc-features">Features</a></li>
</ul></li>
</ul></li>
</ul></li>
<li><a href="/design-graveyard#reactive-archiving" id="toc-reactive-archiving">Reactive Archiving</a></li>
<li><a href="/design-graveyard#outbound-link-tracking" id="toc-outbound-link-tracking">Outbound Link Tracking</a></li>
<li><a href="/design-graveyard#popup-annotations" title="‘Design Graveyard § Popup Annotations’, Gwern 2010" id="toc-popup-annotations">Popup Annotations</a>
<ul>
<li><a href="/design-graveyard#none" id="toc-none">None</a></li>
<li><a href="/design-graveyard#tooltips" id="toc-tooltips">Tooltips</a></li>
<li><a href="/design-graveyard#wp-popups" id="toc-wp-popups">WP Popups</a></li>
<li><a href="/design-graveyard#inlined-popups" id="toc-inlined-popups">Inlined Popups</a>
<ul>
<li><a href="/design-graveyard#inlined-wp" id="toc-inlined-wp">Inlined WP</a></li>
<li><a href="/design-graveyard#link-ids-enabled-backlinks" id="toc-link-ids-enabled-backlinks">Link IDs Enabled Backlinks</a></li>
<li><a href="/design-graveyard#recursive-inlining" id="toc-recursive-inlining">Recursive Inlining</a></li>
</ul></li>
<li><a href="/design-graveyard#link-bibliographies" id="toc-link-bibliographies">Link Bibliographies</a>
<ul>
<li><a href="/design-graveyard#separate-link-bibliographies" id="toc-separate-link-bibliographies">Separate Link Bibliographies</a></li>
</ul></li>
<li><a href="/design-graveyard#standalone-annotation-complex" id="toc-standalone-annotation-complex">Standalone Annotation Complex</a>
<ul>
<li><a href="/design-graveyard#shadow-dom" id="toc-shadow-dom">Shadow DOM</a></li>
<li><a href="/design-graveyard#dynamic-wp-again" id="toc-dynamic-wp-again">Dynamic WP (Again)</a></li>
<li><a href="/design-graveyard#transcludes" id="toc-transcludes">Transcludes</a></li>
</ul></li>
</ul></li>
<li><a href="/design-graveyard#srcset-mobile-optimization" title="‘Design Graveyard § srcset</code> Mobile Optimization’, Gwern 2010" id="toc-srcset-mobile-optimization"><code>srcset</code> Mobile Optimization</a>
<ul>
<li><a href="/design-graveyard#background" id="toc-background">Background</a></li>
<li><a href="/design-graveyard#implementing-srcset" id="toc-implementing-srcset">Implementing <code>srcset</code></a></li>
<li><a href="/design-graveyard#issues-with-browser-support" id="toc-issues-with-browser-support">Issues With Browser Support</a></li>
<li><a href="/design-graveyard#inability-to-fix" id="toc-inability-to-fix">Inability to Fix</a></li>
<li><a href="/design-graveyard#conclusion" id="toc-conclusion">Conclusion</a></li>
<li><a href="/design-graveyard#postscript-manual-srcset" id="toc-postscript-manual-srcset">Postscript: Manual <code>srcset</code></a></li>
</ul></li>
<li><a href="/design-graveyard#interviews" title="‘Design Graveyard § Interviews’, Gwern 2010" id="toc-interviews">Interviews</a></li>
<li><a href="/design-graveyard#last-read-scroll-marker" id="toc-last-read-scroll-marker">Last-Read Scroll Marker</a></li>
<li><a href="/design-graveyard#navbar-previousnext-links" id="toc-navbar-previousnext-links">Navbar Previous/Next Links</a></li>
</ul>
</div>
---
/design-graveyard#link-screenshot-previews
2024-01-01
---
/design-graveyard#long-urls
2024-01-01
---
/design-graveyard#outbound-link-tracking
2024-01-01
---
/design-graveyard#popup-annotations
Design Graveyard § Popup Annotations
Gwern
2010-10-01
2024-09-03
<figure><img class="float-right page-thumbnail outline invert-not" height="296" width="437" src="/doc/cs/linkrot/archiving/2020-03-03-meganwarnock-picardfacepalmcartoon.jpg" title="Cartoon drawing of Captain Picard facepalming, expressing my frustration with web development, my website readers, and the world in general." alt="" /></figure><div class="page-description-annotation">
<p>Meta page describing Gwern.net website design experiments and post-mortem analyses.</p>
</div>
<p>The most technically complex & signature feature of Gwern.net are the on-hover popups & on-click <a href="/doc/cs/css/2021-03-28-gwern-gwernnet-annotations-mobilepopins-darkmode.png" id="gwern-2021-10" class="invert-auto" data-link-icon="image" data-link-icon-type="svg" data-image-height="1717" data-image-width="1288" data-aspect-ratio="1288 / 1717" title="Gwern 2021">popovers</a>, which provide metadata and extensive annotations/summaries/hyperlinking. Some websites provide limited popup functionality, like Wikipedia, but are missing entire swathes of functionality.</p>
<p>This is because good popups are hard both to design and implement. The Gwern.net annotation system didn’t spring into being overnight fully-formed; indeed, depending on how you count, the March 2023 system is no less than the <em>7<sup>th</sup></em> popup system we have implemented. (The jokes “time is a flat circle” and “all this has happened before, and will happen again” were made repeatedly during development.)</p>
<p>But at that point, we have a fast, flexible, debugged, good-looking system which we see no major flaws in, and future work will be focused on the content which goes <em>into</em> popups (such as by using machine learning to automatically write summaries)</p>
<div class="columns TOC">
<ul>
<li><a href="/design-graveyard#gitit" id="toc-gitit">Gitit</a>
<ul>
<li><a href="/design-graveyard#rss-feed" id="toc-rss-feed">RSS Feed</a></li>
</ul></li>
<li><a href="/design-graveyard#jquery-sausages-scrollbar" id="toc-jquery-sausages-scrollbar">JQuery Sausages Scrollbar</a></li>
<li><a href="/design-graveyard#beeline-reader" id="toc-beeline-reader">Beeline Reader</a></li>
<li><a href="/design-graveyard#google-custom-search-engine" id="toc-google-custom-search-engine">Google Custom Search Engine</a></li>
<li><a href="/design-graveyard#tufte-css-sidenotes" id="toc-tufte-css-sidenotes">Tufte-CSS Sidenotes</a></li>
<li><a href="/design-graveyard#djvu-files" id="toc-djvu-files">DjVu Files</a></li>
<li><a href="/design-graveyard#darcsgithub-repo" id="toc-darcsgithub-repo">Darcs/Github Repo</a></li>
<li><a href="/design-graveyard#long-urls" id="toc-long-urls">Long URLs</a>
<ul>
<li><a href="/design-graveyard#http" id="toc-http">HTTP</a></li>
<li><a href="/design-graveyard#space-separated-urls" id="toc-space-separated-urls">Space-Separated URLs</a></li>
<li><a href="/design-graveyard#www-subdomain" id="toc-www-subdomain"><code>www</code> Subdomain</a></li>
<li><a href="/design-graveyard#simplified-urls" id="toc-simplified-urls">Simplified URLs</a></li>
</ul></li>
<li><a href="/design-graveyard#ads" id="toc-ads">Ads</a></li>
<li><a href="/design-graveyard#donation-links" id="toc-donation-links">Donation Links</a></li>
<li><a href="/design-graveyard#google-web-fonts" id="toc-google-web-fonts">Google Web Fonts</a></li>
<li><a href="/design-graveyard#mathjax" id="toc-mathjax">MathJax</a></li>
<li><a href="/design-graveyard#quote-syntax-highlighting" id="toc-quote-syntax-highlighting">Quote Syntax Highlighting</a></li>
<li><a href="/design-graveyard#rubrication" id="toc-rubrication">Rubrication</a></li>
<li><a href="/design-graveyard#wikipedia-popups-js" id="toc-wikipedia-popups-js"><code>wikipedia-popups.js</code></a></li>
<li><a href="/design-graveyard#link-screenshot-previews" id="toc-link-screenshot-previews">Link Screenshot Previews</a></li>
<li><a href="/design-graveyard#automatic-dark-mode" id="toc-automatic-dark-mode">Automatic Dark Mode</a></li>
<li><a href="/design-graveyard#multi-column-footnotes" id="toc-multi-column-footnotes">Multi-Column Footnotes</a></li>
<li><a href="/design-graveyard#hyphenopoly-hyphenation" id="toc-hyphenopoly-hyphenation">Hyphenopoly Hyphenation</a></li>
<li><a href="/design-graveyard#knuth-plass-line-breaking" id="toc-knuth-plass-line-breaking">Knuth-Plass Line Breaking</a></li>
<li><a href="/design-graveyard#autopager" id="toc-autopager">Autopager</a></li>
<li><a href="/design-graveyard#automatic-smallcaps" id="toc-automatic-smallcaps">Automatic Smallcaps</a></li>
<li><a href="/design-graveyard#disqus-comments" id="toc-disqus-comments">Disqus Comments</a></li>
<li><a href="/design-graveyard#double-spaced-sentences" id="toc-double-spaced-sentences">Double-Spaced Sentences</a></li>
<li><a href="/design-graveyard#link-icon-css-regexps" title="‘Design Graveyard § Link-Icon CSS Regexps’, Gwern 2010" id="toc-link-icon-css-regexps">Link-Icon CSS Regexps</a>
<ul>
<li><a href="/design-graveyard#css-regexps" id="toc-css-regexps">CSS Regexps</a>
<ul>
<li><a href="/design-graveyard#problems" id="toc-problems">Problems</a></li>
</ul></li>
<li><a href="/design-graveyard#static-link-icon-attributes" id="toc-static-link-icon-attributes">Static Link-Icon Attributes</a>
<ul>
<li><a href="/design-graveyard#links-js" id="toc-links-js"><code>links.js</code></a></li>
<li><a href="/design-graveyard#linkicon-hs" id="toc-linkicon-hs"><code>LinkIcon.hs</code></a>
<ul>
<li><a href="/design-graveyard#features" id="toc-features">Features</a></li>
</ul></li>
</ul></li>
</ul></li>
<li><a href="/design-graveyard#reactive-archiving" id="toc-reactive-archiving">Reactive Archiving</a></li>
<li><a href="/design-graveyard#outbound-link-tracking" id="toc-outbound-link-tracking">Outbound Link Tracking</a></li>
<li><a href="/design-graveyard#popup-annotations" title="‘Design Graveyard § Popup Annotations’, Gwern 2010" id="toc-popup-annotations">Popup Annotations</a>
<ul>
<li><a href="/design-graveyard#none" id="toc-none">None</a></li>
<li><a href="/design-graveyard#tooltips" id="toc-tooltips">Tooltips</a></li>
<li><a href="/design-graveyard#wp-popups" id="toc-wp-popups">WP Popups</a></li>
<li><a href="/design-graveyard#inlined-popups" id="toc-inlined-popups">Inlined Popups</a>
<ul>
<li><a href="/design-graveyard#inlined-wp" id="toc-inlined-wp">Inlined WP</a></li>
<li><a href="/design-graveyard#link-ids-enabled-backlinks" id="toc-link-ids-enabled-backlinks">Link IDs Enabled Backlinks</a></li>
<li><a href="/design-graveyard#recursive-inlining" id="toc-recursive-inlining">Recursive Inlining</a></li>
</ul></li>
<li><a href="/design-graveyard#link-bibliographies" id="toc-link-bibliographies">Link Bibliographies</a>
<ul>
<li><a href="/design-graveyard#separate-link-bibliographies" id="toc-separate-link-bibliographies">Separate Link Bibliographies</a></li>
</ul></li>
<li><a href="/design-graveyard#standalone-annotation-complex" id="toc-standalone-annotation-complex">Standalone Annotation Complex</a>
<ul>
<li><a href="/design-graveyard#shadow-dom" id="toc-shadow-dom">Shadow DOM</a></li>
<li><a href="/design-graveyard#dynamic-wp-again" id="toc-dynamic-wp-again">Dynamic WP (Again)</a></li>
<li><a href="/design-graveyard#transcludes" id="toc-transcludes">Transcludes</a></li>
</ul></li>
</ul></li>
<li><a href="/design-graveyard#srcset-mobile-optimization" title="‘Design Graveyard § srcset</code> Mobile Optimization’, Gwern 2010" id="toc-srcset-mobile-optimization"><code>srcset</code> Mobile Optimization</a>
<ul>
<li><a href="/design-graveyard#background" id="toc-background">Background</a></li>
<li><a href="/design-graveyard#implementing-srcset" id="toc-implementing-srcset">Implementing <code>srcset</code></a></li>
<li><a href="/design-graveyard#issues-with-browser-support" id="toc-issues-with-browser-support">Issues With Browser Support</a></li>
<li><a href="/design-graveyard#inability-to-fix" id="toc-inability-to-fix">Inability to Fix</a></li>
<li><a href="/design-graveyard#conclusion" id="toc-conclusion">Conclusion</a></li>
<li><a href="/design-graveyard#postscript-manual-srcset" id="toc-postscript-manual-srcset">Postscript: Manual <code>srcset</code></a></li>
</ul></li>
<li><a href="/design-graveyard#interviews" title="‘Design Graveyard § Interviews’, Gwern 2010" id="toc-interviews">Interviews</a></li>
<li><a href="/design-graveyard#last-read-scroll-marker" id="toc-last-read-scroll-marker">Last-Read Scroll Marker</a></li>
<li><a href="/design-graveyard#navbar-previousnext-links" id="toc-navbar-previousnext-links">Navbar Previous/Next Links</a></li>
</ul>
</div>
---
/design-graveyard#shadow-dom
2024-01-01
---
/design-graveyard#srcset-mobile-optimization
Design Graveyard § srcset</code> Mobile Optimization
Gwern
2010-10-01
2024-09-03
<figure><img class="float-right page-thumbnail outline invert-not" height="296" width="437" src="/doc/cs/linkrot/archiving/2020-03-03-meganwarnock-picardfacepalmcartoon.jpg" title="Cartoon drawing of Captain Picard facepalming, expressing my frustration with web development, my website readers, and the world in general." alt="" /></figure><div class="page-description-annotation">
<p>Meta page describing Gwern.net website design experiments and post-mortem analyses.</p>
</div>
<p>The <code>srcset</code> image optimization tries to serve small images to devices which can only display small images to speed up loading & save bandwidth.</p>
<p>After 3 years, it proved to be implemented by browsers so poorly and inconsistently as to be useless, and I had to remove it when it broke yet again.</p>
<p>I do not recommend using <code>srcset</code>, and definitely not without a way to test regressions. You are better off using some server-side or JS-based solution, if you try to optimize image sizes at all.</p>
<div class="columns TOC">
<ul>
<li><a href="/design-graveyard#gitit" id="toc-gitit">Gitit</a>
<ul>
<li><a href="/design-graveyard#rss-feed" id="toc-rss-feed">RSS Feed</a></li>
</ul></li>
<li><a href="/design-graveyard#jquery-sausages-scrollbar" id="toc-jquery-sausages-scrollbar">JQuery Sausages Scrollbar</a></li>
<li><a href="/design-graveyard#beeline-reader" id="toc-beeline-reader">Beeline Reader</a></li>
<li><a href="/design-graveyard#google-custom-search-engine" id="toc-google-custom-search-engine">Google Custom Search Engine</a></li>
<li><a href="/design-graveyard#tufte-css-sidenotes" id="toc-tufte-css-sidenotes">Tufte-CSS Sidenotes</a></li>
<li><a href="/design-graveyard#djvu-files" id="toc-djvu-files">DjVu Files</a></li>
<li><a href="/design-graveyard#darcsgithub-repo" id="toc-darcsgithub-repo">Darcs/Github Repo</a></li>
<li><a href="/design-graveyard#long-urls" id="toc-long-urls">Long URLs</a>
<ul>
<li><a href="/design-graveyard#http" id="toc-http">HTTP</a></li>
<li><a href="/design-graveyard#space-separated-urls" id="toc-space-separated-urls">Space-Separated URLs</a></li>
<li><a href="/design-graveyard#www-subdomain" id="toc-www-subdomain"><code>www</code> Subdomain</a></li>
<li><a href="/design-graveyard#simplified-urls" id="toc-simplified-urls">Simplified URLs</a></li>
</ul></li>
<li><a href="/design-graveyard#ads" id="toc-ads">Ads</a></li>
<li><a href="/design-graveyard#donation-links" id="toc-donation-links">Donation Links</a></li>
<li><a href="/design-graveyard#google-web-fonts" id="toc-google-web-fonts">Google Web Fonts</a></li>
<li><a href="/design-graveyard#mathjax" id="toc-mathjax">MathJax</a></li>
<li><a href="/design-graveyard#quote-syntax-highlighting" id="toc-quote-syntax-highlighting">Quote Syntax Highlighting</a></li>
<li><a href="/design-graveyard#rubrication" id="toc-rubrication">Rubrication</a></li>
<li><a href="/design-graveyard#wikipedia-popups-js" id="toc-wikipedia-popups-js"><code>wikipedia-popups.js</code></a></li>
<li><a href="/design-graveyard#link-screenshot-previews" id="toc-link-screenshot-previews">Link Screenshot Previews</a></li>
<li><a href="/design-graveyard#automatic-dark-mode" id="toc-automatic-dark-mode">Automatic Dark Mode</a></li>
<li><a href="/design-graveyard#multi-column-footnotes" id="toc-multi-column-footnotes">Multi-Column Footnotes</a></li>
<li><a href="/design-graveyard#hyphenopoly-hyphenation" id="toc-hyphenopoly-hyphenation">Hyphenopoly Hyphenation</a></li>
<li><a href="/design-graveyard#knuth-plass-line-breaking" id="toc-knuth-plass-line-breaking">Knuth-Plass Line Breaking</a></li>
<li><a href="/design-graveyard#autopager" id="toc-autopager">Autopager</a></li>
<li><a href="/design-graveyard#automatic-smallcaps" id="toc-automatic-smallcaps">Automatic Smallcaps</a></li>
<li><a href="/design-graveyard#disqus-comments" id="toc-disqus-comments">Disqus Comments</a></li>
<li><a href="/design-graveyard#double-spaced-sentences" id="toc-double-spaced-sentences">Double-Spaced Sentences</a></li>
<li><a href="/design-graveyard#link-icon-css-regexps" title="‘Design Graveyard § Link-Icon CSS Regexps’, Gwern 2010" id="toc-link-icon-css-regexps">Link-Icon CSS Regexps</a>
<ul>
<li><a href="/design-graveyard#css-regexps" id="toc-css-regexps">CSS Regexps</a>
<ul>
<li><a href="/design-graveyard#problems" id="toc-problems">Problems</a></li>
</ul></li>
<li><a href="/design-graveyard#static-link-icon-attributes" id="toc-static-link-icon-attributes">Static Link-Icon Attributes</a>
<ul>
<li><a href="/design-graveyard#links-js" id="toc-links-js"><code>links.js</code></a></li>
<li><a href="/design-graveyard#linkicon-hs" id="toc-linkicon-hs"><code>LinkIcon.hs</code></a>
<ul>
<li><a href="/design-graveyard#features" id="toc-features">Features</a></li>
</ul></li>
</ul></li>
</ul></li>
<li><a href="/design-graveyard#reactive-archiving" id="toc-reactive-archiving">Reactive Archiving</a></li>
<li><a href="/design-graveyard#outbound-link-tracking" id="toc-outbound-link-tracking">Outbound Link Tracking</a></li>
<li><a href="/design-graveyard#popup-annotations" title="‘Design Graveyard § Popup Annotations’, Gwern 2010" id="toc-popup-annotations">Popup Annotations</a>
<ul>
<li><a href="/design-graveyard#none" id="toc-none">None</a></li>
<li><a href="/design-graveyard#tooltips" id="toc-tooltips">Tooltips</a></li>
<li><a href="/design-graveyard#wp-popups" id="toc-wp-popups">WP Popups</a></li>
<li><a href="/design-graveyard#inlined-popups" id="toc-inlined-popups">Inlined Popups</a>
<ul>
<li><a href="/design-graveyard#inlined-wp" id="toc-inlined-wp">Inlined WP</a></li>
<li><a href="/design-graveyard#link-ids-enabled-backlinks" id="toc-link-ids-enabled-backlinks">Link IDs Enabled Backlinks</a></li>
<li><a href="/design-graveyard#recursive-inlining" id="toc-recursive-inlining">Recursive Inlining</a></li>
</ul></li>
<li><a href="/design-graveyard#link-bibliographies" id="toc-link-bibliographies">Link Bibliographies</a>
<ul>
<li><a href="/design-graveyard#separate-link-bibliographies" id="toc-separate-link-bibliographies">Separate Link Bibliographies</a></li>
</ul></li>
<li><a href="/design-graveyard#standalone-annotation-complex" id="toc-standalone-annotation-complex">Standalone Annotation Complex</a>
<ul>
<li><a href="/design-graveyard#shadow-dom" id="toc-shadow-dom">Shadow DOM</a></li>
<li><a href="/design-graveyard#dynamic-wp-again" id="toc-dynamic-wp-again">Dynamic WP (Again)</a></li>
<li><a href="/design-graveyard#transcludes" id="toc-transcludes">Transcludes</a></li>
</ul></li>
</ul></li>
<li><a href="/design-graveyard#srcset-mobile-optimization" title="‘Design Graveyard § srcset</code> Mobile Optimization’, Gwern 2010" id="toc-srcset-mobile-optimization"><code>srcset</code> Mobile Optimization</a>
<ul>
<li><a href="/design-graveyard#background" id="toc-background">Background</a></li>
<li><a href="/design-graveyard#implementing-srcset" id="toc-implementing-srcset">Implementing <code>srcset</code></a></li>
<li><a href="/design-graveyard#issues-with-browser-support" id="toc-issues-with-browser-support">Issues With Browser Support</a></li>
<li><a href="/design-graveyard#inability-to-fix" id="toc-inability-to-fix">Inability to Fix</a></li>
<li><a href="/design-graveyard#conclusion" id="toc-conclusion">Conclusion</a></li>
<li><a href="/design-graveyard#postscript-manual-srcset" id="toc-postscript-manual-srcset">Postscript: Manual <code>srcset</code></a></li>
</ul></li>
<li><a href="/design-graveyard#interviews" title="‘Design Graveyard § Interviews’, Gwern 2010" id="toc-interviews">Interviews</a></li>
<li><a href="/design-graveyard#last-read-scroll-marker" id="toc-last-read-scroll-marker">Last-Read Scroll Marker</a></li>
<li><a href="/design-graveyard#navbar-previousnext-links" id="toc-navbar-previousnext-links">Navbar Previous/Next Links</a></li>
</ul>
</div>
---
/design-graveyard#static-link-icon-attributes
2024-01-01
---
/design-graveyard#tooltips
2024-01-01
---
/design-graveyard#transcludes
2024-01-01
---
/difference#efficient-natural-languages
2024-01-01
---
/difference#overparameterization-and-biological-robustness
2024-01-01
---
/dnb-faq#aging
2024-01-01
---
/dnb-faq#blood-sugar
2024-01-01
---
/dnb-faq#chooi-2011
2024-01-01
---
/dnb-faq#criticism
2024-01-01
---
/dnb-faq#jaeggi-2008
2024-01-01
---
/dnb-faq#jaeggi-2010
2024-01-01
---
/dnb-faq#jaeggi-2011
2024-01-01
---
/dnb-faq#jausovec-2012
2024-01-01
---
/dnb-faq#kundu-et-al-2012
2024-01-01
---
/dnb-faq#lucid-dreaming
2024-01-01
---
/dnb-faq#meta-analysis
2024-01-01
---
/dnb-faq#polar-june-2009
2024-01-01
---
/dnb-faq#qiu-2009
2024-01-01
---
/dnb-faq#redick-et-al-2012
2024-01-01
---
/dnb-faq#salminen-2012
2024-01-01
---
/dnb-faq#schweizer-et-al-2011
2024-01-01
---
/dnb-faq#seidler-2010
2024-01-01
---
/dnb-faq#sleep
2024-01-01
---
/dnb-faq#stephenson-2010
2024-01-01
---
/dnb-faq#support
2024-01-01
---
/dnb-faq#vartanian-2013
2024-01-01
---
/dnb-meta-analysis#analysis
2024-01-01
---
/dnb-meta-analysis#biases
2024-01-01
---
/dnb-meta-analysis#control-groups
2024-01-01
---
/dnb-meta-analysis#iq-test-time
2024-01-01
---
/dnb-meta-analysis#paymentextrinsic-motivation
2024-01-01
---
/dnb-meta-analysis#training-time
2024-01-01
---
/dnb-meta-analysis#training-type
2024-01-01
---
/dnm-archive#how-to-crawl-markets
2024-01-01
---
/dnm-archive#logout
2024-01-01
---
/dnm-archive#works-using-this-dataset
2024-01-01
---
/doc/adversarial/human/index
2024-04-01
---
/doc/ai/1962-good.pdf
The Social Implications of Artificial Intelligence
Irving John Good
1962-01-01
2024-01-01
---
/doc/ai/1970-weaver-sceneofchangealifetimeinamericanscience.pdf
Scene Of Change: A Lifetime in American Science
Warren Weaver
1970-01-01
2024-01-01
---
/doc/ai/1984-michie-thecreativecomputer.pdf
1984-01-01
2024-01-01
---
/doc/ai/1985-mccorduck-theuniversalmachine.pdf
The Universal Machine: Confessions of a Technological Optimist
Pamela McCorduck
1985-01-01
2024-01-01
---
/doc/ai/1986-michie-onmachineintelligence.pdf
On Machine Intelligence, Second Edition
Donald Michie
1986-01-01
2024-01-01
---
/doc/ai/1986-michie-onmachineintelligence.pdf#page=99
On Machine Intelligence, Second Edition § pg99
Donald Michie
1986-01-01
2024-01-01
---
/doc/ai/1988-feigenbaum-theriseofthexpertcompany.pdf
The Rise of the Expert Company: How Visionary Companies are Using Artificial Intelligence to Archieve Higher Productivity and Profits
Edward Feigenbaum, Pamela McCorduck, H. Penny Nii
1988-01-01
2024-01-01
---
/doc/ai/1988-langley.pdf
Machine learning as an experimental science
Pat Langley
1988-08-01
2024-01-01
[("doi","10.1023/A:1022623814640")]
---
/doc/ai/1988-papert.pdf
One AI or Many?
Seymour Papert
1988-01-01
2024-01-01
[("doi","10.2307/20025136")]
---
/doc/ai/1991-dreyfus.pdf
Making a Mind Versus Modeling the Brain: Artificial Intelligence Back at the Branchpoint
Hubert L. Dreyfus, Stuart E. Dreyfus
1991
2024-01-01
---
/doc/ai/1992-langton-artificiallife-2.pdf
1992
2024-01-01
---
/doc/ai/1992-levy-artificiallife.pdf
Artificial Life: A Report from the Frontier Where Computers Meet Biology
Steven Levy
1992-01-01
2024-01-01
---
/doc/ai/1996-skapura-buildingneuralnetworks.pdf
1996-01-01
2024-01-01
---
/doc/ai/2001-breiman.pdf
2001-01-01
2024-01-01
---
/doc/ai/2010-10-22-xkcd-809-losalamos.png
2010-10-22
2024-01-01
---
/doc/ai/2012-jarvisalo-figure2-satsolverimprovementovertime20022011.jpg
2012
2024-01-01
---
/doc/ai/2013-09-11-xkcd-1263-reassuring.jpg
2013-09-11
2024-01-01
---
/doc/ai/2014-02-rameznaam-thesingularityisfurtherthanitappears-chemicalmodelingexponential.jpg
2014-02
2024-01-01
---
/doc/ai/2014-02-whyaiswontascend-figure1-intelligencegrowthunderdifficulty.png
2014-02
2024-01-01
---
/doc/ai/2015-01-28-spidermanandthexmen-vol1-no2-sauron-cancerdinosaurs.jpg
2015-01-28
2024-01-01
---
/doc/ai/2018-fukumoto.pdf
Generation of Character Illustrations from Stick Figures Using a Modification of Generative Adversarial Network
Yuuya Fukumoto, Daiki Shimizu, Chihiro Shibata
2018-01-01
2024-01-01
[("doi","10.1109/COMPSAC.2018.10225")]
---
/doc/ai/2018-mahajan-figure5-imagenetclassificationscalingcurvebymodelparametersize.jpg
2018
2024-01-01
---
/doc/ai/2018-oakdenrayner.pdf
Reply to ‘Man against machine: diagnostic performance of a deep learning convolutional neural network for dermoscopic melanoma recognition in comparison to 58 dermatologists’ by H. A. Haenssle et al
Luke Oakden-Rayner
2018-01-01
2024-01-01
[("doi","10.1093/annonc/mdy519")]
---
/doc/ai/2019-11-26-gwern-deeplearning-kaibadeafeatmeme-tensorflowupgrading.png
Gwern
2019-11-26
2024-01-01
---
/doc/ai/2020-09-01-gwern-meme-thesilentprotector-tensorfork.png
Gwern
2020-09-01
2024-01-01
---
/doc/ai/2020-adiwardana-meena-figure1-humanratingsvslikelihood.png
2020
2024-01-01
---
/doc/ai/2021-anonymous-meme-virginvschad-journalpapervsblogpost.jpg
2021
2024-01-01
---
/doc/ai/2021-junseong-hyperclova.html
2021
2024-01-01
---
/doc/ai/2021-moses-supplement.pdf
Neuroprosthesis for Decoding Speech in a Paralyzed Person with Anarthria [Supplementary Appendix]
David A. Moses, Sean L. Metzger, Jessie R. Liu, Gopala K. Anumanchipalli, Joseph G. Makin, Pengfei F. Sun, Josh Chartier, Maximilian E. Dougherty, Patricia M. Liu, Gary M. Abrams, Adelyn Tu-Chan, Karunesh Ganguly, Edward F. Chang
2021
2024-01-01
---
/doc/ai/2021-nationalsecuritycommissiononai-finalreport.pdf
National Security Commission On Artificial Intelligence Final Report
Eric Schmidt, Safra Catz, Steve Chien, Mignon Clyburn, Chris Darby, Kenneth Ford, José-Marie Griffiths, Robert Work, Eric Horvitz, Andrew Jassy, Gilman Louie, William Mark, Jason Matheny, Katharina McFarland, Andrew Moore
2021-03-01
2024-07-07
---
/doc/ai/anime/2022-ashual-figure3-knndiffusioncartoonstickersamples.png
2022
2024-01-01
---
/doc/ai/anime/2023-08-17-gwern-meme-domino-historyofanimeaistartingwithgwernandshawnpresser.jpg
Gwern
2023-08-17
2024-01-01
---
/doc/ai/anime/2023-11-15-gwern-meme-boxergothands-humanartistdifficultyindrawingrealistichands.jpg
Gwern
2023-11-15
2024-01-01
---
/doc/ai/anime/danbooru/2019-02-28-thiswaifudoesnotexist-textsnippets.tar.xz
2019-02-28
2024-01-01
---
/doc/ai/anime/danbooru/2020-05-31-danbooru2019-palm-handannotations-export.jsonl
2020-05-31
2024-01-01
---
/doc/ai/anime/danbooru/2020-06-08-danbooru2019-palm-handannotations-export.jsonl
2020-06-08
2024-01-01
---
/doc/ai/anime/danbooru/2020-09-05-gwern-twdne-v3.5-gpt3snippets.tar.xz
Gwern
2020-09-05
2024-01-01
---
/doc/ai/anime/danbooru/2021-li-dplase-ganlatentspaceeditingvideo.mp4
2021
2024-01-01
---
/doc/ai/anime/danbooru/2022-yang-dualstylegan-examplesofcaricatureanimepixarcomiccartoonportraitedits.jpg
2022
2024-01-01
…[File truncated due to length; see original file]…