Earth Notes: On Website Technicals
Read my nitty-gritty tech updates and daily learnings while keeping the Earth Notes site up and running (index); site stats also.
These notes will be updated intermittently, usually when I should be doing something else!
These notes are all about the interesting (and mundane) behind-the-scenes tech bits to grow and optimise this site, including purely technical measures such as speed, but also user experience beyond just adding new articles and updating existing ones.
Please try the useful tools, reasonably recently used and re-used by me, and encountered while writing these entries, listed under
Sources and Links.
Also please take a look at the simple automatically-updated
site stats below.
I welcome feedback on any of the issues that I have discussed. I share this stuff because it's interesting and because writing it here may save someone else some unnecessary head-scratching! No longer do we need to really
know anything technical, nor own a shelf full of reference books (so '90s!), we just need to be able to compose queries for our favourite search engines!
The newest pages are at the top of this list, and the newest items are at the top of each linked page. Enjoy!
Notes On Site Technicals: Greatest Hits # 8: On Website Technicals (2018/01) PSNR lo-fi PNG autogeneration, page media. # 7: On Website Technicals (2017/12) too little markup, bad traffic, big hero, base download ms, service worker no rel, jump-to. # 6: On Website Technicals (2017/11) Googlebot warp space, image re-optimisation, even liter, defer, inlining, video. # 5: On Website Technicals (2017/10) rounded corners, mobile usability, HTTP/2 vs mobile, bad bot, UnCSS tweaks, latency, unit tests, visuals, Save-Data, lite vs mobile. # 4: On Website Technicals (2017/09) ImageMagick 20 years and Brew, autogen banners, old eyes, optimised ads, mobile traffic, brotli, doctype, JPEG fun, purifycss, UnCSS, OnDemand. # 3: On Website Technicals (2017/08) Atom sitemaps (un)pending, Googlebot bandwidth, HTML improvements, big beast hunting with regex, heroes, Cache-Control, restart drill, minifying. # 2: On Website Technicals (2017/07) ad injection, meta, static precompression, zopfli, HTTP/head response overhead reduction, Bing Webmaster Tools, FeedValidator, Share42, utf-8. # 1: On Website Technicals (2017/06) CDN revoked, structured data, 10 years old, XML sitemap at long last and lastmod, HTML5 conformance, PageSpeed. Stats
Stats updated: 2018-01-20T16:09Z
Stat Value Fraction bot hits 0.404 Fraction GET 200s 0.658 Fraction GET 206s 0.004 Fraction GET 301s 0.029 Fraction GET 304s 0.020 Fraction GET 403s 0.233 Fraction GET 404s 0.030 Fraction GET 416s 0.000 Fraction GETs 0.974 Fraction human main-page GET 200s 0.063 Fraction human m/(m+www) main-page GET 200s 0.071 Fraction m/(m+www) site hits 0.086 Mean human m main-page transfer bytes 13083 Mean human www main-page transfer bytes 13952 Mean m transfer bytes 9502 Mean www transfer bytes 13282 Unique human IPs/day equivalent 140 Sources and Links Accessibility According To Actual People With Disabilities: this site's two main sins would seem to be walls of text and black-on-white; let's not talk about my long-sentence habit. Share42.com social sharing buttons: lightweight and non-tracking. Google's Webmaster Central Help Forum. Feed (eg Atom) validation and W3C's tool. Google's Structured Data Testing Tool. Optimizing the Critical Rendering Path. WebPagetest for site performance testing. PageSpeed Insights from Google, which will provide compressed/minified versions of assets, as well as reporting what should be fixed/optimised. See also for speed/performance testing: Test My Site With Google, Pingdom Website Speed Test, GTMetrix, dotcom-monitor, Akamai Mobitest, Geek Flare, Page Weight. Nibbler: a free tool for testing websites across a number of aspects. Screaming Frog SEO Spider: "The SEO Spider is a desktop program you can install locally on PC, Mac or Linux which crawls websites’ links, images, CSS, script and apps to evaluate onsite SEO." SEO Web Page Analyzer with interesting point about value of link anchor text (eg when read out by screen reader) to be able to decide to follow the link or not. Alleged 8 major Google ranking signals in 2017 and Google's 9 major ranking signals and Google’s 200 Ranking Factors: The Complete List: things to get right to have visitors actually come and read the content! Check My Links Chrome extension to validate links from the current page. CSS minification online at cssminifier.com, and the excellent comand-line (node.js) clean-css. HTML minification at htmlcompressor.com: gives me courage to know what I can safely tune myself! Also see the Google-recommended Kangax HTMLMinifier; this tool in its command-line version is now used in generation of this site. UnCCS and purifycss static analysis tools to allow trimming of unused CCS, per-page. Image compression online with TinyPNG or off-line with zopflipng or OptiPNG. ImageMagick portable command-line image processing suite. Progressive JPEGs and green Martians: smart use of progressive JPEG scan scripts. W3C Validator and HTML outliner. CSS validator, including embedded in an HTML page. TagCrowd, Wordclouds: create custom word clouds from, eg, your Web own page. Normalise characters in response to a W3C validation warning "Text run is not in Unicode Normalization Form C" with FileFormat.info. Pixabay for some handy images: thanks!