10 ms·
"A friend gave me design advice once. He said to start with left-aligned black text on a white background, and to apply styling only to solve a specific problem
by lsiebert 8y ago
"A friend gave me design advice once. He said to start with left-aligned black text on a white background, and to apply styling only to solve a specific problem. This is good advice. Embrace this, and you embrace Brutalist Web Design. Focus on your content and your visitors will enjoy you and your website. Focus on decoration or tricking your visitors into clicking ads, and your content will suffer, along with your visitors."
That's something I'm going to keep in mind.
- pmlnr 8y agoThis is a very good advice indeed.
- Filligree 8y agoPlease don't. Pure-white pages are painful to look at, let alone try to read -- just because our monitors can go all the way to #fff doesn't mean that's a good color to use more than once in a (rare) while.
- aloner 8y agoYou're saying this because black on white hurts your eyes? Because if I'm reading something, I really don't care about what the text looks like and that's what black on white is good at: distraction free reading.
- m3rc 8y agoThen that's a problem that you can solve, typically with a single line in your stylesheet. Doesn't damn the concept by any means.
- solatic 8y agoI feel like this is an idea for a simple browser plugin. If the site is #000 text on a #fff background, apply a stylesheet with lower contrast. If high contrast is painful to look at, and you can't control web designers throughout the world, but you can control your own web browser... then why are you still suffering?
- dredmorbius 8y agoSome browsers (Chrome Android) don't support plugins.
- tomasduda 8y agoThere's an extension for that. http://darkreader.org/ http://darkreader.org/
- bhrgunatha 8y agoUltimately I'd prefer a slight tweak - for example eee/111 or similar but I'd still prefer fff/000 to the ridiculously low contrast foreground/background trend in recent years. Perfect example: https://peach-melpa.org/ https://peach-melpa.org/ - on my equipment and with my eye sight, that's literally unreadable.
- Jarwain 8y agoScrolling on that site on my phone is incredibly broken too
- occams_chainsaw 8y agoOh look, changing the background color solves a specific problem. Just like the post you replied to mentioned.
- deleted 8y ago[deleted]
- callmekit 8y agoIf it's really painful, make sure you lower your monitor's brightness. Basically, the white color on the monitor should be the of same brightness as a sheet of white paper near it.
- zoom6628 8y agoAgree. Good proportion of us suffer from glare, pure white is literally painful to read. I usually reach for a dark mode just to be more pleasant. The whole premise of BWD is sound .... Content first, add bling only to solve a UX problem.
- chrismorgan 8y agoIf black-on-white is painful to look at, your monitor is too bright. Sadly, this is the case for the substantial majority of people, and so as web developers/designers/implementers we have to take it into account. Laptops tend to have the ability to conveniently adjust brightness, but then everyone went with ambient light sensors, and because they’re really pretty terrible at getting it right, laptop and OS manufacturers opted for erring on the side of excessive brightness, and so laptop screens are normally somewhere between too bright and way too bright. Desktop screens tend to be hard to adjust the brightness of, because the physical unit’s OSD approach to changing brightness is awful, and OS vendors haven’t hooked anything helpful into it for reasons that quite escape me. So most people still have their screens set at the default brightness level, which is way too bright for anything but direct sunlight. I remember with fondness CRTs that had a physical brightness dial that you could turn. So much better than what we have now. Phone screens… yeah, they’re normally too bright too for similar reasons to laptops. Again I criticise ambient light sensors. I went to quite some length to get the screen brightnesses for my Windows laptop and the external displays I normally use even vaguely sane, involving obscure freeware from ten years ago and deep diving into Windows APIs; there are basically two different APIs for working with display brightnesses: laptops’ internal displays use one, and external displays use the other (the internal display is also available through the other, but it doesn’t actually work for changing brightness). Said other API which external monitors need is exposed absolutely nowhere in any UI at all. (Windows basically lies about being unable to adjust brightness of external displays in its Settings app.) Screen-brightness-adjusting keys don’t seem to be interceptable (no hooking onto XF86MonBrightnessUp and XF86MonBrightnessDown as I did on my previous, Arch Linux, laptop), so your only recourse for linking the external displays’ brightness would be detecting the internal monitor’s brightness changing and effecting. (Incidentally, the jump from 0% brightness to 10% brightness is consistently massive on LCDs; I worked around this on Linux by making a logarithmic scale wrapper around xbacklight, but I can’t fix that conveniently on this laptop.) At present, I just type “b 0”, “b 40” or whatever into Command Prompt and it invokes a CLI-based external-screen-brightness-adjusting program. In my home office, my external displays normally operate at 20–40% brightness during the day, though I’ve gone up to 70% on occasion before, and 0% brightness during the evening (and I’d prefer −20–−10%; most screens’ minimum brightness is unreasonably bright).
- adito 8y agoWhat's acceptable background/foreground color combinations that isn't painful to look at, but also not too low on contrast?
- dredmorbius 8y agoI tend toward color: #330; background: #fffff0; Just off-black on a slightly creamy white. May even stick with #000 for text. Giving users ability to select a white, off-white, inverse, or solarised scheme is also useful. See also https://contrastrebellion.com https://contrastrebellion.com
- Moru 8y agoThat page is funny, I can only read the big text, the rest is too small and zooming is disabled. Message not really understood.
- dredmorbius 8y agoMost useful for the message, though I find it generally readable. My variant: https://codepen.io/dredmorbius/pen/KpMqqB https://codepen.io/dredmorbius/pen/KpMqqB
- red_admiral 8y agoThis site does use styling to solve one specific problem: overlong lines on wide screens. A sensible max-width and line-height can do wonders for readability, to the point that there are "reading mode" extensions that do pretty much just that. This site has main.max-width = 34em and line-height = 1.5 which is a good choice in my opinion. There also seems to be some nice vertical rhythm going on with the paragraph and title spacing.
- jcelerier 8y ago> with left-aligned black text ugh, please justify !
- kowdermeister 8y agoPlease don't ever. Justified text is the hardest to read and it's meant for print anyways.
- deleted 8y ago[deleted]
- bovine3dom 8y agoDo you have any citations for this claim? I can only find scholarly sources from the 1980s. If it is the hardest to read, why is it used in print? What distinguishes print from electronic media that means that justification works in one place but not the other? I would be particularly interested to read anything recent that considers legibility in print, the advent of high pixel density displays, and the impact of good justification such as that offered by microtype. I'm slightly biased here: I believe that justification has got a bad reputation due to how badly web browsers (especially Chrome which doesn't even support hyphenation) handle it.
- kowdermeister 8y agoIt is used in print to pack in the most letters into a single line, because the layout is fixed and words can be broken. It was simply economic to do so. Today we don't have that constraint and with tons of displays we can't be sure how the text will look fully justified. Browsers are indeed bad at it, but we don't need fully justified text in the first place. For me personally, I prefer varying line lengths because I can easily keep track where the previous line was. https://ux.stackexchange.com/questions/93429/why-is-text-justified-in-newspapers-but-not-on-the-web https://ux.stackexchange.com/questions/93429/why-is-text-jus... https://ux.stackexchange.com/questions/24025/should-text-on-the-web-be-justified https://ux.stackexchange.com/questions/24025/should-text-on-...
- robertAngst 8y ago> Focus on your content and your visitors will enjoy you and your website. Focus on decoration Yeah its time for that person to take a marketing class. Despite my website having best-in-class content, it took a custom wordpress theme for people to begin taking it seriously/sharing. My conversion doubled overnight.
- mynewtb 8y agoWhat's your site's topic? Is your site about sharing information or making money from one-time visitors?
- robertAngst 8y agoSharing information, google calories per dollar, thats the site.
- paulie_a 8y agoPlease don't encourage people taking marketing classes. The internet needs less advertising not more.
- conanbatt 8y agoMarketing != advertising
- l0gical1 8y agoThat is a great piece of advice. I've been programming for the web for a long time now, and have never heard it described so simply.