How to Design for the Web in 2019

https://medium.com/commitlog/how-to-design-for-the-web-in-2019-a0be4d6702e2

by cruxex • 7 years ago

199 94 7 years ago

medium.com

londons_explore• 7 years ago

Poor title, nice article

jraph5• 7 years ago

I love the tone of the article.

Excerpt:

Tip: Don’t serve the prompt to disable DNT on the guide that shows the users how to disable DNT as the conversion rate ends up being rather poor.

However, 4 unwarranted mentions of Brave (with affiliated links) and a big link to download Brave at the top of the article?

Hell no, please download Firefox instead! (just had to counter-balance this big advertisement on the HN front page).

edit: also, the original title is "How to Design for the Web in 2019"

uxcolumbo• 7 years ago

Hell no, please download Firefox instead!

My main browser is FF and secondary is Brave.

What's the problem with Brave - did I miss a memo?

jraph5• 7 years ago

I was just countering what I see as an obvious unwarranted advertisement for Brave. I think it is our duty to counter such advertisements here on HN.

As for the problems I see with Brave, though that was not my point:

- their business model, based on Basic Attention Tokens: "Basic Attention Token radically improves the efficiency of digital advertising by creating a new token that can be exchanged between publishers, advertisers, and users.". Well, I don't want to improve the efficiency of digital advertising. Even the name is telling. I do not want to sell my attention.

- they are based on Chromium. I don't want this browser engine monopoly, controlled by Google.

glogla• 7 years ago

That's because the whole article is Brave ad.

Clever one, but still just an ad.

caspervonb4• 7 years ago

It's an ad for "K&R's The C Programming Language" actually ;)

musicale• 7 years ago

Use affiliate links and URL shorteners! People love it when they have no idea where a link will take them, and it will surprise and delight them when they discover it was an affiliate link!

fader• 7 years ago

Hosting this article on Medium completely undermines it. This is what I see when I open it: https://i.postimg.cc/gk8SC8cT/pot-kettle-black.png

movedx• 7 years ago

ffs... that's a joke.

I don't even know why I click links to medium.com anymore. I should find a plugin that blocks it instead.

chopin• 7 years ago

uMatrix can accomplish that (just block everything for that domain).

ignoramous2• 7 years ago

See the same. I outlined it https://outline.com/sUNND9

MaxBarraclough• 7 years ago

I'm seeing inline pop-up spam at the bottom of the Outline page.

Is that stupid idea a new one, or did I just not notice until now?

makeramen• 7 years ago

On mobile you’re blocked by a full screen modal to sign up, followed by a persistent top banner to use their app.

chrismorgan• 7 years ago

I explicitly block all scripting on Medium websites with uMatrix, and it makes it quite reasonable. If you allow first-party scripts only (uMatrix’s default), all the images break and you get some of the annoyances added.

I also cull the waste-of-space top half of the header bar with a rule `##.js-metabarMiddle` in uBlock Origin.

SamWhited• 7 years ago

Given what this article is about, this might be the only appropriate article to post on Medium. It could have been one of the design tips "always use Medium for blogs to ensure your users are as annoyed as possible, by comparison your crappy website will feel great!"

koonsolo• 7 years ago

Undermines? In my opinion it confirms it.

orpheline2• 7 years ago

Interesting! I'm using Firefox Focus, and it loads fine... There is a prompt at the bottom about my number of free articles, but it didn't affect viewing the article.

Funes-• 7 years ago

I mean, he is actually poking fun at Medium in one of the mock-ups that illustrate the article. Look at the title bar and the URL: https://cdn-images-1.medium.com/max/1600/1*Gfb0mEijJO5D263uD....

caspervonb4• 7 years ago

Two actually, there's the one with "Maximum" too ;)

caspervonb4• 7 years ago

They're maximizing the layout, as per the guide.

ibejoeb• 7 years ago

Holy shit, postimg wants to show me notifications...

http://pichost.org/images/2019/06/13/ScreenShot2019-06-13at1...

Like what kind of notifications? "Bruh you seeing this?"

ksynwa• 7 years ago

I have this small script to hide distracting elements on Medium.

https://gist.github.com/kartikynwa/ef9d48fad6a912cd5688083cd...

I don't know why I wrote this because I don't even like the content that gets posted on Medium.

tomglynch• 7 years ago

Great article - poor execution.

Users win when the browser market is competitive. The article heavily promotes Brave. Others to move to are Firefox, Opera and Min.

gnud• 7 years ago

I'd stay away from Opera. If you don't like Firefox, try Vivaldi instead - feels like "old" Opera, made by the same people, mostly.

kmlx• 7 years ago

“Users win when the browser market is competitive.”

i’ll get downvoted for this, but i simply don’t agree. i think users lose when there are multiple browsers. my argument relies on a basic fact: one cannot guarantee that a new website will work on all browsers without heavy amounts of testing. as such, the battle of the browsers shouldn’t be around engines, which simply duplicates code into different paradigms, instead it should be around ideas.

imagine a world with a single browser: all websites work perfectly, while implementing new tech would be a fierce competitive battle of ideas.

want newTechX implemented? then you’ll have to convince ms, goog and the rest of the community in order to implement it.

users would get both the competitive advantage and a stable “runs anything environment”, instead of the chaos of yesterday.

kzzzznot• 7 years ago

Sure, while that one browser is functioning perfectly and the company developing it is playing nice/functioning perfectly.

Wouldn’t it be great if everywhere we never had to make any choices between products, there was just one clear perfect choice offered by one perfect company? Yes, but that’s a utopian fantasy.

Firadeoclus• 7 years ago

Sometimes it's very much in the users' interest for websites not to "work perfectly", i.e. do what the designer intended.

Terretta• 7 years ago

I guess I’m a contrarian, I think “all websites work perfectly” when they are allowed to be web sites instead of “apps”.

“Heavy amounts of testing” comes from trying to use the web as a combination of magazine publishing design style and Flash animation interactivity. If you used hypertext with semantic markup, you’d work in anything including Lynx in a terminal and text readers for the blind. Add a minimalist CSS such as https://milligram.io/, change font, spacing, colors of elements, and be done with it.

If you use the web just a piece of paper to convey information, think Economist or The Atlantic instead of Cosmo or Us magazine, it all pretty much “just works”.

By contrast, if you use the web as a SPA (single page app) engine, you’re gonna have a bad time. For that, test in Safari for iOS, Chrome on Android, so you work in their native embedded engine. Given they’re both originally WebKit / KHTML, you’re not too far apart.

This approach downscopes your test footprint dramatically. You’re still worried about “duplicates code into different paradigms” but (a) you should have different paradigms for Android and iOS, they have a very different user expected feel, and (b) its really only the 2 paradigms with 2 modalities each: iOS/Android, phone/tablet.

Recognize this is a contrarian view when these days it’s popular to try to shoot for a single experience on every form factor, and easy to forget most content on the web is still not in app form, it’s just stuff to read. HTML 3.2 / 4 with CSS wasn’t a terrible place to live.

Fun fact: “Internet Explorer 5.0 for the Macintosh (really!), shipped in March 2000, was the first browser to have full (better than 99 percent) CSS 1 support, surpassing Opera, which had been the leader since its introduction of CSS support fifteen months earlier.”

psychoslave2• 7 years ago

That's right, comrade, that's also why we need a single party, a deeply centralized world government and a great Führer^W Leader to guide us all under its wonderful unifying vision of the brave upcoming world.

Let's all remember that harmony is not unison: our single goal must be to reduce everything until no difference remains and the universe is at last reconciled into the great singularity.

orpheline2• 7 years ago

"[O]ne cannot guarantee that a new website will work on all browsers without heavy amounts of testing."

Then maybe all browsers should implement standards consistently. That's why we have standards.

AnIdiotOnTheNet• 7 years ago

imagine a world with a single browser

I have a better idea: imagine a world where the specification for how to render websites is simple, clear, unambiguous, and infrequently changed.

Do you hear people saying the world would be better off if there were only one PNG viewer?

zrobotics• 7 years ago

When there was a single dominant browser, it didn't reduce the chaos all that much. Are you pining for the days of "This site best viewed in Internet Explorer 5.0"? Considering that currently in the front page there is an article bashing Google for single-handedly introducing <toast> with no outside consultation,at this point if you want new tech introduced Google are the only people you need to convince.

Slashbot• 7 years ago

I moved away from Firefox, Vivaldi is just far better...Mozilla screwed up, you can get better built in features in Vivaldi, than Firefox even has addons for.. because those retards at Mozilla.. they might aswel work for Google.

ricardobeat• 7 years ago

Why oh why is this being published on Medium? It does all of that and more.

geddy• 7 years ago

I think that's sort of the point. The irony there just adds to the article.

boblebricoleur• 7 years ago

Browsing the internet today is so exhausting.

I would add one more rule "make sure your user has to perform at least 37 clicks before accessing your ad riddled article"

jfengel• 7 years ago

I find that most of the time, the ad-riddled article wasn't worth reading. The number and intrusiveness of advertising grows in proportion to the desperation of the author to make the most of what little time you're going to spend.

The Internet is exhausting because the Internet is exhausted. Good content is hard, and there's less of it than you'd hope. The web gains perhaps a few minutes worth of meaningful content per day, if that. And unless you particularly enjoy being the one trying to ferret it out of the torrent, it's better to let some other aggregator do it for you. Read that, then turn it off and go do something else.

TeMPOraL• 7 years ago

The number and intrusiveness of advertising grows in proportion to the desperation of the author to make the most of what little time you're going to spend.

I have a rule of thumb that hasn't failed me for a decade now: the trustworthiness of a source is inversely proportional to the amount of advertising it puts up.

mmoez• 7 years ago

The title is misleading but the article is a true masterpiece.

My only regret is that it was published on Medium who does implements almost all the bad practices the article criticizes.

marcosdumay• 7 years ago

It's an illustrated guide with real working examples!

psychoslave2• 7 years ago

To make Medium work, we log user data and share it with processors. To use Medium, you must agree to our Privacy Policy, including cookie policy.

LOL, meta-irony?

saagarjha• 7 years ago

Many modern browsers these days support a HTTP header called DNT which stands for Do Not Track.

Note that Safari has already removed the Do Not Track header as websites began using it as a way to fingerprint users.

JimWestergren• 7 years ago

Can't even read it "Keep the story going. Sign up for an extra free read."

scottharveyco• 7 years ago

I thought that was the joke until I read the comments here and realised there was a full article and Medium actually blocks articles that way now.

ilikehurdles• 7 years ago

Huh. I had no idea I was limited in the number of reads. Amazing how Medium went from consistent minimalist hosting for long-form articles to this.

aabbcc1241• 7 years ago

You can log out to read, or use private mode, or use web archive sites

menzoic• 7 years ago

Dark Patterns 101 in 2019

chrisweekly• 7 years ago

Hilarious, and depressing, in ~equal measure.

seapunk• 7 years ago

It's hilarious but I'm sure some people will think it's a compilation of good pratices.

Alexander473• 7 years ago

Yeah, the article is confusing for that matter.

onefullclick• 7 years ago

So he basically posted the same last year (https://medium.com/s/silicon-satire/how-to-design-for-the-mo...) without the Brave links.

caspervonb4• 7 years ago

The Medium editorial team kinda messed that one up, I gave permission because I thought it was really funny that Medium was gonna feature me bashing on Medium. Which it was but they kinda just made it dull and ruined the tone.

rullopat• 7 years ago

I'd suggest to delete as spam all the new links on Hacker News that are behind a paywall or a mandatory sign-in.

thehenster• 7 years ago

This one remains the most important principle and it’s not without reason. Well paid focus groups have shown that the very first thing a user wants to do when visiting your web site in their web browser is to install a mobile application.

_hangs head_

lhousa• 7 years ago

No one:

Medium: You read a lot. We like that. UPGRADE!

dna_polymerase• 7 years ago

Medium always have had a problem with shallow content. Now they decided to completely screw their website and they are great at it. Stop posting on Medium, please. There really can’t be an audience on that monstrosity of a website, it’s just not worth posting there.

archiepeach• 7 years ago

I've decided to renounce the web after more than 7 years as a professional web developer. My current plan is to see if I can transition to making Swift apps for Apple devices instead.

This was partly triggered by the recent news that Google is taking aim at ad-blockers in Chrome. I doubt I would have ever wanted to go into web development if I knew what the web of 2019 would look like without ad-blockers.

A couple things drew me to the web.

1. You could write a site once, and it would work (pretty much) in any browser.

2. The dev experience of being able to instantly see changes was great.

3. It was easier than app development.

After dipping into some recent WWDC videos, I was impressed to see how far app development had come.

1. With SwiftUI, you can learn once, and build apps for pretty much any Apple device.

2. The dev experience is great with instant live previews (in the beta version of Mac OS Catalina).

3. SwiftUI is very easy to reason about, particularly when coming from a component-based architecture framework such as React or Angular.

At this point, waiting for an "app-like" experience for web apps feels a bit like waiting for the year of the linux desktop.

Progressive Web Apps have come far, but they still have a long way to go, particularly in "feeling" like a native app experience. When interruptible animations are introduced, I'll give them another look.

For a long time, the web had the perception of a free and open democratiser, but it's become completely commercialised. It's a petri dish for privacy violations. Why has my ad-blocker stopped 18,000 trackers in the two months since I've had it running?

I want to make tools, not marketing funnels. Apps that follow Apple's suit will encrypt user data so that not even the app maker can view user data. When was the last time you saw that on the web?

omarchowdhury3• 7 years ago

At this point, waiting for an "app-like" experience for web apps feels a bit like waiting for the year of the linux desktop.

You should check out Webflow and Figma.

tonyedgecombe2• 7 years ago

Why would you trust some corporation to look after your content into the future. At least with Sketch I know I can continue to use the software after my subscription expires. These companies are only one takeover away from jacking up their prices or removing a little used feature that is crucial to you.

jmalkin2• 7 years ago

Apps do a huge amount of tracking too, and they have their own dark patterns, like making things really addicting

What's more is apps exist in their walled gardens far more than websites, even if the web has been getting worse in that regard

0x4454422• 7 years ago

Yeah when web apps started to take off, circa 2000 I'd say, the big selling point was the ease of deployment and update and the ability to have a single code base for multiple OS's. Also, up to that point application installation mostly consisted of going down to uber electronics store and buying a box with the app burned on a CD.

However, not too much later I found many instances of mom, pop, buddy and sis having no troubles downloading and installing apps like iTunes and, ironically, web browsers; regardless of their operating system. Also, these installed apps phoned home to keep themselves up to date.

Fast forward 10-15 years later and there's a significant increase in internet traffic but the increase is do to thick clients on mobile devices and now it's the same issues as before; how to package and deploy on multiple platforms and maintain a single code base. But the thing to not is users don't seem to mind installing and uninstalling apps if the interface they're using makes it easy.

And that brings us to present day where mobile development has pretty much ditched web apps but desktop development is still holding on to web apps. And it's rather hilarious to watch the schizophrenic evolution of web app technology over time regarding who much of the code to put on the client vs the server.

All that to say, I agree; technologies exist to build multi-platform client applications that reach back to servers for data if they need to. And I wish the whole application in a browser thing would just die and browser would return to what they were designed for, displaying hypertext.

mahidhar• 7 years ago

As a fellow web developer, I want to offer a different viewpoint. Firstly, the pros that you listed for the web are equally valid today as they were 7 years ago. But additionally, I want to push back a bit against the "app-ifiction" of the web. I see the web as its own platform, and trying to implement "native" features on it seems counter productive. The web has features which are completely native to it, which are either very difficult, or downright impossible to replicate on Android and iOS apps (proper URL's, standardisations etc., just to give some examples off the top of my head). And yet no one seems to be complaining about that. I understand that this argument comes across as a what-about-ism, but I do genuinely think that the web platform is different, and should be approached on its own terms, rather than trying to mimic an Android or an iOS app experience.

On a higher level, as web developers, I think it is worth remembering that we don't have to build these half broken app experiences. We can still build web sites. We can still open a simple index.html file, put in some markup, and voila, it renders on the browser. We can choose not to implement all the trackers, invasive ads, broken "personalisation" algorithms etc. The fact that these things are implemented on all websites nevertheless is not because of some technical failure of the web platform. I believe it's a human problem of organisational politics, where the business users want these features, and overrule any objections that the developers might have regarding privacy or performance. Additionally, Android and iOS apps also implement these tracking features, with numerous SDK's available to create these marketing funnels that you mentioned. They may not be visible as an ugly badge icon in the top right corner showing how many were blocked, but they are definitely there. At the end of the day, the business/client that we are working for is asking for these things, and we can either try to educate them against these features, cave in and implement these functionalities, or move to a different organization/team/project more in line with our view points. But we cannot solve this with a technical solution like changing platforms.

Finally, regarding the perception that the web is a free and open democratiser, isn't it still one? I can still spin up a web server not hosted on one of the cloud platforms to host and serve my content. Yes, discoverability, scaling etc., are problems, but that's true for practically everything from social media, to e-commerce. Again, from a technical perspective, nothing is stopping us from developing websites or even web apps which are not beholden to commercial and centralised interests. Again, we don't do it, because of "IRL" reasons which don't really have any good technical solutions. In fact, going into the highly controlled and regulated environments of Apple's iOS, and to lesser extent Google's Android, sounds like the exact opposite of free and open.

That being said, if you find that you like working on iOS or Android apps, or you want to build apps which leverage the strengths of those platforms, then go ahead and I hope enjoy it!

chacha2• 7 years ago

All of the problems in the article are caused by corporations trying to maximise profit. This has turned you off developing for a decentralised platform and instead to one under complete control of one corporation.

This company also uses that control granted to it to:

- Force a cut of all payments through them

- Promote their own services and software above all else

- Ban protocols they don't approve of (The decentralised web never would have been made if Apple had their current dominance with their current strategies)

- Censor political views they don't agree with https://en.wikipedia.org/wiki/Censorship_by_Apple

For this corporate dominance the user cannot remove or modify anything they don't like about the app they're using (remove annoyances, make highly calculated addicting software less so, improve accessibility).

IloveHN84• 7 years ago

Looks like the LinkedIn website

jmalkin2• 7 years ago

Is it ironic that this is on medium, which is a great example of how not to design for the web?

blunte2• 7 years ago

Does Medium have a team of people here to downvote anyone who points this out? I've seen several comments like this one, and they're dead or nearly.

SimeVidas• 7 years ago

Am I the only one who got paywalled? You folks must not read Medium a lot :-D

0x4454422• 7 years ago

Here's my rebuttal... Don't do almost everything the article says to do and put your site behind a pay wall if you absolutely must monetize.

xtf2• 7 years ago

IMHO Wrong:

1. Mobile App. The site has to work by itself. Else go PWA

2. DNT. Respect Users decisions. Allow cookieless and JSless.

3. See 2.

4. See 2. + I would't disable adblock in the net, because it the main entry for malware.

5. Block Foreign. Expand as you understand the laws.

6. Max Layout. Called Mobile First, and seams to be national behavior. International pages sometimes look foreign to me. Use your screenspace wisely, yes.

7. Use Notifications. OK, but, see 8 and 9.

8. Prompt User. Don't annoy users. If they are on the net, they know how it regulary works, don't get of the standard behavior patterns.

9. Allow Opt-out. Opt-In is the way to go, else maybe violates GDPR and other laws.

10. Use Javascript. Not all websites require Javascript, most yes, but not all. Don't rely on it, especially impaired users will hat you for 'visually correct' but not screenreader enabled. Use standards.

PS: Don't be an apple hipster. Was biased from the beginning, got confirmed. But, read it.

gridlockd2• 7 years ago

The whole article is satire, but I can see how one might believe it isn't. It's too real.

xtf2• 7 years ago

Then it got me there. And in respect to a satire, then it's a good one. Reverse it and you have a more accurate Webdev '19 Article.

gridlockd2• 7 years ago

This isn't so much about the "The Web" but about media outlets. None of the websites I visit (directly) are anything like this.

The fun ends when I click a link to a media outlet. For some reason, most outlets seem to follow this "design advice" unironically and to the letter. I think my personal bounce rate is now well over 50%.

Granted, I'm not a "valuable customer" to these companies. I'm not going to subscribe, I block ads/trackers, I'm not going to register a "free account", I'm definitely not going to install the app and of course I don't want to be notified of anything, ever.

My question is: Who is? Who goes through all the trouble? All these annoyances must be working somehow, to get those last 0,0001% of people who actually care. It must have been A/B tested and found to be beneficial.

Therefore, there is no sense in lamenting it. It's like homeshopping - you might think it is completely idiotic, but really it's just adapted perfectly to its customers.

rchaud• 7 years ago

No, many of these apply to web apps like e-commerce stores as well. Go to amazon.ca or wayfair.ca and you'll be greeted with a "download our app" persistent interstitial that promises "advanced features". BS.

They want you to install the app so they can silently get access to a laundry list of permissions that a web browser would throw up dialog windows about. There is no additional functionality on the app for the user, because you can tell the "apps" serve the normal site in a webview wrapper.

blunte2• 7 years ago

Oh the irony of posting this via medium.com ...

module0000• 7 years ago

This article wins - because at the very bottom is a link to K & R's C Programming Language book. Some people like cat pictures, memes, clever saying, etc... I like links anything authored by Dennis Ritchie.

ourcat• 7 years ago

Am I alone in finding it amusing that this article is on Medium, a site designed for reading, yet decides to cover valuable screen space with fixed headers and footers?

darepublic• 7 years ago

Re the first point of this article I generally do not want to download the mobile app for a website I like my browser just fine. It annoys me when I get harassed to download the mobile app (Reddit)

josteink• 7 years ago

Tip: If you don’t have an actual mobile application, you can just get an intern to package your website in a webview with security disabled and ship that!

Wtf? What the fucking fuck? How on earth is this a tip?

If you don’t have an app which offers anything besides the website itself, why bother with the app at all?

This type of app is the one I hate most of all and immediately lowers my impression of any company.

What a pointless waste of everyone’s time.

oliwarner• 7 years ago

Medium instantly absorbed half the screen to demand I log in and use the app were not lost.

I hope the irony is not lost on the author.

AlchemistCamp• 7 years ago

This is well-disguised spam from a green user account who has never commented on HN.

How to Design for the Web in 2019

Related Stories