Skip to main content
Photography of Alvaro Montoro being a doofus
Alvaro Montoro

HTML Surfer

Person vacuuming Bitcoin and BAT logos from a phone

Monetize your website without impacting your visitors

webdev html monetization

You have a website, and you are gaining some momentum and visitors. So you may get the thought, "Can I make some money out of this traffic?" And the answer is "Yes." But how?

Captain Obvious's statement: Nobody likes to see ads on a website. They worsen the user experience, slow things down, pose security problems, and often don't match the site's general style. Not to mention that sometimes, they may be totally inappropriate.

So let's not go the ad route and ignore the ad servers. Instead, let's see three different options to make money out of your website in a seamless and non-invasive way to the user.

1. Web Monetization

At this moment, there is no reason not to be using web monetization. It will take you 5 minutes to set it up and have it running on any website. Actually, the most basic setting requires only one line of code:

<meta name="monetization" content="$ilp.uphold.com/2f28xFUMdj9Z" />

Place that meta tag in the <head> –remember to change the content value– and you are ready to go. That's it!

How does it work? The content of the monetization meta-tag is a payment pointer to a digital wallet where the visitors will make the payments (you will need to set up a wallet with a service like Uphold or GateHub; I'd recommend Uphold).

When users visit your site with a browser that supports web monetization (or with the Coil extension on Chrome or Firefox), they will be able to make micropayments to your digital wallet.

You can incentivize users by providing additional content or features if they activate the micropayments. This has a paywall-ish sound, but you could use it to enhance the experience instead of blocking it.

This is the system that DEV.to uses. Actually, if you frequently write on DEV, you should definitely set it up. It won't make you enough to retire, but it could be good for some pocket money.

Pros of web monetization:

  • It is easy and quick to set up.
  • Available everywhere to everyone.
  • No in-page content or ads to slow things down.
  • No minimum threshold to get paid (micropayments).

And some cons:

  • It requires some coding to provide a real advantage to the user.
  • The user may need a specific browser or a plugin.
  • Quality content should generate more monetization, but not always.

2. Content Monetization

Brave is an interesting browser with a different idea of privacy in mind. It has an integrated ad-blocker and will only display ads if you opt-in for that feature (getting paid in BAT cryptocurrency.)

But it is more than that: Brave users can tip authors and websites (also in BAT). To join this program you don't need to code anything: sign up as a Brave creator, set up your channels (personal website, Youtube, Github, Reddit, etc.), optionally personalize a banner, and that's it.

How does it work? Brave users will visit your site, get notified that you accept tips by an icon on the address bar or the page and, if they click on it, they will be able to send you some BAT from your banner.

Screenshots of banners and popups with tipping information on Brave for Alvaro Montoro

Monetize more than your website
 

The good thing about this is that you can monetize all your content, not just your website. For example, your Github repo or your Youtube/Twitch channel. Your content is the one that will do the talking.

Some pros:

  • Easy to set up: no development required.
  • Multiple sources of income, not just your own websites.
  • No in-page content or ads to slow things down (from you).
  • Available in most countries.

Some cons:

  • Visitors must use the Brave browser.
  • There's a minimum threshold to get paid (15BAT).
  • Quality content should generate more monetization, but not always.

3. Become an Affiliate/Partner

This route will be the closest to the classic ad-provider option but "removing" the ad-provider from the equation.

The idea is that some retailers (like Amazon or Apple) offer programs to promote their products. You can sign up and then create ads for the things that you want, then get paid for the purchases driven by your ads.

Screenshot of Amazon HTML+CSS book, with the affiliate bar on top

It is easy to create links from the Amazon Affiliate bar

How does it work? It changes a little from retailer to retailer, but the main process is similar: find a product, generate a link, copy the link (in the example above, https://amzn.to/3dMcOHS), create a <a> on your site pointing there, place it on your site. People click, buy, and you get money.

How you display the ad is all on you. You can use one of their predefined images or create your own banner, which makes it great for adapting them to your website.

Note: you should identify the ad as an ad for your users, but make sure that the image name and class don't contain the words "ad" or "publicity" or similar, or the ad-blockers will block them.

Some pros:

  • You have full control over what products are advertised.
  • Fully customize the look-and-feel of the ads.
  • Works around ad-blockers (taking some steps).

Some cons:

  • Ads are ads, even if they blend better with the content.
  • Affiliate programs tend to have a minimum threshold to get paid.
  • Not available in all countries.
  • Clicks don't drive money: users must also buy.

These methods are convenient to make some pocket money, but none of them will make you rich. The amount that you make may vary, and in the end, it will depend considerably on the content quality more than anything.

Article originally published on