Every website is trying to reinvent the wheel. Foolish! I hate the grid/huge amount of white space layout that is so pervasive now. Websites that have their information in a nice and clean, condensed list view are unicorns now. Condensed lists are literally the best layout to convey information in a given space, take a look at how outlook or apple mail gives you the exact same information in their super condensed list views as they do in the 'mobile friendly' expanded view, except they give you much more information at a time without having to endlessly scroll. It would be acceptable if I was literally using my elbow to tap on a touchscreen, but I'm using a mouse and keyboard and I can comfortably click on something 10 pixels wide.
Take a look at any of the half dozen or so food delivery service websites. On my 13" screen on grubhub, I can see 5 search results at a time. 5! Each result takes up 1 full inch of screen real estate when it could be one single line of text. If it was single spaced, that would be 40 lines and therefore 40 results I could view at a time. But because the modern web is designed to be accommodating for a 500lb gorilla to poke at a touchscreen, I have to deal with only being able to see 1/8 the information that I could potentially see.
I think getting people to scroll isn't an accident, they want you to have to scroll.
Scrolling a website makes you physically interact with it, and I bet that has some psychological effects that work out in favour of the content creators.
Whenever I am in a place where you have to wait a lot, like at a bus station, nearly everyone is swiping at their phone.
They all look like crack addicts scratching for rocks in an alleyway.
Here's a relevant comic:
https://zenpencils.com/comic/129-marc-maron-the-social-media...
I humbly submit my own blog as being pretty darn readable without bloat. It’s responsive and simple. https://alanhogan.com
Edit: Here’s a relevant article: The problem with new blogging platforms https://alanhogan.com/the-problem-with-new-blog-platforms
Firstly, I hate sites that use such a narrow column on the screen. The wall of text from the previous post is obviously too much and is far too difficult to read and keep track of where you are, but using only a third of the screen seem far too little. I'm sure you could double the width of your text without affecting readability.
Secondly, I have really good distance vision but need reading glasses. I find the text on your site a bit small. From a distance it just a bit too small to read comfortably and from close with my reading glasses I feel like I need to get too close. Yes, I can increase the font size easily, but how about...
My suggestion: decrease the size of your borders by about 50% on each side and then increase the font size by 1 or 2 points. The increased column size will give more text on screen, but the increased font size will make sure it is not too much.
FWIW most professional typographers recommend a column width of 30-40em. Much more than that seriously increases the distance the eye has to travel from the end of one line to the beginning of the next, and makes it harder to keep track of where you are.
The max-width of this blog's main column is... 40em.
And now you know why so many sites do this thing you hate.
(An em, if you are not familiar with it, is a typographical measurement equal to "the width of an M in this font".)
Far be it from me to argue with professional typographers, but do you hear anyone saying "oh, the line lengths on paperbacks are far too long, I can't scan them"?
Maybe it's just me but I'm a little tired of always having to cater the the very lowest common denominator. That narrow width seems almost ludicrously too narrow to me, it's like a childrens book.
There has been research that suggests that most people don't finish articles, so it seems to me that maybe making columns so narrow is catering to the audience most likely to have such a short attention span that they probably won't finish your article anyway.
Or maybe I'm just a moany old git :-)
If most websites were like this one, I could write a simple one-page CSS that formatted them the way I want - including fonts, colors, lines etc. As originally intended by this whole HTML thing.
Cheers, Alan.
That said I am not defending current state of Medium.
Just resize your browser window: it's not the site's job to guess how you want content displayed.
I loved browsing the web in the 90s: I had a half-width browser window on one side of my screen, an editor window in the upper quadrant of the other side and a console window the the lower quadrant. It was great! Then suddenly every website decided that I must have a full-width browser window, and was ludicrously narrow with a half-width browser. And they all stopped using and started abusing CSS. And then they all started using & abusing (but I repeat myself) JavaScript.
All I really want from the Web in 2018 is the experience I had in the 90s, and I can't get it any longer.
Also this format works great with the browser's "Reader" function.
At a certain point you have to recognize that even little CSS (max-width, font-size) can actually be a good thing, and when a site lacks this it doesn't make it somehow inherently better, it just makes it harder to read and I am nearly as inclined to simply hit the back button as I am on Medium articles. It's two ends to a horseshoe. The best place to be is somewhere closer to the middle.
Here's the thing: I don't want the font or the images to be bigger, I want columns to not be this absurdly long. The only way for the user to achieve it is to resize the browser window.
There is a "max-width" CSS property for that. No framework or JS required, just a modicum of care.
> Also this format works great with the browser's "Reader" function.
It still would using max-width.
Pow, you have a choice about how wide the lines are.
I have a 40in monitor, a 13in monitor, and a 7in monitor.
It's impossible for a site developer to know how much space to allocate to their page.
On the 40in screen it would be asinine for me to maximise it, for example.
It's completely unsurprising to me that I can resize the window into a state where the website becomes silly. I just don't do that.
Resizing a window is trivial, it's not that you can't, it's that you won't.
edit: Obviously I know what responsive design is. I'm on Hacker News. The author hasn't done it (probably because they have better things to do), you have a trivial option to work around it.
The contrast to be drawn is with a site like Medium that deliberately goes out of its' way to be annoying and harder to use for some vague profitability goal.
https://en.wikipedia.org/wiki/Responsive_web_design
This concept is popular for more than 10 years now. Many websites do it with something as simple as
article { max-width: 60em }
Take Twitter for web. Reduce the browser to something like 60% or 70% of the screen width. The <div><p>...</p></div> elements containing the tweets are chopped off on the right side. It disrupts my reading experience due to minor resizing. This is most of the web today.
> Resizing a window is trivial, it's not that you can't, it's that you won't.
That's true. I don't want to be resizing my browser up and down for every good and bad website.
max-width: a bunch of ems;Responsive design is a thing, yes, but ultimately on a desktop computer you're always going to be able to choose a browser size that breaks a site.
Apart from calibrating the room lighting and monitor brightness, one can still have a dark background for the body but not for the wrapper that has max-size on it.
E.g. http://camendesign.com/ here you would have white that burns your eyes if it was done without max-size, as is it's much better. [edit: just noticed that blog actually doesn't use max-size, it doesn't shrink; but it easily could]
> Responsive design is a thing, yes, but ultimately on a desktop computer you're always going to be able to choose a browser size that breaks a site.
Only if you make it too small.
It's interesting though because I hit Ctrl-+ before I even realised I was doing it.
I guess I just don't see this stuff as being a big deal. It feels like a normal manual adjustment, like if I was pouring coffee and I have to make sure I aim to not spill it over the edge of the cup, or something.
Oh well. I guess we agree to disagree.
> Just get a smaller house.
---
> Hey, we are going to launch our product in a country that doesn't speak English but we don't have i18n ready.
> Just ask the users to use Google translate.
And you wonder why we can't have nice things.
Also, obligatory link: https://thebestmotherfucking.website
body {
font-family: Arial, Helvetica, sans-serif;
line-height: 1.45;
background-color: #ededed;
margin: auto;
padding: 0.5rem;
max-width: 80ch;
}
.pd {
padding-bottom: initial;
}
Should publication platforms be giving us two choices: their design and implementation; or raw text (HTML) we can style ourselves?
A little used browser feature is alternate style sheets. (View -> Page Style in Firefox.) This lets a site ship multiple CSS styles to the end user with some default. Example: https://developer.mozilla.org/samples/cssref/altstyles/index...
I think this is why RSS did and is dying, although it also seems to be making a comeback.
Ironically, the "reading mode" thing that is becoming popular is essentially that - stripping the page of most of its custom styling, and then applying some sensible default style. It's like we went full circle, all the way back to pre-CSS times.
That's how Google design used to be but is not anymore.
You want an image? Here's a tag: <img>"
Don't be surprised if someone has this "idea" soon and makes a killing with it. A lot of people seem to get tired with the current stream of "innovation" that makes the web slower and more complex.
Let's change the world. You can find my contact details in my bio[1, 2, 3].
[1] please note that by e-mailing me you are agreeing to my privacy policy which states that all e-mails may be read by me
[2] your IP address will be logged and tracked by both your ISP and Hacker News when you click the link to my bio
[3] [modal] this isn't actually anything, I just wanted to put something in your face [ yes ] [ yes ]
[4] alert('ha! gotcha! there's another one!')
edit: [5] would you like to sign up to my newsletter? [ no ] (there isn't one)
And even if you can somehow cut through all the complexity of modern hosting — you still have to make those HTMLs. Only now they have to be responsive, look no worse than whatever is out there, look nice when posted on Facebook or Twitter, render well in various read later apps, and generally work with a wide ecosystem. And then you have to continue to make your site work with all the new stuff, preferably without breaking older pages.
You can indeed be simpler than most websites out there, and not lose anything important. But don’t kid yourself — the web is much more complex than it used to be.
https://habd.as/zero-to-http-2-aws-hugo/ Is an example of how to do this. It has some steps but is not that hard. I think it can be even easier by scripting most of this out for less technical people.
The only javascript on any page is for the service worker that allows offline loading of pages.
I'm not saying that's right, but it is something to consider!
A blog used to be a text file on a screen. Like most words in the English language however, its meaning has changed overtime, as people's expectations have changed.
I personally like Medium because of its highlights feature and its unobtrusive comment system. In fact, I often scroll down to the comments first to see what people are saying, much like I (and many others) check the comments on HN submissions first before deciding whether to bother with the actual submission.
Don't get me wrong, medium has a lot of annoying issues. But this whole "let's go back to the stone ages" crap with regards to tech needs to stop.
A blog is a text file on a screen. There's really no need to do it on a proprietary system, you can literally upload a text file to your own host, but if you can't be bothered, somewhere like GitHub Pages.
You want an image? Here's a tag: <img>
If the idea is that it doesn't look pretty enough - well, a Medium blog doesn't look like anything at all because I've closed it after closing the first three popups.
Here is a link to my own personal blog: https://files.esotericnonsense.com/public/blog.txt
You're reading this comment right now on a site that gets it right.