An independent archive of typography.
Topics
Formats
Typefaces

Low←tech Magazine website

Contributed by Matthijs Sluiter on Jan 9th, 2019. Artwork published in .
Screenshot taken at 09/01/19 at 4PM, server power level at 79%
Source: solar.lowtechmagazine.com License: All Rights Reserved.

Screenshot taken at 09/01/19 at 4PM, server power level at 79%

Low-tech Magazine was born in 2007 and has seen minimal changes ever since. Because a website redesign was long overdue — and because we try to practice what we preach — we decided to build a low-tech, self-hosted, and solar-powered version of Low-tech Magazine. The new blog is designed to radically reduce the energy use associated with accessing our content. — Low-tech Magazine

Low-tech Magazine is an online magazine, based in Barcelona. The owners/authors and their very involved readers research how obsolete technology could help solve high-tech problems. By the end of 2018, they launched an ultimate low-tech and solar-powered blog that could replace their current website.

The magazine’s masthead used an image of a spear-toting man. On the new blog, this image is evoked/replaced by an arrow symbol. As for the typography, the website uses system fonts. In this case (MacBook), the website uses Times for posts and Courier for reader’s comments. The (minimal) code does not specify these, it only mentions “monospace” for the comments, and nothing at all about the font family for the rest of the text. I assume that the serifs add a bit more black to the screen than if the website would use sans serifs, which means that a tiny bit less energy is needed to light up the screen.

Screenshot taken 28/12/18, 2AM, server power level at 26%.
Source: solar.lowtechmagazine.com License: All Rights Reserved.

Screenshot taken 28/12/18, 2AM, server power level at 26%.

Screenshot taken 27/12/18 at 10PM, server at 16% power.
Source: solar.lowtechmagazine.com License: All Rights Reserved.

Screenshot taken 27/12/18 at 10PM, server at 16% power.

Low←tech Magazine website 4
Source: solar.lowtechmagazine.com License: All Rights Reserved.
Low←tech Magazine website 5
Source: solar.lowtechmagazine.com License: All Rights Reserved.

12 Comments on “Low←tech Magazine website”

  1. Wow! This is really inspiring.

  2. Peter Z. says:
    Jan 9th, 2019 7:55 pm

    For me, the website renders in Times, not Times New Roman. fontsinuse.com/typefaces/52…

    The images here show Times as well. It probably depends on the browser settings and the fonts available in the operating system.

  3. I don’t think this quite counts as a use of these specific fonts. The actual fonts used here, as detailed in the website source code, are the client’s default and “monospace”, which just happen to render as TNR and Courier on most browsers.

    I mean, if I downloaded a book that is distributed as a text file, I couldn’t post it here as a use of Consolas just because that’s the default Notepad font. Just like this website, a text file doesn’t actually use any fonts.

    I happen to have changed my browser defaults to the Noto series, so the below is what I see:

    Personally, if I actually cared about the contents of a website that can go offline at any minute every day, I’d make sure to download most/all of it for easy access, defeating the purpose.

  4. Hello Peter, Thiago, thank you for commenting about the font in use is in this case. To me this is a very good example of using system fonts as primary type — both as a concept and in its execution.

    The execution here of course leads to the question which fonts are used! In this case, I have ID’ed the typeface as Times New Roman, the font used by the operating system that I used for the screenshots (Apple, macbook). According to this wiki, one of the small differences between Times and Times New Roman is that TNR has ligatures turned on by default, and Times does not. You can see one ‘fi’ ligature in the third screenshot. Then again, I am not 100% certain and I could be wrong of course about Times (New Roman) and/or Courier (New).

    I imagined that other people could see the website with a different set of fonts, and am happy to read so in the comments!

    Of course, one can change the typographic settings of a browser, and thus for every website visited in this browser (including Low-tech magazine and this website) — but that’s a personal choice, not a part of the design of the website.

  5. Matthijs, that’s the point: no fonts are part of the design of the website. The website has no fonts set in its source code – except for the monospaced part, where it specifies “monospace”, the user’s default monospaced font – and hence it will show up with whatever is your default font.

    It happens that the large majority of desktop browsers have Times New Roman as the default font and Courier as the default monospaced font, and hence you might imagine that the designers designed the website with it in mind as the most probable use case, but it was not a design choice by the designers that Times New Roman show up. If it were, they would have licensed Times New Roman and actually specified it, and then it would not be dependent at all on your browser settings.

    If you open the site on a phone, you probably won’t see Times New Roman. If you open the website on a Linux machine, you probably won’t see Times New Roman. If you open the website on a Kindle, you certainly won’t see Times New Roman. Times New Roman is not in the website, it’s in how you, personally, render it. Your rendering happens to be common, but it does not exist until you open it. What exists is the website’s content, and that content has no fonts used in it.

    Posting this as a use of these fonts is akin to my previous example of posting a text file as a use of Consolas because it’s the default font in Notepad, or to posting the “Zen of Python” easter egg in the Python programming language as a use of Consolas because that’s the default font in the Windows Commant Prompt. In these cases, the things themselves don’t have fonts, the renderings do, and they vary a lot by viewer.

  6. Hi Thiago, I really wanted to add this website to the collection because of its radical choice for typography: a limited set of fonts across all operating systems and browsers, chosen by specifying as little as possible. This is not the same as not choosing a font, of course. Maybe the designers have and maybe they have not tested and adjusted their design for all possible devices, I haven’t asked them.

    I could think of three valid ways of adding this design to Fonts In Use:

    – Mention the typefaces as “unidentified typeface”;
    - Collect screenshots of all possible renderings of the website, and add all these typefaces;
    - Show what I see, and add a description that explains that other visitors may see other typefaces.

    I picked the last option, and if the description caused some confusion, I am sure that the comments of you and Peter clarify what was not clear already.

  7. There seems to be a disagreement about what constitutes a Use. The fonts may be undefined on the designer’s side, but of course this website uses fonts, we can see them.

    With fonts on the web, the result is a combination of what the designer has specified (in this case hardly anything) and what’s available on the reader’s side. This is true for all websites: There are devices that don’t support web fonts, and users who consciously disallow websites to choose their own fonts, or who override them via user style sheets. Those may be in the minority, but same could be said about the people who don’t see the Low-tech Magazine website in Times (or Times New Roman). Specifying fonts for websites is always about making suggestions.

    Working with font stacks is pretty similar to the way typographers worked in pre-digital times. They may have specified a certain typeface, but if this choice wasn’t available at the printer who carried out the job, they had to compromise and suggest fallback options or approximations like “just use any oldstyle roman that you have stocked in 12pt”. The latter is equivalent to the font-family: monospace; CSS declaration. With printed matter, we usually don’t know how (or if) the font was defined by the designer. All we see is the result. I don’t think we need to narrow down the range of acceptable Uses to those where we can be certain that the result matches the designer’s (first) choice.

    For Thiago’s example: A text file can’t be viewed without a visual representation. As soon as you can read it, some font is being used. You are welcome to submit such a contribution. It would be a post rather about the Notepad app and its default font, though, not so much about the text file. (This is true to a certain—although lesser—extent for this web Use, too, but Matthijs has commented on that.) We do have some posts like this in the Collection, see e.g. OS X 10.8 (Mountain Lion) Notes App, Apple iBooks 1.5, or Kindle Paperwhite.

  8. For the question raised by Peter: The images indeed show Times, not Times New Roman. I’ve adjusted the credits.

    Linotype’s Times and Monotype’s Times New Roman are two interpretations of the same typeface design. Sometimes I wonder whether it makes sense to have two entries in our database. It’s not always possible to tell them apart. As for digital system fonts: Historically, Times has been the version bundled with Mac OS, while Times New Roman was distributed with Microsoft Windows. The recent versions of Mac OS X include both, but Times is still the default.

    Here’s a cheat sheet that shows some of the more noticeable differences between the two versions included with OS X, namely Times Roman (with Times Italic, v10.0d1e1; © 1990–99 Apple Computer Inc. © 1981 Linotype AG © 1990–91 Type Solutions Inc. © 1990–91 The Font Bureau Inc.), shown in black, and Times New Roman (v5.01.3x, with TNR Italic v5.00.3x, © 2006 The Monotype Corporation), shown in violet.

    1) Overall, Times New Roman is sharper, has a tad more contrast, and angled serifs (as in b) are steeper.

    2) Some glyphs exhibit more striking differences. In Times New Roman, F has a shorter arm, the diagonals in K meet at the stem, the top left serif in N is wider, the bowl in P curls upward, the bottom serif in S is vertical, the top left of t is bracketed more, and the outer serifs of w are wider.

    3) In the italics of Times New Roman, caps like A or W slope more, the bowl in b meets the stem at a higher point (and the counter isn’t smooth), f hangs more to the right and its bar is bracketed on the top left, g is much wider and has a wider ear, u has a curved entry stroke, z doesn’t descend.

    4) For more glaring differences, examine the diacritics or special characters like € % @ § ¶ ®.

  9. Thanks for the comment, and thanks for adding the comparison. Up until now, I had both designs mixed up all the time(s).

  10. The point of my examples is that text itself is just a platonic idea until it is rendered. I can not add a book to this website without adding a particular edition, because there is no particular font associated with, say, Hamlet until someone typesets it. If you memorize and recite Hamlet, it will use no fonts – it is not Hamlet that uses the fonts, but the particular editions.

    Similarly, a text file and this website are just abstract ideas until rendered, and it happens that each user builts his own “edition” of it when opening it, which, in the case of websites, uses TNR and Arial and Courier most of the time. The website does not use the fonts, but the user’s personal edition does. In order to be consistent, every rendering of the website would therefore be a separate use, just as different editions of a book are different uses. And this seems like it could yield too many similar posts.

    Maybe what would make the most sense would be to add “sans-serif”, “serif” and “monospace” as pseudo-fonts in the database for such highly client-dependent uses. This does not seem at all worth it, however.

    I think a happy medium is to consider that every rendering of the website is indeed a different edition, but that if two editions of the same thing are too similar, they shouldn’t both be posted separately. So I could not post my rendering of this website as another use – not because it is the same thing as Matthijs’ post, as it is a different edition, but because it simply looks too much alike.

  11. Thiago, your point is understood. The images in Matthijs’ post document a particular “edition”, namely the default in Mac OS X browsers, and he has been clear about it. Would you feel better if we added that info to the title, too?

  12. It is probably best not to do so, as to make it clear that this is intended to be the only post that will be made of this website. If you put “Low←tech Magazine website as rendered in OSX” it might seem to invite posts about the Windows rendering or others.

Post a comment