A Guide to Minimalist Web Design (2017)
ismailelazizi.com
ismailelazizi.com
For instance, this article argues against unnecessary elements, yet it's about 1.8 MB, has rather useless (IMO) pictures, and I had to scroll down 1.5 screens (in a desktop FF) to see the beginning of the article. And then there are regular vague advices.
Apparently some focus on visual minimalism, others -- on pages being lightweight, yet others -- on minimal technologies. And what some would see as necessity others see as bloat.
Given that we're on HackerNews, I think we can answer that with certainty.
Well, I suppose looks professional and aesthetically pleasing are subjective, but I wouldn't change HackerNews's look.
No better way to prove the importance of avoiding useless complication, in this case gratuitous ornamental Javascript.
You write HTML and later use CSS to give that data a nice look.
Let's say you want to create a blog. Then you might have the following HTML tags in your page: H1, H2, TIME, P, A, IMG
That's it.
Then style those element and you are done.
Now ofcourse the above is an extreme simplification.
But with frameworks like Bootstrap you take the complete opposite approach. You fill your HTML with loads and loads of DIVs just to make something look good. Imho this is a mistake.
It also makes people to add data they don't need because 'every bootstrap page has a hero'.
As for a minimalistic design: just use 1 or 2 margins/paddings and around 3 to 4 colors everywhere.
That's how I did it a few days ago, after a stint with DokuWiki: https://www.2uo.de/myths-about-urandom/
It is kind of "ugly" and I still need to tinker with some things, but it also feels liberating.
I would, though, like a really good 'minimalist' framework that just works — almost as a reset — with no classes at all. '<table class="table">' has always bugged me in Bootstrap, and there are other examples with certainly feel overengineered, that lead to spaghetti HTML.
http://bettermotherfuckingwebsite.com
https://thebestmotherfucking.website (actually significantly worse)
https://bestmotherfucking.website (the best design of the lot)
and probably other niche ones
The original one doesn't use CSS at all (and doesn't set fonts with serifs), while all the others try to alter fonts and/or their sizes, potentially changing them from ones set/preferred by a user to ones set by a webmaster. thebestmotherfucking.website also tries to override colors. I think these are good (simple, hence easy to reason about) examples of the awkwardness that comes out of styling (and complexity of relatively simple decisions): some would assume certain user agents and settings, and possibly that users don't configure those. Not to mention that some may actually prefer serifs and other common defaults.
Would be amusing if that progression of websites grew even further, to heavy and heavily styled SPAs, completely reversing the original message.
"Sets fonts" is misleading--the creator knows and must know that the default in virtually every browser is whatever dog's-breakfast default serif there is. (Yes, yes, "the browser can change it," because we all know that every user is an artisanal crafter of browser preferences and truly, deeply cares to do that instead of go to a site where somebody thought that through in its presentation.)
It's not 1997 anymore. HTML is no longer a document markup language, it is an application-and-presentation toolkit, and whether or not you or I like it--I don't particularly, there are better ones--doesn't excuse doing bad work because we pretend users who happen to be fully congruent with ourselves want it.
Now my first reaction to a popup opening as soon as I navigate to an article or a terribly illegible and busy design is to reach for the reader - guarantees one click, minimal, legible text.
In other words, if you can't trust the designers, remove the design.
I too have been thinking about the philosophy of a minimal amount of "design." After a certain point or certain amount of "design" I feel like we have to ask ourselves, "what's it all for?" I've been getting into more front end territory and have been delighted with how much HTML does.
For me, it's not so much about minimalism. I feel that minimalism semantically conveys, "the absolute bare minimum possible." Whereas I like to see the design goal as, "what is necessary to fulfill the required purpose."
Shameless little plug here, this is a little experiment I've been working on:
erictheread.org
if it did that, and had some elements at top and bottom of the list, so you can [more] even from the top of the new view..
I've also structured the site in a way so that it kind of has a schema for each article and the next step was to write a little client so one could read from a terminal.
Baked into my design philosophy is "reuse" hence not opting for a custom light-to-dark-toggle. Thanks for this though, I'd just reminds me I gotta keep it up ha. Do you think browsing in the terminal would be a hassle for people?
I'm also trying not to go too far overboard, thanks!
No. the basics of the site make this close to zero cost and proof-by-example is the alternate textual views of the site which just work (tm)
I am trying not to be a google fanboi, but the ubiquitous consistency of keyboard accelerators in gmail, photos, docs, &c by google is one of the reasons I enjoy using their tools. They "get" keyboard warriors, in the browser.
Good tools feel like good tools. Had to re-read,"ubiquitous consistency," nice. Thanks for the value added.
I think the content and the controls should be kept separate without messing with the other, that applies to websites hijacking the scrolling as well as others trying to do creative Vim keybindings. I wish Vim browser plugins were comparable to a solution like qutebrowser though, Surfingkeys(which I use) is pretty good but the input delays of those plugins are frustrating.
- The death of personal websites?
- Decentralized social networks?
- Setting up a static website with Hugo/Jekyll?
- Why we did X in Julia/Rust/Go and not [commonly used framework]?
Don't get me wrong. There are plenty of occasions where so-called minimalist layouts are perfectly appropriate. Most of the lessons at the core of it are absolutely fundamental to design. And what it replaced, the very brief period of corporate skeuomorphic design was never that great and in my opinion had much more to do with companies wanting to showoff their fancy new technology than designing anything great in its own right.
However, I despair when I think of the amount of young designers who know nothing else and can barely imagine a life without the strict framework of minimalism and its accepted practices. They will never know the feeling of going off the beaten path and discovering something cool and valuable, because your inner minimalist has long since shot down that line of thought as frivolous self-indulgence. Only minimalist self-indulgence is accepted.
I'm sure most people here can agree that the web is kind of in a sad state right now. We're using staggering amounts of man-hours to run this thing. An enormous bloated stack of technologies maintained by a horde of programmers just so that designers can spend their days meticulously handcrafting minimalist websites that pretty much look the same and do the same thing, while being far heavier than they have any reason to be.
I can appreciate the programmers who build perfectly optimized "programmer minimalist" personal websites, but at the end of the day, I think that just amounts to a lot of really nice sandcastles. How do we translate that to the real world?
I'm hoping 2020s could be a decade when people get real about moving forward. Less aping of aesthetics and technologies from the 60s and 70s. More of productive experimentation, like in the 60s and 70s.
Google's home page. What is this, 1999? Users spend just as much time on Youtube as they do on Google, and YT's interface is the opposite of "minimal". Even Google's SERP is littered with ads, and they're shown inline with regular search results.
- Scroll bar on left.. why?
- superfluous links
- messy typography
- overly contrasty colour scheme.
Edit: 2014
No JS. Actual minimalism.