loading...

Famous websites with JavaScript disabled

ziizium profile image Habdul Hazeez Originally published at ziizium.github.io ・5 min read

Introduction

The three musketeers of Web development are indeed HTML, CSS, and JavaScript. The way you combine these three amigos can have a significant effect on your web page layout.

Not just the way you combine them, but also the way you actually write them. This means if you are using a feature in CSS or HTML that's not supported in all browsers; What will happen to users that use a browser that does not support the feature you've implemented?

Another scenario is when JavaScript is a core part of your application and you change or modify some page elements with it; What will happen to users who have JavaScript turned off in their browser? Or browse the Web with JavaScript turned off using a browser extension like NoScript?

I decided to find out. Rather than choosing some random sites to test, I handpicked some top websites on the Web today and opened their Home page with JavaScript turned off in my browser using the NoScript browser extension.

Based on the result, I categorize them into three categories namely; The Good, The Bad, and The Ugly.

Let's begin with the good.


The Good

In my research, for a website to be categorized as good that means the home page or at least the website is still usable with JavaScript disabled.

Google

I am pretty sure you are not surprised with this selection. When you have JavaScript turned off in your browser Google redirects you to a mobile version of the page optimized for browsers with no capability to render JavaScript. You will also get the same view when you visit Google's homepage with Opera Mini.

Google.com homepage with JavaScript disabled
Google's home page with JavaScript disabled

Wikepedia

The online encyclopedia, seriously I was not expecting it to fail and it did not disappoint me. The home page is identical with or without JavaScript enabled in the users' browser.

Wikipedia's home page with JavaScript disabled

Netlify

Have you ever heard of that name Netlify? Something tells me you have. There is only one significant difference in their homepage when JavaScript is disabled in the user's browser. Compare the images below and see if you can spot the difference.

Netlify homepage with JavaScript enabled
Netlify's homepage with JavaScript enabled

Netlify homepage with JavaScript disabled
Netlify's homepage with JavaScript disabled

Facebook

The homepage looks solid with JavaScript disabled and almost no noticeable changes compared to when JavaScript is enabled.

Facebook homepage with JavaScript disabled
Facebook home page with JavaScript disabled

Bing

Microsoft search engine is quite awesome with JavaScript disabled. Compared to Google it does not redirect to a no javascript version of the site. The least I can say about this is: resilient.

Bing home page with JavaScript disabled
Bing Home page with JavaScript disabled

Bing search result with JavaScript disabled
Bing search result with JavaScript disabled

Smashing Magazine

In all reality I did not expect their site to fail without JavaScript and it did not.

Smashing Magazine homepage without JavaScript
Smashing magazine without JavaScript

Smashing Magazine with JavaScript enabled
Smashing magazine with JavaScript

Can you spot the difference? Don't worry its quite minimal.

The Bad

For this page if any part of the web page fails to load it's considered bad.

Yahoo!

When you land on Yahoo!'s homepage with JavaScript disabled, you can only use part of the page, the rest of the page is skeleton of what's supposed to load but it did not due to unavailability of JavaScript.

Part of Yahoo!'s homepage with JavaScript disabled
Yahoo! Homepage

Part of Yahoo!'s homepage with JavaScript disabled showing skeleton structure of some page elements
Yahoo! Homepage with skeleton

Twitter

Say what? No am not kidding you. Twitter stops in your track if you have a browser with JavaScript disabled. They give you just an option to redirect to their legacy website which is mobile twitter on a desktop.

Twitter's Homepage with JavaScript disabled

BBC

One of the most popular news website seemingly fails to load some images on the homepage if the user has JavaScript disabled in their browser.

BBC Homepage with JavaScript disabled
BBC's Homepage with JavaScript disabled

Reddit

Reddit's behavior when JavaScript is disabled is similar to Yahoo! Some page content load, other don't.

Reddit's Homepage with JavaScript disabled

If you want to access Reddit with JavaScript disabled you can use https://old.reddit.com

The Ugly

For this research, if it's ugly that means most of the homepage content is unusable or totally unavailable without JavaScript.

YouTube

No JavaScript in your browser No videos for you on the desktop version of YouTube. You only get skeleton of page content that failed to load.

Youtube's Homepage with JavaScript disabled
YouTube Homepage

ThePracticalDEV

If JavaScript is disabled on DEV, you lose access to the most important information on the page i.e. the blog post.

ThePracticalDEV Homepage with JavaScript disabled


The purpose of this research is to show that Resilient Web Design wins as shown by Google, Bing, Netlify, and Wikipedia.

Posted on May 27 by:

ziizium profile

Habdul Hazeez

@ziizium

I teach and write code with interests in Web Development, Computer Security, and Artificial Intelligence.

Discussion

markdown guide
 

I saw somewhere that Twitter can load with JavaScript disabled "only for some User Agents".

Indeed, making your website require JavaScript does kill many high performance web scraping.

 

Thank you for the link @Pacharapol, I'll definitely read the article.

Indeed, making your website require JavaScript does kill many high performance web scraping.

Do you have any resource that I can check for this? Or is it in the linked article?

 

No, I cite it myself.

Disable JavaScript means you cannot use merely GET web scraping (e.g. Python requests), and read the HTML output (e.g. Python BeautifulSoup). You will need to resort to more heavyweight method like Selenium or Puppetteer (Chrome engine).

Excellent. Thanks for the info.

 

Interesting but what's the purpose of disabling JavaScript on websites?

 

... purpose of disabling JavaScript on websites?

It's a personal preference. Some Web users (like me) actually browser with JavaScript disabled in their browser. We tend to load scripts only on site we trust.

Turning off JavaScript on sites like YouTube, ThePracticalDEV and the likes was just for research purposes and to see what they'll be like with JavaScript disabled.

 

To protect yourself against XSS exploit. You enable JavaScript only on websites you trust. Like a firewall.

 

Definitely a good security practice to use noscript in my eyes. Once you get used to it there's no need to go back to js on by default.

It's satisfying to see so many adverts, Google analytics and other crud getting blocked by noscript. I get a good sense of the website by how many third party scripts it runs and what they are called.

One major pain point is cloudfront type hosting. In particular the AWS console will load entirely necessary content from literally dozens of different cloudfront domains that all need to be trusted individually... Every AWS service can use a bunch of different domains :( you can always just disable noscript for a tab though when you hit annoying niche cases like that though :)

Noscript is great, highly recommend it!

 

Hahaha I love how you threw DEV in there right at the end

 
 

Interesting. I just built a site and I think I will need to revisit this because it does rely on JavaScript for a few key components.

 
 

When JavaScript is enabled the search results for DuckDuckGo are displayed with infinite scrolling, if there is no JavaScript, you get paginated results with Next and Previous buttons.

For the Home Page, the difference is really noticeable.

DuckDuckGo with JavaScript

DuckDuckGo with JavaScript enabled

DuckDuckGo without JavaScript

DuckDuckGo with JavaScript disabled

 

P.S. If you prefer the second but do have JS enabled, use start.duckduckgo.com/ instead. :)

I just noticed that the layout of start.duckduckgo.com is similar to the layout when JavaScript is disabled.

Thank you.

 

I already commented the similar problems before: dev.to/bravemaster619/comment/mok2

Stackoverflow can be loaded without any Javascript.

 

Stackoverflow can be loaded without any Javascript.

There is notice at the top of the page that reads: Stack Overflow works best with JavaScript enabled.

Stackoverflow Homepage with JavaScript disabled.

 
 

The beautiful and useful css.gg ❤️