Tangentially: after you've blocked a very large number of ads and sidebars, one useful enhancement is to expand whatever text elements remain, to regain use of all that now-empty whitespace. Something like so:
(I've been looking at going a step further for some sites, by annotating a "column-count:" [0] rule and making the screen look like a newspaper. (Narrow columns for readability—multiple columns for "scan-ability"). Unfortunately, there's a lot more fiddling and tuning to this than I expected: it doesn't automagically work in the way you'd hope. Modern website DOM layouts are basically Superfund sites).
[late edit]: Here's a minimal example of "column-count:" injected by uBlock (on a website where it sort-of works)—this is what I'm trying to coerce other websites into looking like:
Are you at the point where you should be pouring this content into RSS, and styling it as columns in a reader?
(I really like the column idea, and I'm working back towards RSS, with a bunch of smart filters, being my primary way of interacting with anything I visit regularly. I never should have given it up).
The only reliable way I've found (so far) to shuttle Facebook Pages into something easily to consume (RSS) is unfortunately a paid service... even paid IFTT doesn't support a page posts -> fire webhook/email/etc sadly. Unfortunate, since some local government stuff or otherwise noteworthy stuff is... only available on Facebook. Sometimes it's available on 'X'/Twitter but often not as detailed, or it links to Facebook for more details.
There really are two different version of the internet, and which one you use depends on how how well your ad blockers are configured.
I was using my mom's laptop over the holidays, and it took me a minute to realize why every site I visited looked so _different_. What I quickly realised is almost every site I visited was wallpapered in ads: banners between every paragraph, sidebars full of ads, and background images selling things. A lot of sites were unrecognizable from what I was used to.
The ads covering the whole background of some websites websites are the most outrageous thing I had the pleasure to discover recently after so much time of ad blocking. They are absolutely aggressive to your very soul.
I've long planned a cyberpunk setting where you can sneak past low-level corporate guards by plastering your clothes in ads for competing companies, because their neural interfaces are configured to only let them see their employers adverts.
Every year that plan feels less and less like silly hyperbole.
I found the ads covering all of the foreground to be more annoying, where you even cannot close them, without opening the link. Pity on those who do not know what a adblocker is and have no one to tell them.
Yeah, browsing the web without uBlock Origin is an extremely shocking experience. I end up installing uBlock Origin in every single browser I come across.
The most aggravating for me is ads that follow me throughout the page as I scroll or show up out of nowhere while I'm reading rudely pushing the text away.
What are people using on their phones these days for ad blocking? (iphone specifically). I absolutely cannot stand any mobile website ever- it's insanity.
I’ve been really happy with NextDNS for blocking trackers and ads via DNS for my iPhone. You can create a provisioning profile for iOS and also have the ability to turn the blocking on and off on demand.a
Since iOS doesn’t make it easy to run a flush DNS command, I’ve discovered turning airplane mode on and off will clear your cache.
You can use a lot of the same blocklists you can use with uBlock.
I do see less ads in apps with NextDNS. However, I do run into scenarios where certain apps don’t work. For example I know if I want to use DoorDash or Facebook, I need to turn off blocking and flush my DNS cache to run those apps. I don’t see this being a viable option for a nontechnical user.
Here’s the list of the blockers I use in NextDNS:
- NextDNS Ads & Trackers Blocklist
- AdGuard DNS filter
- OISD
- AdGuard Mobile Ads filter
- EasyList
- Steven Black
- notracking
- AdGuard Tracking Protection filter
- Goodbye Ads
- EasyPrivacy
- NSABlocklist
- Disconnect
- Fanboy's Annoyance List
- Anudeep's Blacklist for ads and trackers
I recommend 1Blocker. One feature that is rarely mentioned is they can also block some ads in apps and not just Safari, by using a VPN profile which filters trackers locally.
I have 1 blocker premium, adgard, proton vpn blocklist, NextDNS. Out of all of them Brave is best and the only one that consistently blocks YouTube ads (and allowed for background playing).
I use Wipr, not so much to block ads but to reduce the chances page content will shift around while loading (to accommodate ad sizes that designers don't bother to plan for). It works pretty well, however it only affects Safari.
"Orion" is developed by the people at Kagi, free, and blocks a lot. As soon as I'm earning a salary again, I'll be supporting them financially; super valuable.
>What are people using on their phones these days for ad blocking?
uBlock Origin of course, what else? Running on Firefox (Nightly).
>(iphone specifically)
If you want an iPhone, you shouldn't complain about ads. If you want to block ads, get an Android. If Apple wanted you to block ads, they'd build a good ad-blocker into their phone. They don't, and they forcibly prevent you from using a different browser and ad-blocker, so obviously they want you to view ads.
If you use uBlock Origin, did you try to submit these filters to the uBlock Annoyances[1] or EasyList Annoyances lists before starting up this project?
That would help far more people that starting up yet another Annoyances list.
They really like dealing with users and their malware infections I guess. It's the only possible explanation given that uBlock Origin is probably the most effective anti-malware software in existence.
I thought people used those list because it cleaned up the websites without breaking them. This is largely breaking the websites, only letting through a very opinionated subset of functionalities.
Even if it's nice for people who want just this, I don't think this has its place on the annoyances lists you mentioned.
I strongly suspect that those get caught up on "social" or "sharing" icons, often indicated by a "social" class, or "share-daddy" specifically (I block that last a heck of a lot myself).
for the longest time, i never paid attention to that column, as my brain has pretty much been trained that anything in that column is useless fluff. until one day when i actually read some of those questions and was surprised by the questions being asked. i totally get the catnip. luckily, i have an off switch and can avoid becoming addicted.
Unfortunately, I also didn't comment what these are all for. But I think one of them is the banner, which might contain calls for voting and such. Another is the "Featured on Meta" box and the sidebar on the left which I never use. And the most recent thing, which isn't included above is the obnoxious popup for the "New Search AI Experience".
And this does not even include the goddamn cookie banners, for which ublock has a separate rule set fortunately. Unfortunately, it's the rule set that leads to the most problems because some sites don't work correctly or don't load at all when the cookie banner has not been interacted with. I hate the modern internet without ublock.
These with generated ids and classes might be hard to maintain. If you like to change those to the classes/ids that are human readable and easy to maintain, and comment them, feel free to contribute them here: https://github.com/mig4ng/ublock-origin-filters/pull/4
I use something similar to this, the only differences are because my use case is privacy protection and avoiding algorithmic feeds. I use the Redirector extension for Firefox so that it redirects e.g. Youtube, Twitter, and StackOverflow links to the corresponding alternative frontends Piped, Nitter, and AnonymousOverflow. You can find maintained lists [1] [2] of such projects and their instances. Mostly they are FOSS and privacy-respecting, and they have distraction-free frontends because it's a helpful coincidence of being ethical software.
I don't know if they still do it, but at the time Twitter charged money to display user avatars in a larger size, and styled as a hexagon. I think they were NFT tie-ins or something? They were difficult to ignore, so I wrote a snippet to turn hexagons back into circles.
I had an extension (that I found here) that transformed all NFT avatars into Jared from Subway. It really takes the edge off of whatever they say. Even the most serious arguments just turn into kids' spats with that picture, it made the site more pleasant to be in.
I'm using uBlock similarly! I've accumulated hundreds of custom filters for the past eight years. My newest entries on uBlock's "My Filters" tab are for hiding spoilers on IMDb:
! 2023-09-05 Hide episode's description and image (+ watchlist for not breaking the layout) [new experimental IMDb layout]
imdb.com##article.episode-item-wrapper .ipc-slate
imdb.com##article.episode-item-wrapper .ipc-html-content
imdb.com##article.episode-item-wrapper .ipc-watchlist-ribbon
! 2023-09-05 Hide top rated episode's description both on a TV page and an episode page
imdb.com##[data-testid="episodes-top-rated-card"] ul + div
Arc has native support for cosmetic improvements. Those are called Boosts and you can interactively create your owns in just a few clicks, and also add custom CSS/JS if needed.
I use this extensively to declutter/dedistract most websites I visit: Facebook, Twitter, Reddit, Medium, Gmail, YouTube, and so on. It's a real life-changer!
I really like the vertical tabs of Arc. I have actually used Firefox vertical tabs with nested tabs in the past and I loved the worflow.
Being able to have the rabbit whole of tabs when you are going deep on some topic very self contained is awesome. When I am finish, closing the group would clean all my tabs except the ones I wanted in the first place. I miss that.
I do not use it right now because it took me some time to setup, and there was no easy way of making it declarative (as code) for sharing across devices and keeping the config for future use. I might try it again if I find a way.
In regards to Arc, I gave it a go, but I dislike some things:
- It is not open source, neither the boosts, as it appears.
- It is Chromium based. I want Firefox or others to keep having a share in the market. I don't dislike or hate google, but I do not want a company to dominate the web (might be too late?).
- Only available in macOS, iOS ?! Not sure if it is still the case.
Roughly around when the oligoculture started, and browsers stopped being "user agents", what a coincidence!
We need more browsers that focus on user features, not website features. The web is basically beyond feature-complete already, but the tools we use to interact with it are so basic. Like riding a horse on an interstate!
That feature wasn't big to my browsing style, Arc's way of nesting browser views suits me more, but Orion's Saved Window feature seemed clumsy to me and I'd filed my issue on Orion Tracker.
> Hope Arc and Orion eventually decide to go open source.
From Orion’s FAQ:
> Is Orion open-source?
> We’re working on it! We’ve begun with some of our components and intend to open more in the future.
> Forking WebKit, porting hundreds of APIs and writing a browser app from scratch has been challenging for our small team. Properly maintaining an open-source project takes time and resources we’re short on at the moment, so if you want to contribute at this time, please consider becoming active on orionfeedback.org.
This is cool. I did something similar at one point. Unfortunately these websites change their basic layout so often that it felt like these fixes would work for 1 month max then I'd have to configure again.
> "Unfortunately these websites change their basic layout so often that it felt like these fixes would work for 1 month max then I'd have to configure again."
You're exaggerating. My userContent.css is 60kB, and although breakages do happen indeed, it's occasional and nowhere near "redo everything every month".
What I will reckon is a pain, are machine-mangled CSS classes (e.g. by packers for React / other frameworks). They are kinda stable, until they're not, and at any rate, their inscrutability makes maintenance more difficult (because .user-profile-picture is human-transparent, while .cD5aZf is not :-/ ).
Judging by some of the other examples here I’m guessing this is a case of writing fragile rules that e.g. count n and m items into a tree and test unnecessarily for incidental classes. If all you do is accumulate the often senseless outputs of the element picker I’d expect the gains to be short-lived.
Indeed, 100%. I learned to never do such things, and would rather not have a rule than have a brittle one. This explains that my experience differs from OP's.
There are better ways to do it. For example, you can match elements containing specific text, such as the text that introduced the annoyance. On NewEgg you might match the text “Download our app” and use it to remove that whole box.
Yes, I feel the same. Even though I still have some brittle rules, I avoid most and prefer filtering for specific text or classes/ids and find the correct element from there. Before I did not use uBlock to filter elements that much because I used the filter.
I wonder if you have your filter rules open source or available somewhere. Please share.
I didn't make the effort to share them, sorry. That being said,
1. My rules are not any different from yours. I doubt you'll learn much from them given what you're already doing in your repo.
2. I feel that the "what to hide" / "not to hide" choice is too personal to be reusable by anyone else. I'm sure some of the stuff I hide will be considered excessive, and some will be considered missing. What I enjoy in this HN thread is that we share the { practice, tools, docs, tips }, then to each their own :)
3. I'm not interested in maintaining a public repo of that kind of stuff, and/or replying to Issues. So, would rather not make it public.
Sorry/notsorry ¯\_(ツ)_/¯ , at any rate, glad we're sharing tips around the practice.
The repository I shared is very opinionated and I will decide what goes in or not (a benevolent dictatorship). I want to make it easy for me to maintain, and others to use/fork if they want.
You could share them publicly without having the burden of replying to issues/PRs etc. But I get you.
Thanks! I do this all the time too :) . Makes for a more pleasant / less cluttered experience on sites I use a lot.
I'll add that another thing that is pretty easy to do is to add a Dark Mode to websites that don't have one. All you need is a userContent.css/uBlock rule like
@media (prefers-color-scheme: dark) {
body {
background-color: #111 !important;
color: #eee !important;
}
/* etc, more stuff here depending on site */
}
, and ta-da! Dark mode respecting your OS dark/light setting based on pref or time of day :)
Dark Reader extension does basically this (I think they either change colors or add the invert filter depending on what looks better?), but also has builtin CSS override rules for many sites. Love it.
Sure. I prefer to minimize depending on more extensions (for futureproof-ness, performance, security). These days, { uBlock Origin, Vimium } is all I need :)
That's a nice approach! I try to maintain a practical balance here, my extension list is basically: GreaseMonkey, Stylus, uBlock Origin, Consent-o-Matic, Dark Reader and maybe a couple more.
In theory, one can use uBlock0 for everything (with CSS and I think also JS injection), but userstyles and userscripts are way easier to use sometimes. And you can reimplement Dark Reader with userstyles, but you'll have to keep track of various site-specific tweaks to make it look good. (Should be possible though! Might be a cool idea for a pet project.)
But I understand the concerns with having too many extensions from too many different authors, yeah.
Thanks! I just tried Invidious and like that it works even without javascript, although videos are limited to 720 resolution. Search works and you can even load some of the YouTube comments without javascript.
I don't really use facebook these days, but thanks for sharing. I might add them if I ever step into a facebook post that I want to see and they annoy me :)
There is also https://letsblock.it/filters, a collaborative repository of uBlock content filters, to which I encourage you to contribute your own ones.
I use similar filters in my uBlock origin. I like this approach because it avoids installing more browser extensions, each of which risks security or privacy issues.
I do a lot of the same things to remove sidebars, navigation, suggestions, search, etc from various sites. There are a couple of web comics where I nuke everything but the image and the next/previous navigation links (Order of the Stick, Schlock Mercenary, etc).
Interesting. I wonder how hard would be to create a filter to programmatically eliminate certain sellers from Ebay query results, say those known for selling counterfeit hardware, those with feedback ratings below a given threshold, etc.
I am just using it to remove elements, not visual tweaks, at least for now.
Also, I try not to have many configurations/extensions extra that I have to install in a new machine. As I did not find a good way to manage these configs as code.
Using rules to completely block shorts from appearing in any YT feeds (and rules to fix the feeds so they don't look broken afterwards) has been great. YT breaks it from time to time with a UI update, but it's something I'll always use. I hate YT Shorts
I didn't create them myself, to be clear, I originally got them from here and have adjusted over time (some comments on this thread / other similar threads discuss the changes necessary due to breakage): https://www.reddit.com/r/uBlockOrigin/comments/143mdqv/code_...
I'll come back later when at home and post the rules I currently use as I've had to manually block other things (new carousels showing up in recommended, etc)
Oh yes, they are annoyingly interesting, which is fine when I am browsing for fun, but usually I go to StackExchange for a very specific problem and then suddenly, uups, where am I?
Here are the rules I’ve been using for Stack Exchange; you can see that I have been doing this for a while. Some of these may no longer even be necessary…
I have a habit of creating filters to hide away footers in all sites I browse regularly. Modern SEO practices have made footers entirely useless, so I just zap them away for a lighter look.
They claim to support Firefox and Chrome extensions (specifically, uBlock Origin). It's in beta. I'm surprised Apple hasn't blocked it yet, but I'd consider paying for a developer account just to install it on my phone (assuming it works).
Ive been using it on my laptop and phone. The phone version doesnt feel like it has enough polish yet. You can install it from the app store BTW, no need for a developer account. Ive been having problems with the app crashing, being unresponsive. However, the Mac version works 100% for me. I have ublock origin, bitwarden, bypass paywalls clean and sponsorblock installed. I havent noticed any issues and im very satisfied. I also really love the programable buttons feature, which let you define a button in the toolbar that runs some JS when you click on it (like a bookmarklet).
I've been using Proxomitron (a MITM proxy) to filter sites and have accumulated plenty of filters over the years, but unfortunately it doesn't seem there's an easy way to convert between the filtering systems; uBlock and similar in-browser extensions work on document structure (DOM), while Proxomitron is basically an application-specific-regex syntax search-and-replace.
I have used it in the past, it does not give me the same flexibility. It might have changed over the years. I have used it long ago. Thanks for sharing.
Personally, I can't stand how distracting YouTube thumbnails are. I found this list to block them from the sidebar when watching videos.
! Hide all of the recommended videos on the right side of the page, except for the first up-next video.
! If you have a tall monitor you may need to add more entries, this blocks the initial list on most resolutions.
www.youtube.com###items > .ytd-watch-next-secondary-results-renderer.style-scope:nth-of-type(2)
www.youtube.com###items > .ytd-watch-next-secondary-results-renderer.style-scope:nth-of-type(3)
www.youtube.com###items > .ytd-watch-next-secondary-results-renderer.style-scope:nth-of-type(4)
www.youtube.com###items > .ytd-watch-next-secondary-results-renderer.style-scope:nth-of-type(5)
www.youtube.com###items > .ytd-watch-next-secondary-results-renderer.style-scope:nth-of-type(6)
www.youtube.com###items > .ytd-watch-next-secondary-results-renderer.style-scope:nth-of-type(7)
www.youtube.com###items > .ytd-watch-next-secondary-results-renderer.style-scope:nth-of-type(8)
www.youtube.com###items > .ytd-watch-next-secondary-results-renderer.style-scope:nth-of-type(9)
www.youtube.com###items > .ytd-watch-next-secondary-results-renderer.style-scope:nth-of-type(10)
www.youtube.com###items > .ytd-watch-next-secondary-results-renderer.style-scope:nth-of-type(11)
www.youtube.com###items > .ytd-watch-next-secondary-results-renderer.style-scope:nth-of-type(12)
www.youtube.com###items > .ytd-watch-next-secondary-results-renderer.style-scope:nth-of-type(13)
www.youtube.com###items > .ytd-watch-next-secondary-results-renderer.style-scope:nth-of-type(14)
www.youtube.com###items > .ytd-watch-next-secondary-results-renderer.style-scope:nth-of-type(15)
www.youtube.com###items > .ytd-watch-next-secondary-results-renderer.style-scope:nth-of-type(16)
www.youtube.com###items > .ytd-watch-next-secondary-results-renderer.style-scope:nth-of-type(17)
www.youtube.com###items > .ytd-watch-next-secondary-results-renderer.style-scope:nth-of-type(18)
www.youtube.com###items > .ytd-watch-next-secondary-results-renderer.style-scope:nth-of-type(19)
www.youtube.com###items > .ytd-watch-next-secondary-results-renderer.style-scope:nth-of-type(20)
! Prevents the list of recommendations from expanding when scrolling down.
www.youtube.com##ytd-continuation-item-renderer.ytd-watch-next-secondary-results-renderer.style-scope
www.youtube.com###continuations > .ytd-watch-next-secondary-results-renderer.style-scope
www.youtube.com##.use-ellipsis.ytd-watch-next-secondary-results-renderer.style-scope
www.youtube.com##ytd-compact-playlist-renderer.ytd-watch-next-secondary-results-renderer.style-scope
Also, if you hate Shorts as much as I do, use this to hide them from appearing in search results.
This will block the 2nd item and onwards. Note, YT seems to use display:none for behaviour and will fetch up to 160 records for every page, 20items at a time.
Not OP, but here's a screenshot illustrating what I personally typically do on sites I use a lot: hide things, make things low opacity until hovered, add a dark mode if missing. https://imgur.com/a/tCFkVzK
EDIT should have installed uBlock on the left/default browser for a fair comparison. Oh well, you get the idea :)
[0] https://developer.mozilla.org/en-US/docs/Web/CSS/column-coun...
[late edit]: Here's a minimal example of "column-count:" injected by uBlock (on a website where it sort-of works)—this is what I'm trying to coerce other websites into looking like:
https://i.ibb.co/k3bRwhP/example-1.webp