16 ms·

How to Build a Low-Tech Website

600 points by RomanZolotarev 8y ago

lepouet 8y ago
Can someone explain to me how to reproduce the image dithering look in photoshop please ?
- glassesman 8y ago
  Easiest method I know of is Image > Mode > Indexed Color... From there you can heavily reduce the color count and select the dithering type.
mLuby 8y ago
Wonder if they've considered a gravity battery? As an additional benefit it'd let someone local "recharge" the battery manually rather than being 100% tied to the Sun.
- uneekname 8y ago
  I imagine huge weights hanging off the balcony of a Barcelona apartment :)
  - mLuby 8y ago
    Could be pretty stylish I'd think. Chandelier with moving crystals? #LowTech :P
  - anthk 8y ago
    We can hire a British from Salou for that.
  - vidanay 8y ago
    I think this is called a "Grandfather clock" ;-)
- foxhop 8y ago
  Is there an off the shelf gravity battery that one could purchase for charging over USB?
- perilunar 8y ago
  It's Low Tech magazine: you can bet he's considered and analysed every form of energy storage you can think of, and several you haven't.
driverdan 8y ago
Cool experiment! My suggestion is to get a larger solar panel. Solar is cheap now, less than US$1 per watt. Why not get a 100W or a 200W panel? It will put out enough power to supply the server and router on a rainy day. The battery will only be necessary overnight. The price of 18650's is low enough that building your own pack to handle 30W continuous overnight is not costly. To help with the environmental impact and cost you can get used batteries that are being recycled or thrown away.
TeMPOraL 8y ago
> The size of the average web page (defined as the average page size of the 500,000 most popular domains) increased from 0.45 megabytes (MB) in 2010 to 1.7 megabytes in June 2018. It's the second place I see such low average size values (I'd say, somewhat reasonable), but I'm having a hard time believing in them. On a typical site, when I hit F12 and proceed to Network tab, I usually see ten times greater values. I fear that those statistics are either undercounting something, or 500k is just so many domains that the long tail of lightweight sites drags the average down, making values not representative of the real situation. I wonder how those stats would look if the average was weighted by the number of visits.
- rossdavidh 8y ago
  There is also the issue that caching (e.g. cdn of jQuery or React libraries) can mean that, if you visit a given website every day in a month, you may only download that library once (the first time). Their estimate is definitely lowball for your first visit, but it might be a reasonable estimate for how much is actually downloaded on average.
  - mercer 8y ago
    I thought that the caching you describe in practice rarely actually offers much of a benefit (for various reasons), but maybe things changed?
- toss1 8y ago
  I remember from over a decade ago there was an annual contest to make the best web page that would fit into 5KB - yes, 5000 bytes. There were many impressive entries. I'd really hoped it would catch on. Sadly, that lightweight concept is now so forgotten that I can't even find it in a quick search. (perhaps someone else can find a pointer?)
  - slater 8y ago
    https://the5k.org/about.php https://the5k.org/about.php :)
forgotpwd16 8y ago
Some cool concepts there. >Static Site This should be an obvious choice for sites not requiring dynamic elements. Also their choice of comments through email is a good solution to a problem static-made blogs have. >Dithered Images That won't work for every case, but is interesting. >Default typeface That's nice. I'm already disallowing sites to choose their own typeface. Except if a site is about design, then the typeface doesn't matter and probably I won't prefer their choice over mine. >No Third-Party Tracking This makes sense and I don't understand why self-hosted sites are doing it. The logs are there. Analyzing them is all that is needed. >No Advertising Services I'm fine with that but some sites rely on ads. I ain't aware of a method that will keep with their goals and provide ads.
- TeMPOraL 8y ago
  > This makes sense and I don't understand why self-hosted sites are doing it. The logs are there. Analyzing them is all that is needed. 1) Laziness. A third-party JS tracker usually comes with a complete dashboard, full of pretty (and sometimes even useful) graphs. 2) Data. Client-side trackers can spy on users more, giving you more information you can e.g. missapply in an A/B test trying to drive "engagement". RE 1, there exist tools aimed at analyzing server logs. I played with GoAccess a bit, it's quite OK. https://goaccess.io/ https://goaccess.io/
  - mywittyname 8y ago
    You don't need a thirds party tracker to get fancy graphs. Matomo is free, open source, self-hosted, works on logs, and has fancy graphs. An ELK stack would also work fine. Lazy-loaded 1px images can be used for tracking how far users have read and a/b testing can be done by compiling multiple versions and redirecting users to the version you want them to try.
    - floren 8y ago
      If I could toot my own horn for a moment, Gravwell (gravwell.io) has a 2GB/day free license which should be plenty to ingest web logs. We've got a GeoIP module to resolve IPs to locations, we can display geographic heatmaps (see https://dev.gravwell.io/docs/#!search/map/map.md https://dev.gravwell.io/docs/#!search/map/map.md), a variety of charts, tables, etc. Matomo looks really polished and if it provides the features you need, it seems like an obvious choice. If OTOH you're looking at rolling your own with ELK, Gravwell might make sense.
powellzer 8y ago
From clicking around this site, it looks like their image dithering technique has taken away the color quality required to properly view the graphs on this article: https://solar.lowtechmagazine.com/2015/10/the-4g-mobile-internet-thats-already-there/ https://solar.lowtechmagazine.com/2015/10/the-4g-mobile-inte...
- juliangoldsmith 8y ago
  I'm not convinced it saves much in the way of bandwidth, either. If you take this[0] image, it's 43 KB for a 800x533 image. I'd expect a JPEG to be able to do that without too much in the way of artifacts. It does give the page a kind of neat newspapery vibe, though. [0]: https://solar.lowtechmagazine.com/dithers/sps_wide.png https://solar.lowtechmagazine.com/dithers/sps_wide.png
  - bitsquirrel 8y ago
    This[0] is also a 43kB 800x533 image, saved at 30% JPEG quality from the GIMP. The whole dithering thing seems to be the wrong approach. [0]: https://bitsquirrel.co.uk/800x533.jpg https://bitsquirrel.co.uk/800x533.jpg
  - jermaustin1 8y ago
    I agree. I feel they are doing it more for aesthetics than actual 'energy' consumption, but then they must justify why they are dithering, and "because it looks pretty" doesn't fit their shtick.
  - mywittyname 8y ago
    Some of their images look like they are best suited to PNG format. I do agree that the consistency is nice for aesthetic reasons, but poorly rendered images do detract from the overall message.
  - protonfish 8y ago
    Even if it did save bandwidth, that does not equal significant energy savings. And if it did, there are better ways to save. For example, looking at their response headers I see the image cache control expires after a day, plus has validation caching. This could be significantly improved. First, get rid of the `etag`, `expires`, and `last-modified` headers and go with expiration caching only. Increase the `max-age` from one day (86400) to one year (31536000). I get the HTML expiring after 24 hours, but images should be more aggressively cached. Validation caching always requires a round trip to the server, plus running validation rules on every single request so it can't save nearly as much bandwith and CPU as simple expiration caching. Also, if they got rid of the those headers, plus the pointless `server: nginx/1.10.3` they could save over 100b per HTTP response. I counted 19 requests on that article, so it may seem small, but it can add up to a significant amount.
gonzo41 8y ago
The best part is the dithering, this website reminds me of old Chemistry lab manuals.
oliv__ 8y ago
"Progress"
ryanianian 8y ago
The dithering on images is actually kinda nice. Less visual over-stimulation. But whatever this site is doing with the fixed-scroll yellow block is super weird. There's a "95%" thing next to a sun - is it somehow related to the solar battery powering the server? Rather than focusing on the content, the design focuses on the infrastructure at the expense of the content. Maybe that's the point, but this particular element is certainly off-putting.
- amelius 8y ago
  > The dithering on images is actually kinda nice. Less visual over-stimulation. Yes, but does it also consume less power, formatting the images this way?
  - binaryorganic 8y ago
    Sure, as it reduces overall filesize. They could have achieved similar efficiency by compressing full-color images though.
    - zmw 8y ago
      Or they can do away with some of the useless images and save a lot more bytes.
      - emodendroket 8y ago
        > The main challenge was to reduce page size without making the website less attractive. Because images take up most of the bandwidth, it would be easy to obtain very small page sizes and lower energy use by eliminating images, reducing their number, or making them much smaller. However, visuals are an important part of Low-tech Magazine’s appeal, and the website would not be the same without them.
- theandrewbailey 8y ago
  I agree with you on the yellow background battery meter, but not the dithered images. At desktop sizes, it reminds me of the low-res dithered hell of the 90s, except its worse because it's effectively yellowscale. I hate image dithering with a burning passion. I bet the same images would look better as low res JPEGs (they are currently PNGs, which are made less compressible with the dithering noise).
uxp100 8y ago
I like the gauge, but wish it was only in the corner or something. That it is the background of the whole page is pretty distracting.
SippinLean 8y ago
I wish the content of the photographs wasn't so obscured
decasia 8y ago
Neat article, but I think we should distinguish basically two things here that the article blurs together: 1) Reducing website bandwidth and computational usage (static sites, small images, reducing extra resource requests). Super common topic that HN talks about all the time. 2) Reducing the electricity bill for the server and powering it with renewable resources. This part is quite neat, I think, but for a single bespoke website, the energy savings of using a single low-power server seems pretty trivial in the grand scheme of things — I could get similar savings by changing a living room lamp to a more energy efficient bulb. This inspires me to propose a third category of energy efficiency that the article doesn't touch on: human energy costs. Humans are quite energy intensive devices, and I suspect that the labor and human-maintenance costs of making this website dwarf the direct energy costs of running a webserver. I'd be curious how one would go about optimizing these other energy costs, and whether that can be done in a way that still preserves quality of work/life for the humans involved.
- juliangoldsmith 8y ago
  Is that a comment on the effort to produce a site like this, or the cheapness of energy and bandwidth? The effort required to produce a site like this would be negligible, given that it's almost entirely plain HTML. Dithering the images would take seconds in something like GIMP. The HTML looks to have been produced by a tool, based on the formatting, so they wouldn't need to spend time working with markup.
  - maemilius 8y ago
    What about the energy used to design and build the infrastructure? There's a lot more that went into this project than just the static site, which is something the article touches on. To illustrate, I'm going to invent some numbers: Let's say that this site on "standard" hardware would use 1kW per day. This means the existing site saves ~950W per day looking at just the hardware energy use. However, the hardware it's running on had to be produced, let's say that costs 10kW. The solar panels and batteries need power to make, let's; say they cost another 30kW of power. Additionally, the system needs to be designed and built by a human being. Humans use a lot of energy. Let's say that this took 1 week to design and build. Let's say a human "uses" 50kW of "power" per day (e.g. from food production, etc.). This means it costs an additional 350kW of power to design and build the infrastructure. Adding up all these made up numbers gives us a total infrastructure cost of 390kW. This means that, in order to "pay back" the difference, the new system has to operate for (390,000 W / 950 W/d =) 410 days. These numbers are wildly inaccurate and cut a lot of corners, but this should give an idea as to what the grandparent was getting at. Sidenote: I'm not, personally, trying to make a point about the project itself. Just, in order to fully understand the energy impact you have, you need to take a lot more into account than just "the amount of work performed by the computer".
b2ccb2 8y ago
The dithering is nice for some images but it takes some details on graphs etc.. The example image given can be re-compressed using techniques like structural similarity (SSIM)[1] or Multi-scale structural similarity (2003 Paper)[2]. Using jpeg-archive[3] I resized the example image from the blog[4] with decent results: /tmp ls -1sh *.jpg *.png | sort -nr 740K 6a00e0099229e88833022ad3b23825200b-750wi.png 100K 6a00e0099229e88833022ad3b23825200b-750wi.jpg 64K small-fry.jpg 56K mpe.jpg 24K ms-ssim.jpg [1] https://en.wikipedia.org/wiki/Structural_similarity https://en.wikipedia.org/wiki/Structural_similarity [2] https://ece.uwaterloo.ca/~z70wang/publications/msssim.pdf https://ece.uwaterloo.ca/~z70wang/publications/msssim.pdf [3] https://github.com/danielgtaylor/jpeg-archive https://github.com/danielgtaylor/jpeg-archive [4] http://krisdedecker.typepad.com/.a/6a00e0099229e88833022ad3b23825200b-750wi http://krisdedecker.typepad.com/.a/6a00e0099229e88833022ad3b...
- ktpsns 8y ago
  If I understand you correctly, you propose a image format which should provide a better quality for less file size. However, to implement an in-browser client-side reader, one probably needs a javascript library, and this will blow up the size again [Side note: Actually I am surprised the site uses JavaScript at all, being that static]. Another proposal for image compression is to fall back on SVG, c.f. https://jmperezperez.com/svg-placeholders/ https://jmperezperez.com/svg-placeholders/ -- at least this does not need JS.
  - b2ccb2 8y ago
    Those are compression techniques, they do not require js, nor a different client and work with the jpeg standard.
    - claudiulodro 8y ago
      To implement the improvements you suggest on this site (which appears to be a static site), the best way would be to have your proposed image compression as part of the static site preprocessor, correct? Just trying to understand how it would be implemented, as this site is an interesting idea but the dithered images would likely not have mass-appeal.
ObsoleteNerd 8y ago
I think this is a really cool idea actually. I help run a fair few websites for authors/creators that don't need 5 digits of up-time and super heavy websites. I'm sure most blogs/sites would be fine being much much lighter and running off something like this.
sbradford26 8y ago
I would be interested to see how the additional traffic from HN is impacting their power usage.
jkingsbery 8y ago
I'm curious how the energy usage for this site compares to something like hosting a site on S3.
- g105b 8y ago
  Using a datacentre such as S3 will gain the benefits of an economy of scale. Per-website S3 energy costs are going to be substantially lower than the energy cost of a solar-server: each solar-server that is installed will have had to have been built in factories which cost energy to run, shipped in delivery vehicles which cost energy to drive, plus the humans behind the website would require energy while building the server... all of which would easily be more than the net energy consumption of a single website in S3. That being said, the point of the project is to produce a website that is 100% solar powered. They never said they were aiming for something that is feasibly sustainable.
- icebraining 8y ago
  Probably not good I would think, especially if you take into account the energy used to produce and ship the computer, router, etc.
trqx 8y ago
I hope they fix the RSS feed and put the whole articles in there. It should be the norm, especially on a website with "low" uptime.
- azdle 8y ago
  https://solar.lowtechmagazine.com/feeds/all.atom.xml https://solar.lowtechmagazine.com/feeds/all.atom.xml ^ seems to have full articles.
  - trqx 8y ago
    I mean article content, not just the first line or the title. This way articles are cached in case of downtime.
    - azdle 8y ago
      For some reason Firefox is only showing the <summary> contents when you click that link, but it's all in there and it shows the full article in ttrss for me.
  - avhon1 8y ago
    Seems to have links to, and 1-sentence descriptions of, all of their articles. This isn't very useful if you want your RSS reader to pull down articles for you to read while you're offline. For that to work, you want the feed itself to have the full text of every article embedded inside it.
    - pmlnr 8y ago
      It has the full content. See view-source. Firefox hides it.
- bArray 8y ago
  I agree, but I would also expect to only receive text data and not images (or very highly compressed images). The other part of keeping the bandwidth cost of an RSS feed down is keeping a smaller number of articles in "rotation". EDIT: I just pulled their RSS feed - 50 articles currently in rotation! 32.42kB according to FireFox of just snippets of text and links!
Retr0spectrum 8y ago
Dithered images do not compress well. I'd be interested to see side-by-side comparisons of optimised pngs, optimised jpeg, reduced-pallete optimised pngs, and some more cutting-edge formats like BPG[0] and FLIF[1] [0] https://bellard.org/bpg/ https://bellard.org/bpg/ [1] https://flif.info/ https://flif.info/
- adambowles 8y ago
  https://news.ycombinator.com/item?id=18076214 https://news.ycombinator.com/item?id=18076214
- vanderZwan 8y ago
  > Dithered images do not compress well. That does somewhat depend on whether we are talking about positioned or Floyd-Steinberg dithering. Positioned dithering is a lot more regular and predictable, and hence easier to compress.
jhabdas 8y ago
Low-Tech seems a bit of a misnomer when referring to deceptive simplicity. Wonder if they considered building After Dark. https://after-dark.habd.as https://after-dark.habd.as
ravenstine 8y ago
I once basically did just that, besides the image dithering. I ran a small blog off a Raspberry Pi, only using Markdown files and something to render them to HTML. I used my own IP address, which I know you're not technically supposed to do but in 15 years I've never had an ISP crack down on me for it, and had a script that would run periodically to update the A record for my domain in Route 53. (since my IP was dynamic) Whether you're doing it for energy purposes or not, it's a fun project because it feels a bit like sticking it to the man, since we're used to always hosting our sites on someone else's machine.
- kmgr 8y ago
  What is the reason for not using your own ip?
  - H1Supreme 8y ago
    I believe it goes against most terms of service agreements with non-commercial isp plans.
    - rossdavidh 8y ago
      My guess is that this is mostly a way for them to object if you start using too much bandwidth. Most ISP's "guarantee" way more bandwidth than they can actually provide on a daily basis. If you're hosting a website that gets low traffic, normally, they probably will not only not know, but not care. Just my guess.
- floren 8y ago
  For several years starting in 2010 I ran my personal website off a Pentium III Thinkpad running Plan 9 sitting on the floor behind my desk. I wrote the web server in Go; it was a "hybrid" in that it served mostly static files, but in the blog subdirectory it would render Markdown to HTML. It worked great! I eventually migrated to a VPS when the hardware started to get too flaky with age (and years of accumulated dust sucked through the fan inlet)
kome 8y ago
I'm proud of my low tech personal website: http://mrtno.com http://mrtno.com - I promise: it will never work on smartphones, just good old computers... I will build your static html page for money. Hit me up. ;)
- lexicality 8y ago
  You're proud that you make webpages that can't be consumed by the primary method most people use to get online?
  - wtracy 8y ago
    Even more confusing, the linked website seems to work just fine on my Moto.
    - kome 8y ago
      well, it's just not optimized for it, it's just HTML + CSS, so it should work pretty much everywhere. I don't have a cellphone myself, so i never tested it.
  - kome 8y ago
    YES!
    - lexicality 8y ago
      Why?
- jamesgeck0 8y ago
  The CSS @media attribute has been widely available since IE6. It's not exactly high tech.
  - kome 8y ago
    Are we discussing about high tech or low tech?
tw1010 8y ago
Small sub-cultures, like this one, do experiments all the time in their little corner of the web. Some of the cultures die after a while, and some grow into something else, something bigger, something that starts to percolate on the mainstream surface, albeit possibly only tangental to how it started. I'm not sure I'd predict this movement will grow into something that reaches mainstream tech, but let's say I'm wrong, just for fun. Can anyone here think of a potential narrative that would describe how the current state of this experiment could possibly be perturbed and squeezed into a form that the mainstream soaks up as the next big (or medium-sized) thing? I'm just curious to know how my prediction that this won't grow any larger than it is today could be wrong.
- uneekname 8y ago
  While unlikely, I could see more wide-spread adoption of this concept if a large online company began using the approach. If Twitter for example decided to cut out all their bloat, simplify served graphics and assets, and invest in sustainable energy, I could see other high-profile internet companies following their lead. Just my 2¢
  - jethro_tell 8y ago
    They would be getting rid of their product, which is to analyze and selling their users. I can see more wide spread adoption when people pay 2/mo for twitter and 3/mo for facebook.
- rossdavidh 8y ago
  Could well not happen, but the most likely driver of slimmed down websites, anyway, would be a desire to make them load better in India, Africa, parts of Latin America and eastern Asia that have low connection speeds. Not saying that's how it will go, but it's feasible that to get to the second and third billion internet users, you need to be slimmer.
  - beat 8y ago
    It's still kind of a niche, though. People who don't live where decent internet access is readily available also tend to not have enough disposable wealth to make great business targets, especially for social media and other sites that sell eyeballs rather than widgets. On the other hand, one of the first things people with disposable income want today is good internet access, so as income grows for the middle five billion (and it's growing rapidly), there's tremendous market pressure to supply them with faster internet - maybe not up to the standards of the top billion, but not "low tech" either.
tapvt 8y ago
Solar power, low-bandwith, clean markup, and lots of numbers to optimize. Practical or not, the makes my inner hacker pretty happy.
msla 8y ago
It's a good start, but the CSS is obnoxious and definitely not low-tech, and the image dithering is a bad compromise between having real images and simply not having images at all. In short, it's an attempt at a low-tech website made by people who've never seen a real low-tech website, and probably wouldn't know Lynx if they saw it in use.
- eutropia 8y ago
  Doesn't this seem a bit uncharitable a characterization? What's an example of a "real low-tech website" that does better than the work presented here? Are you browsing hackernews using lynx or surfraw?
  - msla 8y ago
    https://yarchive.net/ https://yarchive.net/ That's a low-tech website. Absolutely nothing but content.
    - emodendroket 8y ago
      According to the article, the goal here was to demonstrate the possibility of making an attractive, modern-looking Web page while still having it be lightweight. Your example does not achieve the first goal at all.
    - arra 8y ago
      this is typical motherfuckingwebsite.com vs bettermotherfuckingwebsite.com. The design team of solar.lowtechmagazine.com is squarely on the side of the bettermotherfuckingwebsite.com
ww520 8y ago
For static sites, what's the strategy for user authentication?
- TeMPOraL 8y ago
  What would you need user authentication for in a static site?
  - ww520 8y ago
    Just want to see how far can it be pushed beyond simple sites.
- theandrewbailey 8y ago
  Anything that can send an HTTP GET.
- notriddle 8y ago
  There are no end-user accounts. Authors probably deploy by pushing to a git repo or ssh-ing into the server.
- user111233 8y ago
  Let nginx handle it https://developer.mozilla.org/en-US/docs/Web/HTTP/Authentication https://developer.mozilla.org/en-US/docs/Web/HTTP/Authentica...
jtms 8y ago
I am going to guess they are getting a massive surge of traffic about now and yet the site still renders in a fraction of the time it takes most "modern" web apps or even just static content sites - this is how it should be.
- deleted 8y ago
  [deleted]
- romaniv 8y ago
  Honestly, I'm not even sure what modern website are doing when they generate pages. I've had highly dynamic PHP/MySQL websites running on crap hardware, and it was trivial to attain .03 second page generation time. Didn't even need fancy caching, just some common-sense SQL optimizations.
  - wincy 8y ago
    At my last job we had an ad bidding API that would reach out to every advertiser we worked with, got the highest bid, then presented an advertisement to them. The page was also framework after framework piled on top of each other, so they’d be using React and jQuery at the same time, stuff like that. And so marketing could change whatever they wanted whenever they wanted without breaking the entire site, everything was served from a CMS. So it’s probably a lot of that.
    - jtms 8y ago
      LOL - oh man... I can relate! At a previous gig we had a similar situation. It was so bad my coworkers and I would joke that we needed one of those "break in case of emergency" boxes with the glass front and a hammer hanging adjacent. Inside the box: a can of lighter fluid and a match. The purpose: when the crazy got to be too much you just light own hair on fire and then go run around in traffic. What you just described would definitely be a break the glass kinda situation :-)
  - pmlnr 8y ago
    It's crappy wordpress themes. Before going static as well I made a WP theme with Twig, removing most <?php wp_magic_function(); ?> from there. It was fast, way faster, than the usual WP themes. Obviously nowhere close to a static HTML.
jbreckmckye 8y ago
I think this website is a beautiful piece of engineering: simple, efficient, clear and humane. It solves a pressing human problem with mature, straightforward technologies. The dithering is obviously not to everyone's tastes, but I like the paper feel and think it's appropriate for a 'low tech' brand. Bravo to the lowtech team.
dmos62 8y ago
The idea is great, the software side especially is something I'd like to see more of, and the not-always-available scheme is very commendable as well. But the end of article stuck out at me. > we'll be offering print on demand versions of our blog. How is that consistent with low energy footprint? Will the printers and the cellulose factory run on solar as well?
- pmlnr 8y ago
  Print, on it's own, is not that high energy. Paper has been made for thousands of years, printing has been here for 400. But the question is indeed an intriguing one.
deleted 8y ago
[deleted]
exabrial 8y ago
Speed in your biggest feature in every application. I don't understand why the current state of affairs _is utterly obsessed_ with lazy loading static content and SPA for things that seldom change.
Obi_Juan_Kenobi 8y ago
Could save an easy 80kB by cutting out Jquery. All it does is the little weather widget, and could be easily written in standard js.
- baliex 8y ago
  In a similar vein, the weather icons are 800x800px images displayed at no larger than 20x20px
  - boomlinde 8y ago
    Those large icons are rather compression friendly compared to the dithered images. It would still be a relatively huge save at 20x20 (after resize to 20x20 with imagemagick and pngcrush -brute, the 5.5k clear-day.png goes down to 559 bytes).
    - arra 8y ago
      800x800 indeed is excessive. We'll resize them to something smaller. Jquery is already on its way out. Thanks for the feedback!
Animats 8y ago
And then, at the end, there's one line of useless info - a weather forecast for their server location. Forecast: today Partly cloudy in the morning and breezy until afternoon. / tomorrow Partly cloudy until afternoon. / day after tomorrow Clear throughout the day. For that, they pulled in JQuery and made a XMLHTTP request.
- bovermyer 8y ago
  Not useless, as it's relevant to the solar power for the server.
- licyeus 8y ago
  The weather content is relevant in that their server would go offline with too many cloudy days. If their intent is to lower energy consumption of their server alone, offloading this weather check is the correct choice. But surely requesting+caching that info on their end (by perhaps rebuilding the static site every hour with an updated forecast) would be overall more efficient than having X number of clients request the data.
  - boomlinde 8y ago
    All it amounts to is one additional request, and the json file itself is probably generated by a cron job, not dynamically on demand. Surely rebuilding the website every hour (and invalidating the cache for X number of clients) would result in more requests.
shanecleveland 8y ago
Unrelated, but I really like the background/font color contrast on the site. Makes for very easy reading to my eye.
SeanFerree 8y ago
Excellent information!
stcredzero 8y ago
Didn't Bruce Sterling or William Gibson write a story where there was a street tribe called the "LoTeks?" I think it was William Gibson in the Johnny Mnemonic short story. Molly Millions fought a monomolecular weapon wielding assassin, using the LoTek's space to defeat him with "culture shock."
Mtinie 8y ago
I love the aesthetic! Great work. Here's my unsolicited design riff on the "battery indicator." I'm a fan of the concept, but the 100vw element width of the yellow fill was distracting me from the rest of the content. I used DevTools to mock up a narrow version which fits within the right content gutter, right next to the scroll bar. I had to tweak the percentage metric display a bit by stacking the sun above the value and removing the "%" indicator, but feel the end result has increased readability and is still understandable. https://imgur.com/a/IIPZILz https://imgur.com/a/IIPZILz
- profalseidol 8y ago
  Lower tech access to the image: https://i.imgur.com/o0Dtkai.png https://i.imgur.com/o0Dtkai.png
- fivefive55 8y ago
  This looks great! That was my one complaint about the site, the meter looked like a broken element. I figured out what it was pretty quickly and I love the concept, but it just didn't look quite right.
- acobster 8y ago
  I strongly agree that design element makes it look broken. I checked my uMatrix to make sure it wasn't blocking any styles before realizing that it was part of the design. I had a similar thought about a vertical bar that doesn't take up 100cw. Nice mockup!
qwerty456127 8y ago
> Default typeface I adore this for whatever low or high tech. As for me all this web-font stuff seems a huge piece of BS (except for rare cases when a website is meant to be more of a piece of art than serving a practical function or when you need to use an exotic language letters of which are rare to be found in the standard fonts on clients' computers) and I just block external fonts all the time.
- user111233 8y ago
  For developers it always seems like a good idea to use the system defaults but then you push it out to users and find out they all have insane defaults that work like crap. I had someone complaining to me that my mailto: link doesn't work but actually its just they had the wrong mail client set as default on their system.
  - qwerty456127 8y ago
    Not using custom web fonts that have to be loaded from external resources doesn't imply using pure defaults of the client's system. You still can specify font size and style with pure CSS.
bondant 8y ago
Does someone has already tried to code on an AlphaSmart? I suppose it's a little like using ed. I would be happy to have a distraction-free device to focus on my code. But I am not sure the screen is large enough to really work on it.
fencepost 8y ago
As a way to make use of resources you'd otherwise not have a use for this is interesting, but my feeling is that as a way to reduce "your" energy consumption it's misguided. I'm pretty sure that the energy usage of running even on very efficient dedicated hardware is going to be a lot higher than the incremental increase in consumption for an incredibly tiny VM instance in a data center focused on energy efficiency. The hardware choice is arguably overkill as well, at least if wifi is available and on use. Run it on a repurposed old phone, eliminate its share of the power draw of a network switch, etc.
browsercoin 8y ago
What if you moved this to Saudi Arabia or somewhere where it's always sunny? I feel like this is the grassroots movement where actual decentralization occurs-imagine a mesh network localized within cities and then somehow branching out to other.
bikamonki 8y ago
So, how many requests per second can one serve with such setup, without a noticeable impact on performance?
deleted 8y ago
[deleted]
acobster 8y ago
This is one of the coolest web projects I've seen lately. Great job! > Increasingly, activities that could perfectly happen off-line – such as writing a document, filling in a spreadsheet, or storing data – are now requiring continuous network access. This does not combine well with renewable energy sources such as wind and solar power, which are not always available. I'm surprised no one has mentioned progressive web apps. This seems like a perfect use-case for them. On a related note, I just found this research showing that Service Workers (on which PWAs are built) "do not have a significant impact over the energy consumption of [mobile] devices, regardless of the network conditions." [0] [0]: http://www.ivanomalavolta.com/files/papers/Mobilesoft_2017.pdf http://www.ivanomalavolta.com/files/papers/Mobilesoft_2017.p...
BraveNewCurency 8y ago
If you want to be online only part of the time, look into IPFS. Even if you go offline, your popular pages will likely be cached for a while, and can be cached forever if someone takes an interest in them.

Can someone explain to me how to reproduce the image dithering look in photoshop please ?

glassesman 8y ago
Easiest method I know of is Image > Mode > Indexed Color... From there you can heavily reduce the color count and select the dithering type.

Wonder if they've considered a gravity battery? As an additional benefit it'd let someone local "recharge" the battery manually rather than being 100% tied to the Sun.

uneekname 8y ago
I imagine huge weights hanging off the balcony of a Barcelona apartment :)
- mLuby 8y ago
  Could be pretty stylish I'd think. Chandelier with moving crystals? #LowTech :P
- anthk 8y ago
  We can hire a British from Salou for that.
- vidanay 8y ago
  I think this is called a "Grandfather clock" ;-)
foxhop 8y ago
Is there an off the shelf gravity battery that one could purchase for charging over USB?
perilunar 8y ago
It's Low Tech magazine: you can bet he's considered and analysed every form of energy storage you can think of, and several you haven't.

driverdan 8y ago

Cool experiment! My suggestion is to get a larger solar panel. Solar is cheap now, less than US$1 per watt. Why not get a 100W or a 200W panel? It will put out enough power to supply the server and router on a rainy day. The battery will only be necessary overnight. The price of 18650's is low enough that building your own pack to handle 30W continuous overnight is not costly. To help with the environmental impact and cost you can get used batteries that are being recycled or thrown away.

TeMPOraL 8y ago

> The size of the average web page (defined as the average page size of the 500,000 most popular domains) increased from 0.45 megabytes (MB) in 2010 to 1.7 megabytes in June 2018. It's the second place I see such low average size values (I'd say, somewhat reasonable), but I'm having a hard time believing in them. On a typical site, when I hit F12 and proceed to Network tab, I usually see ten times greater values. I fear that those statistics are either undercounting something, or 500k is just so many domains that the long tail of lightweight sites drags the average down, making values not representative of the real situation. I wonder how those stats would look if the average was weighted by the number of visits.

rossdavidh 8y ago
There is also the issue that caching (e.g. cdn of jQuery or React libraries) can mean that, if you visit a given website every day in a month, you may only download that library once (the first time). Their estimate is definitely lowball for your first visit, but it might be a reasonable estimate for how much is actually downloaded on average.
- mercer 8y ago
  I thought that the caching you describe in practice rarely actually offers much of a benefit (for various reasons), but maybe things changed?
toss1 8y ago
I remember from over a decade ago there was an annual contest to make the best web page that would fit into 5KB - yes, 5000 bytes. There were many impressive entries. I'd really hoped it would catch on. Sadly, that lightweight concept is now so forgotten that I can't even find it in a quick search. (perhaps someone else can find a pointer?)
- slater 8y ago
  https://the5k.org/about.php https://the5k.org/about.php :)

forgotpwd16 8y ago

Some cool concepts there. >Static Site This should be an obvious choice for sites not requiring dynamic elements. Also their choice of comments through email is a good solution to a problem static-made blogs have. >Dithered Images That won't work for every case, but is interesting. >Default typeface That's nice. I'm already disallowing sites to choose their own typeface. Except if a site is about design, then the typeface doesn't matter and probably I won't prefer their choice over mine. >No Third-Party Tracking This makes sense and I don't understand why self-hosted sites are doing it. The logs are there. Analyzing them is all that is needed. >No Advertising Services I'm fine with that but some sites rely on ads. I ain't aware of a method that will keep with their goals and provide ads.

TeMPOraL 8y ago
> This makes sense and I don't understand why self-hosted sites are doing it. The logs are there. Analyzing them is all that is needed. 1) Laziness. A third-party JS tracker usually comes with a complete dashboard, full of pretty (and sometimes even useful) graphs. 2) Data. Client-side trackers can spy on users more, giving you more information you can e.g. missapply in an A/B test trying to drive "engagement". RE 1, there exist tools aimed at analyzing server logs. I played with GoAccess a bit, it's quite OK. https://goaccess.io/ https://goaccess.io/
- mywittyname 8y ago
  You don't need a thirds party tracker to get fancy graphs. Matomo is free, open source, self-hosted, works on logs, and has fancy graphs. An ELK stack would also work fine. Lazy-loaded 1px images can be used for tracking how far users have read and a/b testing can be done by compiling multiple versions and redirecting users to the version you want them to try.
  - floren 8y ago
    If I could toot my own horn for a moment, Gravwell (gravwell.io) has a 2GB/day free license which should be plenty to ingest web logs. We've got a GeoIP module to resolve IPs to locations, we can display geographic heatmaps (see https://dev.gravwell.io/docs/#!search/map/map.md https://dev.gravwell.io/docs/#!search/map/map.md), a variety of charts, tables, etc. Matomo looks really polished and if it provides the features you need, it seems like an obvious choice. If OTOH you're looking at rolling your own with ELK, Gravwell might make sense.

powellzer 8y ago

From clicking around this site, it looks like their image dithering technique has taken away the color quality required to properly view the graphs on this article: https://solar.lowtechmagazine.com/2015/10/the-4g-mobile-internet-thats-already-there/ https://solar.lowtechmagazine.com/2015/10/the-4g-mobile-inte...

juliangoldsmith 8y ago
I'm not convinced it saves much in the way of bandwidth, either. If you take this[0] image, it's 43 KB for a 800x533 image. I'd expect a JPEG to be able to do that without too much in the way of artifacts. It does give the page a kind of neat newspapery vibe, though. [0]: https://solar.lowtechmagazine.com/dithers/sps_wide.png https://solar.lowtechmagazine.com/dithers/sps_wide.png
- bitsquirrel 8y ago
  This[0] is also a 43kB 800x533 image, saved at 30% JPEG quality from the GIMP. The whole dithering thing seems to be the wrong approach. [0]: https://bitsquirrel.co.uk/800x533.jpg https://bitsquirrel.co.uk/800x533.jpg
- jermaustin1 8y ago
  I agree. I feel they are doing it more for aesthetics than actual 'energy' consumption, but then they must justify why they are dithering, and "because it looks pretty" doesn't fit their shtick.
- mywittyname 8y ago
  Some of their images look like they are best suited to PNG format. I do agree that the consistency is nice for aesthetic reasons, but poorly rendered images do detract from the overall message.
- protonfish 8y ago
  Even if it did save bandwidth, that does not equal significant energy savings. And if it did, there are better ways to save. For example, looking at their response headers I see the image cache control expires after a day, plus has validation caching. This could be significantly improved. First, get rid of the `etag`, `expires`, and `last-modified` headers and go with expiration caching only. Increase the `max-age` from one day (86400) to one year (31536000). I get the HTML expiring after 24 hours, but images should be more aggressively cached. Validation caching always requires a round trip to the server, plus running validation rules on every single request so it can't save nearly as much bandwith and CPU as simple expiration caching. Also, if they got rid of the those headers, plus the pointless `server: nginx/1.10.3` they could save over 100b per HTTP response. I counted 19 requests on that article, so it may seem small, but it can add up to a significant amount.

gonzo41 8y ago

The best part is the dithering, this website reminds me of old Chemistry lab manuals.

oliv__ 8y ago

"Progress"

ryanianian 8y ago

The dithering on images is actually kinda nice. Less visual over-stimulation. But whatever this site is doing with the fixed-scroll yellow block is super weird. There's a "95%" thing next to a sun - is it somehow related to the solar battery powering the server? Rather than focusing on the content, the design focuses on the infrastructure at the expense of the content. Maybe that's the point, but this particular element is certainly off-putting.

amelius 8y ago
> The dithering on images is actually kinda nice. Less visual over-stimulation. Yes, but does it also consume less power, formatting the images this way?
- binaryorganic 8y ago
  Sure, as it reduces overall filesize. They could have achieved similar efficiency by compressing full-color images though.
  - zmw 8y ago
    Or they can do away with some of the useless images and save a lot more bytes.
    - emodendroket 8y ago
      > The main challenge was to reduce page size without making the website less attractive. Because images take up most of the bandwidth, it would be easy to obtain very small page sizes and lower energy use by eliminating images, reducing their number, or making them much smaller. However, visuals are an important part of Low-tech Magazine’s appeal, and the website would not be the same without them.
theandrewbailey 8y ago
I agree with you on the yellow background battery meter, but not the dithered images. At desktop sizes, it reminds me of the low-res dithered hell of the 90s, except its worse because it's effectively yellowscale. I hate image dithering with a burning passion. I bet the same images would look better as low res JPEGs (they are currently PNGs, which are made less compressible with the dithering noise).

uxp100 8y ago

I like the gauge, but wish it was only in the corner or something. That it is the background of the whole page is pretty distracting.

SippinLean 8y ago

I wish the content of the photographs wasn't so obscured

decasia 8y ago

Neat article, but I think we should distinguish basically two things here that the article blurs together: 1) Reducing website bandwidth and computational usage (static sites, small images, reducing extra resource requests). Super common topic that HN talks about all the time. 2) Reducing the electricity bill for the server and powering it with renewable resources. This part is quite neat, I think, but for a single bespoke website, the energy savings of using a single low-power server seems pretty trivial in the grand scheme of things — I could get similar savings by changing a living room lamp to a more energy efficient bulb. This inspires me to propose a third category of energy efficiency that the article doesn't touch on: human energy costs. Humans are quite energy intensive devices, and I suspect that the labor and human-maintenance costs of making this website dwarf the direct energy costs of running a webserver. I'd be curious how one would go about optimizing these other energy costs, and whether that can be done in a way that still preserves quality of work/life for the humans involved.

juliangoldsmith 8y ago
Is that a comment on the effort to produce a site like this, or the cheapness of energy and bandwidth? The effort required to produce a site like this would be negligible, given that it's almost entirely plain HTML. Dithering the images would take seconds in something like GIMP. The HTML looks to have been produced by a tool, based on the formatting, so they wouldn't need to spend time working with markup.
- maemilius 8y ago
  What about the energy used to design and build the infrastructure? There's a lot more that went into this project than just the static site, which is something the article touches on. To illustrate, I'm going to invent some numbers: Let's say that this site on "standard" hardware would use 1kW per day. This means the existing site saves ~950W per day looking at just the hardware energy use. However, the hardware it's running on had to be produced, let's say that costs 10kW. The solar panels and batteries need power to make, let's; say they cost another 30kW of power. Additionally, the system needs to be designed and built by a human being. Humans use a lot of energy. Let's say that this took 1 week to design and build. Let's say a human "uses" 50kW of "power" per day (e.g. from food production, etc.). This means it costs an additional 350kW of power to design and build the infrastructure. Adding up all these made up numbers gives us a total infrastructure cost of 390kW. This means that, in order to "pay back" the difference, the new system has to operate for (390,000 W / 950 W/d =) 410 days. These numbers are wildly inaccurate and cut a lot of corners, but this should give an idea as to what the grandparent was getting at. Sidenote: I'm not, personally, trying to make a point about the project itself. Just, in order to fully understand the energy impact you have, you need to take a lot more into account than just "the amount of work performed by the computer".

b2ccb2 8y ago

The dithering is nice for some images but it takes some details on graphs etc.. The example image given can be re-compressed using techniques like structural similarity (SSIM)[1] or Multi-scale structural similarity (2003 Paper)[2]. Using jpeg-archive[3] I resized the example image from the blog[4] with decent results: /tmp ls -1sh *.jpg *.png | sort -nr 740K 6a00e0099229e88833022ad3b23825200b-750wi.png 100K 6a00e0099229e88833022ad3b23825200b-750wi.jpg 64K small-fry.jpg 56K mpe.jpg 24K ms-ssim.jpg [1] https://en.wikipedia.org/wiki/Structural_similarity https://en.wikipedia.org/wiki/Structural_similarity [2] https://ece.uwaterloo.ca/~z70wang/publications/msssim.pdf https://ece.uwaterloo.ca/~z70wang/publications/msssim.pdf [3] https://github.com/danielgtaylor/jpeg-archive https://github.com/danielgtaylor/jpeg-archive [4] http://krisdedecker.typepad.com/.a/6a00e0099229e88833022ad3b23825200b-750wi http://krisdedecker.typepad.com/.a/6a00e0099229e88833022ad3b...

ktpsns 8y ago
If I understand you correctly, you propose a image format which should provide a better quality for less file size. However, to implement an in-browser client-side reader, one probably needs a javascript library, and this will blow up the size again [Side note: Actually I am surprised the site uses JavaScript at all, being that static]. Another proposal for image compression is to fall back on SVG, c.f. https://jmperezperez.com/svg-placeholders/ https://jmperezperez.com/svg-placeholders/ -- at least this does not need JS.
- b2ccb2 8y ago
  Those are compression techniques, they do not require js, nor a different client and work with the jpeg standard.
  - claudiulodro 8y ago
    To implement the improvements you suggest on this site (which appears to be a static site), the best way would be to have your proposed image compression as part of the static site preprocessor, correct? Just trying to understand how it would be implemented, as this site is an interesting idea but the dithered images would likely not have mass-appeal.

ObsoleteNerd 8y ago

I think this is a really cool idea actually. I help run a fair few websites for authors/creators that don't need 5 digits of up-time and super heavy websites. I'm sure most blogs/sites would be fine being much much lighter and running off something like this.

sbradford26 8y ago

I would be interested to see how the additional traffic from HN is impacting their power usage.

jkingsbery 8y ago

I'm curious how the energy usage for this site compares to something like hosting a site on S3.

g105b 8y ago
Using a datacentre such as S3 will gain the benefits of an economy of scale. Per-website S3 energy costs are going to be substantially lower than the energy cost of a solar-server: each solar-server that is installed will have had to have been built in factories which cost energy to run, shipped in delivery vehicles which cost energy to drive, plus the humans behind the website would require energy while building the server... all of which would easily be more than the net energy consumption of a single website in S3. That being said, the point of the project is to produce a website that is 100% solar powered. They never said they were aiming for something that is feasibly sustainable.
icebraining 8y ago
Probably not good I would think, especially if you take into account the energy used to produce and ship the computer, router, etc.

trqx 8y ago

I hope they fix the RSS feed and put the whole articles in there. It should be the norm, especially on a website with "low" uptime.

azdle 8y ago
https://solar.lowtechmagazine.com/feeds/all.atom.xml https://solar.lowtechmagazine.com/feeds/all.atom.xml ^ seems to have full articles.
- trqx 8y ago
  I mean article content, not just the first line or the title. This way articles are cached in case of downtime.
  - azdle 8y ago
    For some reason Firefox is only showing the <summary> contents when you click that link, but it's all in there and it shows the full article in ttrss for me.
- avhon1 8y ago
  Seems to have links to, and 1-sentence descriptions of, all of their articles. This isn't very useful if you want your RSS reader to pull down articles for you to read while you're offline. For that to work, you want the feed itself to have the full text of every article embedded inside it.
  - pmlnr 8y ago
    It has the full content. See view-source. Firefox hides it.
bArray 8y ago
I agree, but I would also expect to only receive text data and not images (or very highly compressed images). The other part of keeping the bandwidth cost of an RSS feed down is keeping a smaller number of articles in "rotation". EDIT: I just pulled their RSS feed - 50 articles currently in rotation! 32.42kB according to FireFox of just snippets of text and links!

Retr0spectrum 8y ago

Dithered images do not compress well. I'd be interested to see side-by-side comparisons of optimised pngs, optimised jpeg, reduced-pallete optimised pngs, and some more cutting-edge formats like BPG[0] and FLIF[1] [0] https://bellard.org/bpg/ https://bellard.org/bpg/ [1] https://flif.info/ https://flif.info/

adambowles 8y ago
https://news.ycombinator.com/item?id=18076214 https://news.ycombinator.com/item?id=18076214
vanderZwan 8y ago
> Dithered images do not compress well. That does somewhat depend on whether we are talking about positioned or Floyd-Steinberg dithering. Positioned dithering is a lot more regular and predictable, and hence easier to compress.

jhabdas 8y ago

Low-Tech seems a bit of a misnomer when referring to deceptive simplicity. Wonder if they considered building After Dark. https://after-dark.habd.as https://after-dark.habd.as

ravenstine 8y ago

I once basically did just that, besides the image dithering. I ran a small blog off a Raspberry Pi, only using Markdown files and something to render them to HTML. I used my own IP address, which I know you're not technically supposed to do but in 15 years I've never had an ISP crack down on me for it, and had a script that would run periodically to update the A record for my domain in Route 53. (since my IP was dynamic) Whether you're doing it for energy purposes or not, it's a fun project because it feels a bit like sticking it to the man, since we're used to always hosting our sites on someone else's machine.

kmgr 8y ago
What is the reason for not using your own ip?
- H1Supreme 8y ago
  I believe it goes against most terms of service agreements with non-commercial isp plans.
  - rossdavidh 8y ago
    My guess is that this is mostly a way for them to object if you start using too much bandwidth. Most ISP's "guarantee" way more bandwidth than they can actually provide on a daily basis. If you're hosting a website that gets low traffic, normally, they probably will not only not know, but not care. Just my guess.
floren 8y ago
For several years starting in 2010 I ran my personal website off a Pentium III Thinkpad running Plan 9 sitting on the floor behind my desk. I wrote the web server in Go; it was a "hybrid" in that it served mostly static files, but in the blog subdirectory it would render Markdown to HTML. It worked great! I eventually migrated to a VPS when the hardware started to get too flaky with age (and years of accumulated dust sucked through the fan inlet)

kome 8y ago

I'm proud of my low tech personal website: http://mrtno.com http://mrtno.com - I promise: it will never work on smartphones, just good old computers... I will build your static html page for money. Hit me up. ;)

lexicality 8y ago
You're proud that you make webpages that can't be consumed by the primary method most people use to get online?
- wtracy 8y ago
  Even more confusing, the linked website seems to work just fine on my Moto.
  - kome 8y ago
    well, it's just not optimized for it, it's just HTML + CSS, so it should work pretty much everywhere. I don't have a cellphone myself, so i never tested it.
- kome 8y ago
  YES!
  - lexicality 8y ago
    Why?
jamesgeck0 8y ago
The CSS @media attribute has been widely available since IE6. It's not exactly high tech.
- kome 8y ago
  Are we discussing about high tech or low tech?

tw1010 8y ago

Small sub-cultures, like this one, do experiments all the time in their little corner of the web. Some of the cultures die after a while, and some grow into something else, something bigger, something that starts to percolate on the mainstream surface, albeit possibly only tangental to how it started. I'm not sure I'd predict this movement will grow into something that reaches mainstream tech, but let's say I'm wrong, just for fun. Can anyone here think of a potential narrative that would describe how the current state of this experiment could possibly be perturbed and squeezed into a form that the mainstream soaks up as the next big (or medium-sized) thing? I'm just curious to know how my prediction that this won't grow any larger than it is today could be wrong.

uneekname 8y ago
While unlikely, I could see more wide-spread adoption of this concept if a large online company began using the approach. If Twitter for example decided to cut out all their bloat, simplify served graphics and assets, and invest in sustainable energy, I could see other high-profile internet companies following their lead. Just my 2¢
- jethro_tell 8y ago
  They would be getting rid of their product, which is to analyze and selling their users. I can see more wide spread adoption when people pay 2/mo for twitter and 3/mo for facebook.
rossdavidh 8y ago
Could well not happen, but the most likely driver of slimmed down websites, anyway, would be a desire to make them load better in India, Africa, parts of Latin America and eastern Asia that have low connection speeds. Not saying that's how it will go, but it's feasible that to get to the second and third billion internet users, you need to be slimmer.
- beat 8y ago
  It's still kind of a niche, though. People who don't live where decent internet access is readily available also tend to not have enough disposable wealth to make great business targets, especially for social media and other sites that sell eyeballs rather than widgets. On the other hand, one of the first things people with disposable income want today is good internet access, so as income grows for the middle five billion (and it's growing rapidly), there's tremendous market pressure to supply them with faster internet - maybe not up to the standards of the top billion, but not "low tech" either.

tapvt 8y ago

Solar power, low-bandwith, clean markup, and lots of numbers to optimize. Practical or not, the makes my inner hacker pretty happy.

msla 8y ago

It's a good start, but the CSS is obnoxious and definitely not low-tech, and the image dithering is a bad compromise between having real images and simply not having images at all. In short, it's an attempt at a low-tech website made by people who've never seen a real low-tech website, and probably wouldn't know Lynx if they saw it in use.

eutropia 8y ago
Doesn't this seem a bit uncharitable a characterization? What's an example of a "real low-tech website" that does better than the work presented here? Are you browsing hackernews using lynx or surfraw?
- msla 8y ago
  https://yarchive.net/ https://yarchive.net/ That's a low-tech website. Absolutely nothing but content.
  - emodendroket 8y ago
    According to the article, the goal here was to demonstrate the possibility of making an attractive, modern-looking Web page while still having it be lightweight. Your example does not achieve the first goal at all.
  - arra 8y ago
    this is typical motherfuckingwebsite.com vs bettermotherfuckingwebsite.com. The design team of solar.lowtechmagazine.com is squarely on the side of the bettermotherfuckingwebsite.com

ww520 8y ago

For static sites, what's the strategy for user authentication?

TeMPOraL 8y ago
What would you need user authentication for in a static site?
- ww520 8y ago
  Just want to see how far can it be pushed beyond simple sites.
theandrewbailey 8y ago
Anything that can send an HTTP GET.
notriddle 8y ago
There are no end-user accounts. Authors probably deploy by pushing to a git repo or ssh-ing into the server.
user111233 8y ago
Let nginx handle it https://developer.mozilla.org/en-US/docs/Web/HTTP/Authentication https://developer.mozilla.org/en-US/docs/Web/HTTP/Authentica...

jtms 8y ago

I am going to guess they are getting a massive surge of traffic about now and yet the site still renders in a fraction of the time it takes most "modern" web apps or even just static content sites - this is how it should be.

deleted 8y ago
[deleted]
romaniv 8y ago
Honestly, I'm not even sure what modern website are doing when they generate pages. I've had highly dynamic PHP/MySQL websites running on crap hardware, and it was trivial to attain .03 second page generation time. Didn't even need fancy caching, just some common-sense SQL optimizations.
- wincy 8y ago
  At my last job we had an ad bidding API that would reach out to every advertiser we worked with, got the highest bid, then presented an advertisement to them. The page was also framework after framework piled on top of each other, so they’d be using React and jQuery at the same time, stuff like that. And so marketing could change whatever they wanted whenever they wanted without breaking the entire site, everything was served from a CMS. So it’s probably a lot of that.
  - jtms 8y ago
    LOL - oh man... I can relate! At a previous gig we had a similar situation. It was so bad my coworkers and I would joke that we needed one of those "break in case of emergency" boxes with the glass front and a hammer hanging adjacent. Inside the box: a can of lighter fluid and a match. The purpose: when the crazy got to be too much you just light own hair on fire and then go run around in traffic. What you just described would definitely be a break the glass kinda situation :-)
- pmlnr 8y ago
  It's crappy wordpress themes. Before going static as well I made a WP theme with Twig, removing most <?php wp_magic_function(); ?> from there. It was fast, way faster, than the usual WP themes. Obviously nowhere close to a static HTML.

jbreckmckye 8y ago

I think this website is a beautiful piece of engineering: simple, efficient, clear and humane. It solves a pressing human problem with mature, straightforward technologies. The dithering is obviously not to everyone's tastes, but I like the paper feel and think it's appropriate for a 'low tech' brand. Bravo to the lowtech team.

dmos62 8y ago

The idea is great, the software side especially is something I'd like to see more of, and the not-always-available scheme is very commendable as well. But the end of article stuck out at me. > we'll be offering print on demand versions of our blog. How is that consistent with low energy footprint? Will the printers and the cellulose factory run on solar as well?

pmlnr 8y ago
Print, on it's own, is not that high energy. Paper has been made for thousands of years, printing has been here for 400. But the question is indeed an intriguing one.

deleted 8y ago

[deleted]

exabrial 8y ago

Speed in your biggest feature in every application. I don't understand why the current state of affairs _is utterly obsessed_ with lazy loading static content and SPA for things that seldom change.

Obi_Juan_Kenobi 8y ago

Could save an easy 80kB by cutting out Jquery. All it does is the little weather widget, and could be easily written in standard js.

baliex 8y ago
In a similar vein, the weather icons are 800x800px images displayed at no larger than 20x20px
- boomlinde 8y ago
  Those large icons are rather compression friendly compared to the dithered images. It would still be a relatively huge save at 20x20 (after resize to 20x20 with imagemagick and pngcrush -brute, the 5.5k clear-day.png goes down to 559 bytes).
  - arra 8y ago
    800x800 indeed is excessive. We'll resize them to something smaller. Jquery is already on its way out. Thanks for the feedback!

Animats 8y ago

And then, at the end, there's one line of useless info - a weather forecast for their server location. Forecast: today Partly cloudy in the morning and breezy until afternoon. / tomorrow Partly cloudy until afternoon. / day after tomorrow Clear throughout the day. For that, they pulled in JQuery and made a XMLHTTP request.

bovermyer 8y ago
Not useless, as it's relevant to the solar power for the server.
licyeus 8y ago
The weather content is relevant in that their server would go offline with too many cloudy days. If their intent is to lower energy consumption of their server alone, offloading this weather check is the correct choice. But surely requesting+caching that info on their end (by perhaps rebuilding the static site every hour with an updated forecast) would be overall more efficient than having X number of clients request the data.
- boomlinde 8y ago
  All it amounts to is one additional request, and the json file itself is probably generated by a cron job, not dynamically on demand. Surely rebuilding the website every hour (and invalidating the cache for X number of clients) would result in more requests.

shanecleveland 8y ago

Unrelated, but I really like the background/font color contrast on the site. Makes for very easy reading to my eye.

SeanFerree 8y ago

Excellent information!

stcredzero 8y ago

Didn't Bruce Sterling or William Gibson write a story where there was a street tribe called the "LoTeks?" I think it was William Gibson in the Johnny Mnemonic short story. Molly Millions fought a monomolecular weapon wielding assassin, using the LoTek's space to defeat him with "culture shock."

Mtinie 8y ago

I love the aesthetic! Great work. Here's my unsolicited design riff on the "battery indicator." I'm a fan of the concept, but the 100vw element width of the yellow fill was distracting me from the rest of the content. I used DevTools to mock up a narrow version which fits within the right content gutter, right next to the scroll bar. I had to tweak the percentage metric display a bit by stacking the sun above the value and removing the "%" indicator, but feel the end result has increased readability and is still understandable. https://imgur.com/a/IIPZILz https://imgur.com/a/IIPZILz

profalseidol 8y ago
Lower tech access to the image: https://i.imgur.com/o0Dtkai.png https://i.imgur.com/o0Dtkai.png
fivefive55 8y ago
This looks great! That was my one complaint about the site, the meter looked like a broken element. I figured out what it was pretty quickly and I love the concept, but it just didn't look quite right.
acobster 8y ago
I strongly agree that design element makes it look broken. I checked my uMatrix to make sure it wasn't blocking any styles before realizing that it was part of the design. I had a similar thought about a vertical bar that doesn't take up 100cw. Nice mockup!

qwerty456127 8y ago

> Default typeface I adore this for whatever low or high tech. As for me all this web-font stuff seems a huge piece of BS (except for rare cases when a website is meant to be more of a piece of art than serving a practical function or when you need to use an exotic language letters of which are rare to be found in the standard fonts on clients' computers) and I just block external fonts all the time.

user111233 8y ago
For developers it always seems like a good idea to use the system defaults but then you push it out to users and find out they all have insane defaults that work like crap. I had someone complaining to me that my mailto: link doesn't work but actually its just they had the wrong mail client set as default on their system.
- qwerty456127 8y ago
  Not using custom web fonts that have to be loaded from external resources doesn't imply using pure defaults of the client's system. You still can specify font size and style with pure CSS.

bondant 8y ago

Does someone has already tried to code on an AlphaSmart? I suppose it's a little like using ed. I would be happy to have a distraction-free device to focus on my code. But I am not sure the screen is large enough to really work on it.

fencepost 8y ago

As a way to make use of resources you'd otherwise not have a use for this is interesting, but my feeling is that as a way to reduce "your" energy consumption it's misguided. I'm pretty sure that the energy usage of running even on very efficient dedicated hardware is going to be a lot higher than the incremental increase in consumption for an incredibly tiny VM instance in a data center focused on energy efficiency. The hardware choice is arguably overkill as well, at least if wifi is available and on use. Run it on a repurposed old phone, eliminate its share of the power draw of a network switch, etc.

browsercoin 8y ago

What if you moved this to Saudi Arabia or somewhere where it's always sunny? I feel like this is the grassroots movement where actual decentralization occurs-imagine a mesh network localized within cities and then somehow branching out to other.

bikamonki 8y ago

So, how many requests per second can one serve with such setup, without a noticeable impact on performance?

deleted 8y ago

[deleted]

acobster 8y ago

This is one of the coolest web projects I've seen lately. Great job! > Increasingly, activities that could perfectly happen off-line – such as writing a document, filling in a spreadsheet, or storing data – are now requiring continuous network access. This does not combine well with renewable energy sources such as wind and solar power, which are not always available. I'm surprised no one has mentioned progressive web apps. This seems like a perfect use-case for them. On a related note, I just found this research showing that Service Workers (on which PWAs are built) "do not have a significant impact over the energy consumption of [mobile] devices, regardless of the network conditions." [0] [0]: http://www.ivanomalavolta.com/files/papers/Mobilesoft_2017.pdf http://www.ivanomalavolta.com/files/papers/Mobilesoft_2017.p...

BraveNewCurency 8y ago

If you want to be online only part of the time, look into IPFS. Even if you go offline, your popular pages will likely be cached for a while, and can be cached forever if someone takes an interest in them.