our educational system really did us dirty cause its depressing af the way we write about ourselves in the history sections of LGU websites

— Villain mmxxiv (@Dylbriones) August 13, 2024

Hella embarrassing, we internalize this crap and give way to so much easily exploitable self-hate pic.twitter.com/9Ori78q1Mg

— Villain mmxxiv (@Dylbriones) August 13, 2024

In it is a screenshot with highlighted text, “more advanced and civilized community was established” referring to the era of Spanish occupation. He also points out the use of “pagan”:

Gosh who even uses "pagan" to refer to precolonial religious practices in this day and age, I thought they phased that out na

— Villain mmxxiv (@Dylbriones) August 13, 2024

They are small words. Probably lifted from wikis and western-centric perspectives. Pasted on poorly maintained sites, because who cares what goes into those divs, they just need some filler. To be read, referenced, and repeated by impressionable minds… and the cycle restarts. I want to blog this so that I remember.

I discovered via Francis Rubio that the Quezon City government announced website accessibility compliance, where he points out a caveat: they’re using an overlay for the text-to-speech function. So I’ll mention why accessibility overlays are a red flag as a public service announcement, via this single-serving site, Should I Use An Accessibility Overlay? by Michael Spellacy.

“People who are disabled want to be treated equally, so they expect you to design and build your website with inclusion and accessibility in mind and not to throw a band-aid on it. The only way to do that is to commit, provision for, and make accessibility a part of your process throughout the lifetime of your website.”

Another important resource on the matter—co-signed by many accessibility experts, is Overlay Factsheet.

“Given that conformance is defined as meeting all requirements of the standard, these products’ documented inability to repair all possible issues means that they cannot bring a website into compliance. Products marketed with such claims should be viewed with significant skepticism.”

Anyway, that QC Gov article has a few lingering issues:

1. The page automatically loaded in dark mode for me, which is fine, except that the text in the logo isn’t readable.
2. No alt text in the tweet announcement, and in the article on the website it’s blank (which could be fine in certain cases but I’m gonna argue that this one shouldn’t be—more on that below).
3. No text in the social share links below the article. No label for the text-to-speech icon either.

Before I go any further, I will give kudos on this effort—they set an actual goal and (mostly) achieved it. It’s all we can hope for as citizens. (deep sigh netizens? deep sigh) It’s notable because Philippine government sites are so notorious for being horrible that it’s such a meme now, let alone accessible.

But for the record, as a Web professional, I know from our friends at the Philippine Web Accessibility Group (PWAG) that accessibility initiatives have been chugging along all these years (coming up on decades), and standards compliance actually exist for government websites. (Side note: I checked out Francis’ site and he built the Philippine Consulate General of Calgary in Eleventy! See, progress!)

So if the QC Gov is really in the mindset of inclusion, and they’re talking about it in the open, then that sounds promising. You could even say it’s time to raise the bar then, right? Like not resorting to accessibility overlays? ;)

alt notes (rants)

Back to the list: the third item definitely fails accessibility compliance, while the other two are more subjective. There are probably more cases like this if you do a full accessibility audit. Example: in the People’s Corner in the homepage section, the text is white on a photo background. If that image fails to load, you won’t be able to read that text (in light mode). The View Count on the article is not labeled at all, so you’ll hear a number read out without context. Technically compliant for screen readers, but not good practice.

And that’s the problem with hand-waving human-centered concerns with automation. Yes, the images on the site have alt values, so they pass the test, but they’re not very useful to screenreader users, the real people. “Header logo” or “Quezon City Website banner image” are not descriptions, more like file names.

alt text is supposed to answer the question, “what does the image look like for someone who cannot see?”

As for blank alt values, those are acceptable if they’re decorative and don’t need to be heard by the screenreader user.

“Whether to treat an image as decorative or informative is a judgment that only the author can make, based on the reason for including the image on the page. Images may be decorative when they are:

• Visual styling such as borders, spacers, and corners;
• Supplementary to link text to improve its appearance or increase the clickable area;
• Illustrative of adjacent text but not contributing information (“eye-candy”);
• Identified and described by surrounding text.”

— World Wide Web Consortium (W3C) Web Accessibility Initiative (WAI)

But if you ask me, an article banner should not be excluded from that as it’s typically contextual to the content. In this case, it’s a banner marking the article as a press release. In the Philippines especially, we stuff images with tons of text and post on social media this way, assuming everyone can read everything from them. I even see disability advocates who don’t use alt text in their posts.

It’s worse on the homepage where a typical image slideshow is front and center. A combined GIF of an emergency hotline and an award (why?) have the alt “Quezon City Website banner image” which is, once again, not helpful at all.

I can totally imagine how this falls through the cracks in the workflow. Because alt is considered a developer thing, it’s not going to be exposed to people assigned to publish content on the website. Or maybe they are aware but there just isn’t time to sit down and write like that. Some people will even suggest using AI to get it out of the way.

But it’s a prime opportunity to be articulate and enthusiastic about how you’re communicating to constituents. Reframe it as a visible caption to everyone perhaps? Or: Filipinos are an expressive bunch in their songs, dances, and dramas; one could argue this is just another way you can express yourself. ;)

But A11Y is harddd

Believe me, I feel you. I won’t deny that my own site is imperfect. But the least we can do is change our mindset and approach it from helpfulness rather than detached, soulless compliance. I’ve mentioned it a million times, but let’s start with that one iconic (overshared?) image from Microsoft Inclusive Design: the persona spectrum points out that disabilities can be situational, temporary, or permanent. (It’s in the guidebook, but you’ll see them in the articles below.)

“A persona spectrum is not a fake person. It’s an articulation of a specific human motivation and the ways it’s shared across multiple groups. It shows how that motivation can change depending on context. Sometimes, a trait can be permanent, like someone who has been blind since birth. A person recovering from eye surgery might temporarily have limited or no vision. Another person might face this barrier in certain environments, like when dealing with screen glare out in the sun. How would your product adapt to this range of people and circumstances with similar needs?”

— Margaret Price

“Designing for inclusivity not only opens up our products and experiences to more people with a wider range of abilities. It also reflects how people really are. All humans are growing, changing, and adapting to the world around them every day. We want our designs to reflect that diversity. Every decision we make can raise or lower barriers to participation in society. It’s our collective responsibility to lower these barriers though inclusive products, services, environments and experiences.”

— Julio Madeira

We start by realizing disability can happen to all of us, then acknowledge disability is not an unchangeable, pitiable state. We can contribute to change the conditions and make the environment more accessible, even in your tweets.

“We don’t have any non-JavaScript users” No, all your users are non-JS while they’re downloading your JS
— Jake Archibald

I just updated Stellify to support JavaScript Naked Day, a whole 18 years after the inaugural CSS Naked Day in 2006. The only way you should be able to tell is from a message in the footer, and fingers crossed, nothing seems to be broken. As it should be!

JS Naked Day promotes the rule of least power. That is: start with HTML for semantic markup and CSS for styling. Use the web platform (especially forms!) for interactivity. And then, progressively upgrade with JavaScript for advanced interactivity. In plain terms: your website should work without JavaScript enabled.

On my end: there was one unruly plugin (WP Rocket Lazy Loading) I had to disable specifically (and should probably stop using in favor of native loading="lazy"), but unfortunately there’s also one script left from Cloudflare for email obfuscation that I would have to toggle manually if I wanted it gone. So of the 6 JS files I counted, only 1 is left.

But this is more than developery talk. Again, the Web values universal access. Over-reliance on certain things like JS can be exclusionary to certain users — whether they’re using lower powered devices or extremely slow internet — and that’s what must be kept in mind. While the tech world is obsessed with chasing the shiniest high-end setups, they push aside the typical user, and even more so, the marginalized ones.

“Why do I think that this is the best title? Here’s why. I’m designing for the web. The infinitely flexible web. The web that doesn’t have one screen size, one browser, one operating system, or one device. The web that can be used by anyone, anywhere, on any internet connection, on any device, on any operating system, on any browser, with any screen size. I’m designing with the web.”

— Elly Loel

“What we don’t talk about with the frontend discipline being absorbed into a generalist role is how this also is devaluing the people centered aspects of what we are building. It says disabled people are not worth building for, where accessibility isn’t seen as important. It says poor people are not important, with limited internet speeds, paid plans and budget phones.”

— Nick Colley

I’ve even wanted to do a talk about the Web’s values since the before times. Maybe I don’t have to, or maybe someday. But for now I’m just gonna leave this here.

Maybe it’s fine when grids of cards have other distinguishing features such as an image, or allow for other views such as tables or lists. It’s not really an excuse for being unclear communicators of important reference information though.

But this goes beyond the interface. Especially in app-centric contexts, what gets chosen as page titles — which are shown in browser window or tab titles — has become an afterthought. Accompanying the example above, the tab titles only show the general project name even when browsing the specific card.

Maybe its creators assumed that since it’s an “app”, it’s more of a concern for non-apps. Still a flimsy excuse.

People are trying to find the right box, but they all say the same thing.

Aren’t these elements supposed to be labels so that users know what they’re interacting with? Doesn’t that mean they failed to achieve their purpose and might as well disappear?

“The idea is that just clipping off text programmatically is a sledgehammer, and avoids the kind of real thinking and planning that makes for good experiences.”
— Chris Coyier

So many proudly claim attention to detail in their design and code tackling ~really difficult problems~, and yet the way they treat real-world content somehow gets a pass.

Karen McGrane gave her iconic quote as early as 2011. Why has it become all but a meme like nothing can be done about it?

“At the end of the day, the climate *crisis* is much, much more than just climate change. Even outside of any changes in weather patterns, the fact that millions of Filipinos consistently lose their livelihoods, are displaced by typhoons, etc. every year is a crisis in itself.

Even without global warming, these problems still need to be solved. And the solution is still largely the same: hold the imperialist Global North & the local ruling elite accountable for their historic role in developing the underdeveloped, vulnerable status of our country, and ultimately break away from the imperialist world system.

In understanding climate change, science is illuminating another arena of struggle. We now know more about what colonial capitalism has stolen & what we must (re)claim — enclosed atmospheric space, climate debt, etc.

No need to wait for science to categorically state that these Odettes & Ulysseses are products of climate change. The climate *crisis* is here regardless, and our work continues to dismantle and replace the imperialist world order that turns typhoons into disasters.”

— Jon Bonifacio

You might have heard that provinces in Visayas and Mindanao have been battered by Typhoon Odette (international name Rai). A link has been stickied to the corner of my site since last year, a dozen typhoons ago, and I don’t think I’ll take it down anymore because there’s always a new one — a mirror of the quote. There will always be calls for help in the Philippines, from [there is no such thing as natural] disasters to pandemics. We get donation fatigue. We are done with thought-terminating clichés of “resilience”. (How much of bayanihan became culture because we’ve always been left to fend for ourselves?) Communities keep having to endure, recover, and rebuild. All of that is a crisis that should not be downplayed once the storms stop raging.

I started doing this roundup a year ago without much of an explanation, so here goes: When I did social media promotions during FFC season (organizing everything else was hard, but the planning & scheduling of posts for every single day was particularly draining), I made it a point to find Filipino designy & techie work to feature. And link blogging like Swiss Miss, Kottke, & Daring Fireball is something I’ve been wanting to do because it’s such a freeing format—for the author to not need to be ~thought leadership 24/7~, and for the reader to do more web surfing (do people even say that anymore?).

So this is a mix of that: I’m doing the link roundup thing, but specifically scoped to Filipino features. Which is hard sometimes, considering this country is way too dependent on link-hostile environments like Facebook and Instagram.

To see the previous ones, visit the tag! Think of it as my self-hosted Substack, if you’re into that thing.

“Bagsakan” (“drop”) comes from the bonafide bop by Parokya ni Edgar, Francis Magalona, and Gloc-9. An extremely versatile term and especially relevant in this edition.

Added @twitter handles so you can go follow these awesome people.

Lezgo!

• The Punishing of the Philippines by Chia Amisola (@hotemogf) is not only rare, powerful tech writing, but also a creative, interactive experience.
• Make Space for Maintenance by Bianca Aguilar (@biancamikaila) is also a gem, shining a light on unprestigious, abused areas we don’t think of when we say “tech industry”.
• If you need receipts, Hacktibista (@hacktibista) has them.
• Institute for Critical Commuting is “an ongoing research on Manila’s public transportation system as a site of violence and trauma.”
• It’s hard to keep up with so many new Filipino fonts (typefaces, I know, but I like alliteration) these days so here’s just one, with a cyber slant: “Kawingan by John David Maza is a bitmap serif typeface that takes inspiration from obscure Filipino tech terms. In computer terminology, kawingan is the Filipino word for “hyperlink.” With the digital nature of pixels and the classic flavor of serifs, it seeks to devise a link between modern technology and the Filipino heritage.”
• I’m starting to look like a stan of theirs by how much I mention them, but I’m really fascinated by the concept behind this new P-Pop group, Alamat, and all the cultural references they imbue. They’re even self-writing songs that combine several Philippine languages (just a fraction of our 180+ languages not dialects, but impressive nonetheless).
• #FightDisinfo is a newsletter from the Consortium on Democracy and Disinformation, updated every Friday by Jonathan de Santos (@desamting).
• I mentioned Brutalist Pilipinas before, and there’s actually a Modernist architecture feed too.
• Oro Design Conference went online and completely free this year, so you can watch their talks there.
• Workspaces by inbytes.dev (@inbytesdev) features Filipino developers’ work setups at home. They also have a Meet the Developer series and list events of interest.
• “Magbigay ayon sa kakayahan, kumuha batay sa pangangailangan”: a community pantry started by Ana Patricia Non on Maginhawa St., QC has inspired everyone into donating and starting their own (a real-life bagsakan), and even got a beautiful sign upgrade (brownie points if you can identify the Pinoy typefaces used). It’s rapidly reached more than a hundred locations across the country (mapped here), been co-opted by politicians, evolved to go around on a bike & to support pets, and then the original was forced to suspend amidst red-tagging. All in less than a week.
• Parting art: cleaners!

i’m back from the dead to make bunot the floor #artph pic.twitter.com/rhi6KeJB6B
— °plop° #DefendUP #OUSTDUTERTENOW (@brown003nib) February 6, 2021

Something I’ve noticed recently is independent creators offering variable pricing depending on your country’s purchasing power. When I posted, I had a few questions in the back of my mind: how do they calculate the discounts? is there some library used to automate the feature? are they all drawing from the same thing? After several hours of research (read: tweet- and link-hopping), I have a bunch of awesome resources that might be useful for you, plus ways to implement PPP itself. Neat.

I’ve scattered screenshots throughout this article, because maybe you’re like me and want to see how they differ. If you’ll notice, some appear as sticky banners, in pricing tables, and in cart pages. Emoji vs. small icon vs. larger flag. Automatic vs. opt-in computation. Message copywriting and discount code text.

So many interesting choices to inspect and experience.

Who’s doing Purchasing Power Parity?

With my replies citing examples and who inspired them, followed by some more digging with the keywords “purchasing parity” on Twitter, it looks very developer- and JS-centric (probably because they have the chops to execute it).

• [Several courses] by Wes Bos
• Dracula Theme Pro by Zeno Rocha
• Epic React by Kent C. Dodds
• Node CLI by Ahmad Awais
• Opinionated React by Sara Vieira
• PHP Package Development by Marcel Pociot
• Piccalil.li by Andy Bell
• Serverless Visually Explained by Matthieu Napoli
• Vanilla JS Guides by Chris Ferdinandi
• Wizard Zines by Julia Evans

Some links via Awesome PPP by Dewa Widyakumara, where you can contribute! If you’re looking for more mainstream examples, Bill My Pocket by Ru Singh compiles subscriptions with regional pricing, and even notes whether it’s a fair computation.

Who wrote about it?

Chris Ferdinandi, Wes Bos, Andy Bell, Julia Evans, and Zeno Rocha have posted what they did with their offerings, demystifying a lot of behind the scenes stuff. I’m not gonna parrot everything here, but what struck me was:

They were hands-on and subjective.

Both their deep experience with customers and their implementation show a very involved approach. Their calculation methodology was based on specific, personal reasoning that differed from one another. I emphasize this because it’s a complex question venturing into economics, philosophy, and even morality, but also business profitability.

“I don’t make my list public because I am not an economist and I don’t want to be in the middle of some sort of economics fight choosing what is fair.”

– Wes Bos

They mention charts one can reference, but in many cases chose a setup they had to be 100% comfortable with. That may mean following one of those tables to the digit, or it may mean devising a custom scale.

PPP actually increased revenue.

These are independent creators offering massive discounts (from their perspective—the point of parity is that it’s not equitable from other perspectives), relying mostly on the honesty system. But they experienced higher sales precisely because more people can now afford it.

Make a thing more accessible, and the customer base will grow.

Some background here: https://t.co/nG5VDrO3Kd

And on a selfish note, it resulted in a nearly instant 50% increase in revenue by allowing people who couldn’t afford my stuff previously to be able to do so. So many international customers now.

— Chris Ferdinandi (@ChrisFerdinandi) January 4, 2021

Cosmetic vs. True Market Localization

You may have heard about the Big Mac Index, a popular explanation for purchasing power. Here’s a simpler calculator by Jack McDade. A more recent example would be differences in Netflix & Spotify subscriptions per country.

PPP is apparently framed as “true” localization. Whereas “cosmetic” localization does currency conversion from the same amount, “localization 2.0” adjusts according to market forces in a region.

“Customers won’t pay for your product in their currency – or any other – if the price is wrong. […] Your priority should be optimizing your price based on region even if you can’t support a country’s currency yet. Once the price is optimized for that geography, you’re in a position to make an impact in the market while you take steps to support the local currency.”

– SaaS Localized Pricing: What You Should Know Before Selling to New Regions by Harrison Rose

A cute little side note about automating localization

If there’s one piece of feedback I have to give about these notices, it’s that some countries expect an article before their name, such as the Philippines ;) This is not a big deal in the grand scheme of things, but if you’re looking to localize, probably get to know specifics like this too. (Technically disputed, but trust me when I say it looks wrong without it.)

SaaS and API to try

One of the examples led me to the discovery of Parity Bar by Danny Postma, an automated service that’s free for the first 10,000 pageviews. Interestingly, it expects you to turn off your ad blocker for it to work.

Also due to digging around, I’ve found out from one of the creators that major online payments player Gumroad has PPP in their roadmap; meanwhile, this discount code generator by Peter Jausovec might get the job done.

For those who prefer to roll around in more code, there’s this API by Robin Wieruch. Meanwhile, this WP plugin extension by Chris Ferdinandi intentionally adjusts pricing separate from discount codes, so customers can still participate in special occasion sales.

The opposite of an automated service would be manually responding to requests for reduced pricing. This friction can be intentional, to ensure only those who really need it will put in the effort to ask. The disadvantage, of course, is managing the increasing volume as the business scales.

Beyond pricing disparity

Addressing pricing isn’t new: there’s scholarships, pay-what-you-want, bulk discounts, and incentivizing sectors more specific than non-profit or education.

The point is that while globalization and technology (or a pandemic?) supposedly set out to bring the world closer, they also highlight the gap in privilege and purchasing power—and even widen that.

Pricing, as Christian Nwamba points out, is also not the only difficulty certain people and countries have to deal with. The idea of attending a conference or flying to another country may be simple for some, but not everyone has it easy applying for visas, booking flights & accommodations, or being a stranger in a community or city—and all the logistical, financial, & mental burdens that come with that. This inspired him to start a conf of their own, Concatenate. (A familiar story if I ever saw one.)

I made a tweet about my challenges with travels last year. This is the sad truth about a lot of Africans. Even when you finally get a visa, international conferences are too expensive for us https://t.co/XZ3xcJGqbg

— Christian Nwamba (@codebeast) August 19, 2019

And it can even be something as trivial and oft-overlooked as payment options. As someone who’s dealt with payments for events, and is all too familiar with the state of e-commerce in the Philippines, I know how inaccessible a product/service can become if you only offer online payments. We always have to offer bank deposit and similar options you can’t automate.

Even with online events, the barriers to entry may look different, but are still very much present: internet speeds, device capabilities, time zones, and distractions & responsibilities at home.

We need a continuous, sustained conversation around areas of inequality that can be improved, need to be improved. Some are more difficult than others, but for the Web, its DNA is to be as accessible and inclusive as possible. Parity is another way to manifest that.

I don’t do the hypebeast-y things you’re “supposed” to do as a tech nerd, like watch Apple keynotes or install new software versions the millisecond they drop. So when I had the bright idea to finally update my phone to iOS 14, but then got an Error Code 14, I was stuck with a bricked iPhone for 24 hours.

Was it liberating not having a phone at the time? I would’ve luxuriated in it more, were I not stressed about other things—critical work stuff; typhoons about to hit the country for the nth time this month; power and internet outage. No big deal /s. I had to decide quickly what my next move was.

I was also set on getting the Anker Powerline, specifically during the 11.11 sale, but this fustercluck forced my hand to find something immediately instead of enjoying the free shipping and sweet discount.

So when I decided to play it safe and purchase the Apple-branded one—notorious for being the flimsiest and most overpriced accessory out there—and I STILL got the same Error Code 14?

It’s what us Filipinos call a budol.

OK but what does Error Code 14 mean

When you get the error dialog, the “More info” goes to this list of things to check, specifically under the heading “USB connections”.

Which led me to fixating on the reliability of my cables. The Apple one was on its last legs: the rubber casing crumbled to expose the wires, and the plastic case cracked. I had another, supposedly MFI, that gets the “Not Charging” and “This accessory may not be supported” rejections with increasing frequency.

But they’ve been chugging along for the most part, even with data transfer, like when I use an iDevice as a webcam with Reincubate Camo.

Back to troubleshooting

I considered booking a service center appointment, the nearest being 4 kilometers and 24 hours away. Or pick up a feature phone and live like that for a while.

Then I decided to carpe diem and choose the other option, Restore, which would wipe my phone and needed to be rebuilt from a backup.

After lots of waiting and verification, it eventually worked. I got it back to a good state like nothing bad happened.

So it got me wondering.

Did I really need a different, new Apple cable?

If my existing cables were in significantly better condition, I would’ve immediately thought no.

If the brand new cable still gave an Error Code 14, then it wasn’t the quality of the cable.

Back on the support page, there were additional possibilities mentioned like software versions, third-party security, and other hardware. Too many factors to test one by one, so now I’ll never know.

But I’ll go ahead and justify my purchase as long overdue. An ecosystem tax I’ve put off as long as I could.

And this whole post is probably just a lengthy, typed out, public reminder to myself that if you run into an error with a company that for some reason still requires going through iTunes to do an update, maybe it’s not so bad.

Try the other option; just make sure you got a good backup.