7 Ways to Convey Sarcasm in Web Content

Default avatar.
June 14, 2019

Pop quiz: which of the following statements is sarcastic?

7 Ways to Convey Sarcasm in Web Content.
  1. Edge is actually a kind of decent browser, just missing some features.
  2. Writing CSS using JavaScript is a viable and sensible way to get things done, now that we use JS for everything else. We might as well.
  3. Brutalism as a movement has, in some ways, made some of us into better designers.

It can be hard to tell, can’t it? For the record, it’s number 2. But really, you might have seen people say each one of those things somewhere on the Internet, and some of them even meant that second one. And then, some of them said it and didn’t mean it, but other people thought they meant it and got mad at them. Even in real life, I’ve occasionally said something out loud that I thought had a clearly sarcastic tone, only to have to clarify my statement afterward.

We live in a world where it can be darned difficult to tell sarcasm from trolling

As web designers (who are often tasked with also making website content), you may run into a situation where sarcasm is called for, and you have to make sure people don’t get it wrong. That’s a tough call. We live in a world where it can be darned difficult to tell sarcasm from trolling.

We live in a world where people aren’t always ready to see sarcasm, or even humor for what it is. You sometimes have to prime your audience to expect something funny, rather than something glaringly stupid or offensive. This is why comedians have hype men”, or other opening acts to warm up an audience. This is why sarcasm on Twitter often goes very, very wrong.

So how do you convey this to your users? How do you tell them that sarcasm’s coming? Well, there are a few simple ways:

1. Don’t Tell Them

This approach depends on the apparent absurdity of your statement to make the joke work. Now, I already listed a few reasons above as to why you wouldn’t want to use this approach. Well, the fact is that it can actually work, but only under very specific circumstances.

Using sarcasm with no warning works only when you know your audience very well, and they are all on the same page already. For example, if you tell a sarcastic joke about plumbing to an audience of all plumbers who share the same baseline of knowledge, you can be reasonably sure they’ll all get it. Throw a few lawyers into the audience, and this approach fails.

2. Tell Them in the Most Literal Way

One of the safest ways of communicating sarcasm that I’ve found is with formatting. Yes, formatting. I’ll literally put my sarcasm in bracket-tags like this:

[sarcasm]XML has no practical application outside of MS Office.[/sarcasm]

It has the advantage of being simple, obvious, and very difficult to dispute. On the downside, it’s not very subtle. However, on the Internet, it’s usually not worth being subtle.

3. Less Literal Formatting

Okay, so you want to convey a sarcastic or ironic statement without tags. Fine. There are a couple of tricks that started with the print industry, and still sort of work online today. The first and most popular one is quotation marks. Quotation marks are best used to indicate a sarcastic tone for short phrases, or even single words, and are the basis for the every popular air quotes” gesture people use in real life.

For full sentences or paragraphs, you can use italics. It’s especially useful if you’re actually quoting someone, like so: Oh sure,” said Bob, just go ahead tweet sarcastic things at people with no contextualization. That’ll work out well.

4. Use Memes

Some memes are an almost inherently sarcastic form of communication. When people see a known sarcastic meme coming, they know what to expect. Mind you, this only works if your audience knows the meme in question, to it’s a situational tool at best.

5. Illustration

Illustrations (such as comics, for example) are a good way to visually set the tone for things you want to say. Show someone some comic strip art, and their brain will probably be primed for some humor and sarcasm. At least in the west, sarcastic comics are incredibly common, and form the basis of a collective experience of irony. They’re generally hard to misinterpret.

6. Use Audio or Video

Sarcasm is far easier to convey when people can actually hear you use a dramatic, facetious tone of voice. It’s not a 100% guaranteed solution, but it’s a lot more likely to convey your tone correctly if you keep the sarcasm relegated to your multimedia content.

(Just don’t be like me. Most of my sarcasm comes out with a very deadpan voice and blank facial expression. It’s a bad habit and it confuses people.)

7. Sarcasm in Microcopy

Microcopy isn’t specifically a medium for sarcasm or jokes, but it’s been used that way a lot. Designers often insert humor into microcopy as a way to humanize” a user experience with any given product. Just once, though, I want to see a sales form with text that says Wooo! Money! We like money!” buried somewhere in it. As of yet, I haven’t seen anyone who has the sheer cheek to pull off something like that.

Like everything else on this list, of course, you’ll have to watch out for context. If microcopy on your site is typically used for providing plain, helpful instructions, suddenly including an ironic statement might throw people off. If your microcopy is going to be sarcastic, it has to be sarcastic from the very beginning.

Featured image via DepositPhotos.

Ezequiel Bruni

Ezequiel Bruni is a web/​UX designer, blogger, and aspiring photographer living in Mexico. When he\‘s not up to his finely-chiselled ears in wire-frames and front-end code, or ranting about the same, he indulges in beer, pizza, fantasy novels, and stand-up comedy.

Read Next

Are Simple Websites Better For Business?

As web design technologies raise the bar on what it is possible to achieve on a realistic budget, there’s a rising deba…

Apple Opts for AR over VR at WWDC

An Apple VR headset has been one of the most widely-rumored devices of the last few years, and it was finally settled a…

Exciting New Tools for Designers, June 2023

We’re halfway through 2023 already, and the number of incredible apps, tools, and resources for designers is mounting.

3 Essential Design Trends, June 2023

This month we are focusing on three trends within a bigger website design trend – different navigation menu styles and …

15 Best New Fonts, May 2023

The choices you make when selecting a typeface have more impact on your design than almost any other decision, so it’s …

10+ Best Tools & Resources for Web Designers and Agencies (2023 updated)

Having the ability to envision a tastefully designed website (i.e., the role creativity plays) is important. But being …

20 Best New Websites, May 2023

This month, there are tons of great new agency websites to get excited about. 3D animated prisms are a popular theme, a…

How to Find the Right White Label Website Builder for Your Agency

Web design agencies face a lot of obstacles in closing the deal with new clients. One of the most common ones is the ar…

Exciting New Tools For Designers, May 2023

There are hundreds of new tools for designers and developers released each month. We sift through them all to bring you…

3 Essential Design Trends, May 2023

All three of the website design trends here mimic something bigger going on in the tech space, from a desire to have mo…

10 Best AI Tools for Web Designers (2023)

It’s time to stop worrying if AI is going to take your job and instead start using AI to expand the services you can of…

10 Best Marketing Agency Websites (Examples, Inspo, and Templates!)

Marketers are skilled in developing strategies, producing visual assets, writing text with high impact, and optimizing …