axios.com's Unfortunate Web Design Changes

created Jan 9, 2018

For a feed reader, I've been using the web-based theoldreader.com. A year ago, a new media website popped onto the scene, called axios.com, started by two Politico graduates. Axios has been one of my favorite media sites for national political news. It also produces some tech and health news too.

I've enjoyed axios.com's mobile-friendly web design, although I'm still not a fan of the infinite scroll on the homepages and on article pages. axios.com does not function completely with JavaScript disabled. It does not offer the ability right-click an article link on the homepage to open the article on its own page, separate from other articles.

I overlooked their annoying, web design awkwardness because I liked their content, the topics covered, and the design or layout of the article body text.

Axios creates mostly short to medium-sized articles, under 1000 words, using bullet points and bolding, producing informative and easily digestible information. Their site simply works well from a content and content layout perspective. Or it used to work well.

No more RSS?

Axios offered an RSS feed that I accessed in The Old Reader. This is how I consumed axios.com information over the past several months. I did not visit their site directly because they produce a lot of content, and they display most of the article content on the homepage, requires a lot of scrolling to get past the articles that don't interest me.

In The Old Reader, I can change the view to show only the titles. This makes it easy to be selective on what articles to expand within The Old Reader in order to read the entire article or to click the link to axios.com. Axios included all of the content for their articles in their RSS feed, but I liked clicking the link within The Old Reader to read the article at Axios's website.

Axios produces a lot of articles each day. Yesterday, Jan 8, 2018, I noticed that I did not see any articles in The Old Reader. The last article that appeared in the feed reader was dated Jan 6, 2018.

Their RSS feed URL no longer exists. It returns a 404 error.

Maybe axios.com has a new feed URL. A view-source of their homepage turns up nothing when searching for "feed", "rss", and "xml", except for browserconfig.xml, which is used, I think, when creating a Progressive Web App.

I don't know if Axios was designed as a PWA in 2017, or if this is new and part of the other problem, defined below.

Losing the open web

The most dramatic change made in recent days at axios.com is that now with JavaScript disabled, Axios displays nothing, except for faint grey text that says, "TOP STORIES". That's it.

And worse, with JavaScript ENABLED, Axios still displays nothing when viewed in Safari on my iPhone.

Yes, I'm using an "older" iPhone with a slightly "older" version of iOS, but it's not like I'm using a version of iOS from 2010. I'm not trying to install a native app that requires the most recent version of iOS.

It's a website. A browsing-only or reading-only website.

To me, axios.com is not a dynamic, interactive, user experience web app, like turbotax.com.

The ruination of the open web continues in full force. Axios must be using a wonderfully brand new JavaScript feature that the world cannot live without when reading a website.

It's amazing that readers need to run relatively new operating systems and web browsers to read websites. And since most media websites are massively bloated, the hardware needs to run modern CPUs and be loaded with a lot of RAM. That's to read websites, not play video games. Today's bloated websites will bog down older CPUs.

I cannot subscribe to this throw-away society where people replace their smartphones every one to two years when the phones still work wonderfully. It's amazing that phones and web browsers get made obsolete by web developers.

More web developers need to tape Dieter Rams's design principles on their walls.

Good design is environmentally-friendly

Design makes an important contribution to the preservation of the environment. It conserves resources and minimises physical and visual pollution throughout the lifecycle of the product.

Blogging pioneer and RSS creator Dave Winer changed his website last year to use some new JavaScript feature that prevents his site from working on my iPhone with JavaScript ENABLED. WTF is wrong with people?

It's a web page.

For browsing-only users (readers), the web pages should be kept simple. Today, I can use the most recent version of the Google Chrome web browser to read a simple HTML page created in the early 1990s. And I can create a simple HTML page in 2018 and still read it in the NCSA Mosaic web browser that was last modified around 1997.

That's open web sturdiness.

If the web page cannot be cURLed with ALL of the content downloaded, then that site does not support the open web.

https://indieweb.org/curlable

A curlable URL is one where you can use the curl command line tool to request the URL via http(s), and receive back HTML with visible contents.

tantek.com - js;dr = JavaScript required; Didn’t Read

... if it’s not curlable, it’s not on the web.

The shocking new aspect, regarding JavaScript being required, is that even with JavaScript enabled, some sites don't work in Safari because the web browser is a bit too old.

More from Dieter Rams:

Good design is long-lasting

It avoids being fashionable and therefore never appears antiquated. Unlike fashionable design, it lasts many years – even in today’s throwaway society.

JavaScript misuse

Some of the overuse and abuse of JavaScript for browsing-only websites is fashionable. Developers want to use the cool, new frameworks and features of JavaScript, CSS, and HTML. Fine. Do it elsewhere, like in web apps that require users to login and work from their dashboards or admin consoles with their actions and content kept private.

The problem is not the use of client-side JavaScript. It's the misuse or unnecessary use of JavaScript for browsing-only websites.

Here are a few comments from longtime blogger John Gruber who also gets frustrated by the misuse of JavaScript.

#

The SEO folks are the same dopes who came up with the genius strategy of requiring 5-10 megabytes of privacy-intrusive CPU-intensive JavaScript on every page load that slows down websites.

#

JavaScript has brought the web to the brink of ruin ...

#

This might sound hyperbolic, but I mean it: I think we’d be better off if JavaScript had never been added to web browsers.

Axios web bloat

These speed test numbers are not nearly as bad as some media websites, but the bloat is still unnecessary. Actually, for for-profit media orgs, the bloat is probably required.

Dropping the old Axios RSS URL into webpagetest.org, produced the following speed test results for the Axios 404 error page:

From: Dulles, VA - Chrome - Cable
1/9/2018, 12:27:28 PM
First View - Fully Loaded:
Time: 4.570 seconds
Requests: 35
Bytes downloaded: 853 KB

A breakdown of the bytes downloaded showed:

That 404 page displayed the following content:

404! In other words, something went wrong.

Read top stories

It takes over 500 KB of JavaScript to display that little content. And of course with JavaScript disabled in an up-to-date browser, the Axios 404 page is blank.

Axios seems to be using a new single page application architecture that does not use progressive enhancement. I don't remember if the 2017 version of Axios was an SPA, but regardless, last year, the site still worked somewhat with JavaScript disabled. I could not expand an article when viewing the articles on their homepage, but when viewing an article already expanded, like when clicking a link to an Axios article on another website, the entire article displayed without JavaScript.

I'm not going to search through Axios's website to see if they made a post about their website changes and RSS feed changes. Axios is a good idea but poorly executed for open web advocates like myself.

text.npr.org

The web is big. Axios does not need me, and I don't need Axios. NPR still produces RSS feeds. I use this feed, which is described as:

NPR news, audio, and podcasts. Coverage of breaking stories, national and world news, politics, business, science, technology, and extended coverage of major national and world events.

And NPR maintains a lighter weight version of its main website.

The article pages are displayed lightweight too. Here are two versions of the same article from today.

Main website : As North Korea Tensions Rise, U.S. Army Trains Soldiers To Fight In Tunnels

Thin website : As North Korea Tensions Rise, U.S. Army Trains Soldiers To Fight In Tunnels

webpagetest.org results for the main website version of the article:

From: Dulles, VA - Chrome - Cable
1/9/2018, 1:09:15 PM
First View - Fully Loaded:
Time: 7.246 seconds
Requests: 156 - that's a lot for a non-profit site.
Bytes downloaded: 2,402 KB

It's a medium-sized text article that contained one useless, stock photo. The main NPR website should not require readers to download 2.4 megabytes of crapware to read that simple article.

682 KB or 33% of the download went to JavaScript. About 860 KB went for image(s). 437 KB of the download was for CSS. Jeesh. That article page is too bloated.

webpagetest.org results for the thin version of the article:

From: Dulles, VA - Chrome - Cable
1/9/2018, 1:14:34 PM
First View - Fully Loaded:
Time: 0.481 seconds
Requests: 2
Bytes downloaded: 4 KB

The breakdown:

That's brilliant, modern web design in 2018. It's the content that's important.

sawv.org - Design by Writing

CNN offers a text version of its news site. It contains some JavaScript, mainly for analytics, but compared to their main website, which is horribly bloated, this is magnitudes better.

And their lite version functions fine without JavaScript. The main cnn.com homepage does not display article content without JavaScript, but individual article pages will display content without JavaScript.

http://lite.cnn.io/en

Congrats to NPR and CNN for creating their text sites, and boo to Axios for forgetting the definition of the web.

Jan 21, 2018

axios.com created a new feed URL.

https://api.axios.com/feed/top

But it's broken.

http://scripting.com/2018/01/22.html

To Axios' web devs: The <link> elements in the main Axios RSS feed are not pointing to the corresponding article.

https://github.com/scripting/Scripting-News/issues/61

DW's website functions similar axios.com. DW's homepage displays nothing with JavaScript disabled. DW's website displays nothing on my older iPhone even with JavaScript working.

I visit DW's homepage by typing a URL, such as http://scripting.com/2018/01. That works without JavaScript. All of axios.com's new web design fails to function without JavaScript.

The new axios.com feed URL works in theoldreader.com. And since Axios publishes the entire article text in their feed, the broken link issue is not a problem.

In the past, I liked reading the Axios story by clicking the link from The Old Reader, but now, I'll read their articles from within The Old Reader.

The problem, however, with the link problem within their feed is that it's impossible to save a story link or open the link to read the article at axios.com, since every story in the feed points to https://api.axios.com/feeds, which produces a 404 not found error.