Show HN: Make Medium Readable Again
github.com
github.com
But really, any sort of thing that blocks, as the Github README says, "annoying, user-hostile software", is a good piece of software in my book.
In fact, there’s a special CSS position for sticky headers: position: sticky.
Which this doesn’t kill.
For example my personal site uses a sticky sidebar for primary navigation and if you hide it, you won't be able to browse anything.
$('*').filter(function() {
var pos = $(this).css('position');
return ( pos === 'fixed' || pos === 'sticky')
} ).toggleClass("_zapfix");
where _zapfix is a class where things are hidden and $ is jquery. javascript:var%20frames%20%3D%20document.getElementsByTagName%28%22iframe%22%29%3Bfor%20%28%3Bframes.length%3B%29%20%7Bframes%5Bframes.length-1%5D.parentNode.removeChild%28frames%5Bframes.length-1%5D%29%3B%7Dvoid%280%29Firefox has an about:config setting that kills them all.
So, thanks!
Ever thought of packaging this as a Firefox/Chrome (WebExtensions) addon? Want to collaborate on one? Or if you don't care, are you okay for me to start one from your userscript?
While IMHO mobile optimized should mean: wrap the text automatically at the width of the screen, in a readable size in portrait mode, don't hide anything that's visible on the desktop site (like dates, user comments, version history, ...), and support zooming in in a sane way
Even Wikipedia fails at showing the user comments pages and sane zooming in of pictures (it's always those sticky bars that ruin it)
Currently I need to zoom in every time to click any of them.
Obviously, that ends up blurry. The solution is SVG.
Actual advantages of mobile devices are:
* High DPI, handheld. You can look at a mobile screen from different distances for different use cases and screen contents.
* Less eye movement required than for using a typical HD desktop monitor. This makes it easier to navigate unknown applications / web sites.
* Easier to tap anywhere than to click anywhere with a mouse.
* 360° scrolling with high accuracy and intuitive control over the velocity.
* Zooming with quick and intuitive gestures.
Mobile devices are perfect for navigating wide, complex web sites. That's why "mobile" versions that ignore the advantages of mobile devices are usually worse than the desktop versions.
How "mobile-optimized" apps / web sites often fail:
* Overly large elements and fonts that cannot be zoomed out from. High DPI goes to waste.
* Fixed elements that obscure parts of the screen. They make the scrollable area so tiny that you have to move your eye balls quickly when scrolling.
* Hiding important elements in hamburger menus or making them inaccessible. Finding stuff has to require multiple taps so that it is even slower than with a mouse.
* Horizontal scrolling is evil except in awfully implemented code snippets. It is unimaginable to the modern web developer that someone would double-tap a column of text to read it and scroll around afterwards to discover what else the site has to offer.
* Vertical scrolling is too hard even though a touchscreen is perfect for that. All the "important" shit has to be fixed because users would be too stupid to find the menu by scrolling. A fixed "back to top" button is the icing on the modern web cake.
* Zooming is too hard so it should be better disabled, bugged or useless.
I disagree about those. "taping" lack a lot of precision a mouse has. And don't get me started on the typing experience as you can't use all your fingers and have no tactile return. Also Ctrl-F "the thing I'm looking for" anyone ?
The intuitive gestures are all but intuitive if you have never used them before. My first reflex to zoom is sure not to move diagonally 2 fingers on a picture.
I always forget that mobile browsers say "find in page" rather than "search" when you're trying to search for something on the page, so my eyes skim past it all the time in the hamburger menu.
I feel like I am 8 again bombing random walls / burning random trees in Zelda looking for a super secret fabled (atleast in my grade school) green potion of unlimited refills when I'm using iOS safari half the time.
Also, I feel like double tapping the address bar used to scroll to the top of the page too but it seems like it doesn't do that anymore so showing what was ninja patched out would be useful too.
I don't use my phone that much because the usability is rubbish, and when I do I find it an exercise in frustration.
So, when someone asks me to make a website usable on mobile, I really have no idea what usably on mobile would actually involve. And the result is I make a single column of content which is 100% of screen width and has all the buttons and text inputs enlarged.
I've tried looking for advice about this on the web, but because mobile is such a hype-driven area, the search engine results for any mobile web design topic are inevitably marketing idiocy.
So, where can I read something by people who've done real usability experiments on touchscreens?
Maybe I'm just paranoid enough to put up with it though :)
This should be the browser's job, and none of the webpage's business. Opera Mobile used to do a great job at this, together with zooming and generally making sure traditional webpages rendered in a usable manner on a small screen. With the spreading of dumbed down mobile sites, overcomplicated layout systems and overall inflexibility due to webdevs being UX control freaks, we apparently decided that was not the way to go and instead settled for whatever inferior experience the individual webdev comes up with for their website.
Also, the layout of the site is just rows which makes it easy to translate to a mobile device.
Or, just don't fiddle with it. One does not have to do anything to support zooming, other than to not obstruct it.
Except for verbatim/code blocks (i.e. line starts with two or more spaces) with, which are basically unreadable on mobile once they
stretch to multiple lines; I get that the intention is for code blocks, but they seem to be misused for quoting OP somewhat frequently.
It works be so much nicer if these blocks could render differently on mobile; it's surely not that hard for a computer to determine what is coffee and what isn't?Sure, they look far more bland and become less interactive, but I came for the content and not the author's idea of "design".
IMHO, the cause is a combination of commercialism and of visual designers being inculcated with inappropriate values and training from traditional print design.
I judge that it got a lot worse around the time the print-trained designers started to be pushed out of decision-making positions by the digital-trained ones.
What I have observed has been that, while technology has allowed screens to become a more expressive design medium, visual designers tend to be content to cargo-cult techniques from the static, vastly simpler, and more expansive medium of print, and it shows.
> static, vastly simpler
is the right way to go.
This is mere consistency on my part. I hated (most) Flash sites back in the day, and wasteful giant images, et c. I hate (most) JS/CSS cycle-burner sites and giant wasteful images today. Consistency is good. Shit not moving around on my screen is good. Controls working the usual way is good. Consistency, predictability, and clarity are good UX.
The basic 2-or-3-column layout with a thin header was fine, with maybe some tweaks for smaller screens these days. Early-period web's allergy to non-content large media files was good. Design mostly gets in the way, while making everything more expensive. I think its function was described perfectly by someone the last time we had a design thread: it's peacock feathers. Keeping up with design trends is harmful to function, but signals wealth (=stability, reliability, social proof of value) precisely because it's so costly and pointless. This doesn't mean it improves my experience on the Web.
>is the right way to go.
Right, and this is the problem. Digital information is frequently neither. Denying this and shoehorning it into techniques that work for simpler, more static information is hiding the message for the medium. It's bad design.
>The basic 2-or-3-column layout with a thin header was fine, with maybe some tweaks for smaller screens these days. Early-period web's allergy to non-content large media files was good. Design mostly gets in the way, while making everything more expensive.
This wasn't because print designers were in charge. It's because the design industry, for the most part, is allergic to innovation and was ignoring the web. The web designers weren't designers - they very junior developers with none of the pretensions or preconceptions that come with formal training as well as all the problems that come with that, and a really primitive medium.
It's rather telling that returning to those pre-css days would improve things, is it not?
Webpages these days are designed like casinos. I want specific content but they're keen on bombarding me with all the stuff they want me to want.
It is, however, exacerbated by designers who think they are creating fashion magazines. In addition to being co-opted by bad marketing, usability and function has, ironically, also been subordinated to immediate visual appeal.
However, you can't deny that we've some way since AOL, mirabilis and geocities.
This extension, however, has the advantage that it checks for a <meta property="al:ios:app_name" content="Medium"> in the document instead of applying to a hardcoded set of domains.
I followed the links on parent comment. Installed Stylish for FF[0] to manage userStyles. The link provided by parent[1] now shows install style:)
After installing the userStyle, medium is so much more readable as default without me having to click an extra 'readability' button to reload.
Very nice! I'm going to have a lot of fun experimenting with some other (annoying) sites.
[0] https://addons.mozilla.org/en-Us/firefox/addon/stylish/
[1] https://userstyles.org/styles/140923/medium-com-removing-bot...
What I don't understand is how they let it get this bad?
Not sure how it got this bad, but there are ways to solve it for all sites (reader mode)
https://itunes.apple.com/nl/app/unobstruct/id1255281426?l=en...
You can append most URLs to that to get simplified format (Reader-mode type result) of the site.
Example:
https://outline.com/https://medium.com/@yonatanzunger/so-abo...
I tried HackerNoon -- it doesn't work. Fuck'em.
[0] https://medium.com/@soleoshao/how-i-used-docker-for-latex-on...
e.g.: omitting the article title from the URL still works (https://medium.com/@soleoshao/cd29c0713cad) as does changing it to something else entirely (https://medium.com/@soleoshao/i-like-turtles-cd29c0713cad)
Both those URLs still load the article in question.
Having to click a link, go to another page, have that page jump around on you and still need to click another link to show the replies is pretty terrible.
Here's a GIF of my gripe: http://imgur.com/a/35YJs
On a related note, I tried to follow the RSS feed for a few people on medium and every single comment by the author comes up as a new item, leading to a flood every time they're active on the sire.
I tend to go to a W3M dump instead.
Indeed, it's so bad for image sharing sites that they seem to get replaced every year or two when the last one starts becoming more and more hostile towards their users' experience.
Luckily we have better tools these days to combat them. The fact that firefox has a built in reader mode is indicative of how user hostile web readability is these days.
[0] https://d2w9rnfcy7mm78.cloudfront.net/1142179/large_419d82d2...
ctrl+alt+r
However, while it is lovely when it does work, it crashes my browser rather often.
Not sure if the linked extension would work without JS, though.
https://chrome.google.com/webstore/detail/medium-highlight-o...
I do see the problems on Chrome.
https://medium.com/@andrey_cheptsov/making-java-code-easier-...
An added benefit, is its ability to send the article to my Kindle to read later at leisure.
Definitely contributes to the story. Clap clap clap.
[1] https://chrome.google.com/webstore/detail/just-read/dgmanlpm...
Am I on some sort of special version?
[0] https://hackernoon.com/the-rise-of-influencers-in-a-digital-... [1] https://imrat.com/medium-custom-domain-cloudflare-db76b8a9b2...
EDIT. Huh. No astral plane unicode allowed in HN comments.
Tall screen? Use a topbar.
Wide screen? Use a sidebar.
I'm increasingly finding sidebars ... bad.
I was considering my own direct alternative to the site, but at the moment I have other things to work on.
Github has some blogging options that I've been meaning to look at, and might also be an option.
I've been looking for a better solution, and Medium have pretty much elected themselves out of consideration with their recent directions, styling and otherwise. No confidence.
I've been on it for over a year [1] and really enjoying the simplicity myself.
Remember when they used to publish blog articles about making the web a better reading experience? That seems a bad joke now.
So Medium have trashed their brand. But my question is: do they know? Do they care? Do they read all the articles about how appalling the reading experience on their platform is? What's going on?
Maybe
> Do they care?
Sure, if they know.
> Do they read all the articles about how appalling the reading experience on their platform is?
Doubtful
>What's going on?
They don't know how to monetize any better than any other web site. They're following what other sites do to try and engage the people who do visit Medium longer. The problem is, what works for sites where the reading experience is secondary doesn't work for a site whose reading experience is primary. Somehow they either don't know that or cannot think of anything better to try.
If I werent' already committed to using Medium, I'd click away the instant I saw the site as it reminds me too much of spam-blog pages.
I can't recall what the rest says because by the time I've scanned the first part I've already right-clicked to "inspect" to delete the element. (Then I cleared all Medium cookies, but that doesn't prevent them from showing the popup again, and it still has the N so obviously they are storing it server-side. :-( )
Bleah.
Somewhere at Medium, perhaps even reading this thread, there is a Product Manager in charge of, among other things, making the Medium reading experience great. Unfortunately, he (not knowing his gender, just picking a pronoun) is angry and frustrated every day. He wants to do right by users, indeed, his mission is to make everything about the product awesome. But, there are so many competing priorities and agendas. His boss will say things like "We can't measure whether it's a better reading experience, so your KPIs are things like conversion, reach, number of user engagements!" So he grudgingly sets out to optimize these things, while at least trying to keep the site usable. His first suggestion is to pin all the site links to the top of the page so people are always clicking around Medium, churning from page to page. The "Social Sharing" PM reaches out with "Hey, buddy, why not make the social sharing buttons twice as big, and never remove them from the page--both our numbers will be through the roof! The "Audience Growth" PM wants to make sure there are at least 3 signup buttons visible at all times, because obviously users are just not seeing them. He wants to help his colleagues, and, he is expected to drive his KPIs. We can compromise a little here, and a little there. All these internal stakeholders will be grateful, and he will be seen as a team player.
So he has the developers go off and implement these things, rolls them out, and checks the all-important metrics dashboard. Lo and behold, all his targets are met! Success! A few more stock options next review-time! But in the back of his mind, the product owner in him is screaming in horror at what he's putting his users through in order to meet these goals. Maybe he even brings up these concerns with his management, but they dismiss them and want to instead talk about the next floating button bar he's going to add to drive those numbers even higher...
Of course, all these layout changes and annoyances have helped even more, so what was once a minimalistic site with a decent quality control standard is now just any old blogging platform with any old blogging platform's ugly awkward to use layout.
But it is intentionally bad. Which is actually even more annoying.
Medium took a format which was actually quite good and then deliberately, with full awareness, and malice aforethought, went and made it worse.
That ... is pretty annoying, and tells you about the site's priorities.
Thanks,
Pretty much everybody
Also, I think it's kind of delicious when a variant like this is used to actually describe a previously "Y/Great" thing (Medium was readable at some point). Kinda hijacks the meaning from the original phrase and makes it less shitty.