One afternoon, a senior lecturer in Bandar Lampung tries to order a service from a company's website. He recently lost part of his eyesight to an eye disease. With type that is too small and color contrast that is too low, he presses his face to the screen, pinches to zoom, and the page only falls further apart. Frustrated, he gives up and calls a competitor instead.
He is not a rare case. In Indonesia, millions of people live with disabilities: visual, hearing, motor, and cognitive impairments. They shop, work, and handle administration online like everyone else. The question is: can they use your website?
Web accessibility—often shortened to a11y—is the practice of making websites and applications usable by everyone, including people with limitations. In many countries, it is already a legal obligation. In Indonesia, it is increasingly part of public service standards and a growing customer expectation. This article covers web accessibility practically: what WCAG is, why your business should care, and the concrete steps you can take.
What Is WCAG
WCAG (Web Content Accessibility Guidelines) is the international standard for web accessibility, developed by the W3C—the same organization that sets HTML standards. WCAG is the primary reference for anyone who wants to build websites that people with disabilities can use.
WCAG is built on four principles, often abbreviated as POUR:
- Perceivable — information and interface must be perceivable through all relevant senses. For example: images need alternative text for blind users who rely on screen readers; videos need captions for deaf users.
- Operable — users must be able to interact with the interface. For example: every function of the website must be reachable by keyboard alone, because not all users can use a mouse.
- Understandable — information and operation must be clear. For example: the page language must be identifiable, and forms must give error messages people can understand.
- Robust — content must work across devices, including assistive technologies. For example: valid, semantic HTML so screen readers can interpret it correctly.
Within these four principles there are three levels of conformance: A (most basic), AA (the common standard), and AAA (strictest). For most businesses, level AA is the realistic and right target—it satisfies most user needs without sacrificing design and development budgets.
Understanding WCAG Conformance Levels
| Level | Meaning | Example requirements |
|---|---|---|
| A | Basic—removes the biggest barriers | Alternative text on images, keyboard navigation, color not the only information cue |
| AA | Common standard—a realistic business target | 4.5:1 contrast, form labels, identifiable page language |
| AAA | Strictest—for special needs | 7:1 contrast, sign language for videos, strict animation limits |
Many organizations aim for AAA as a "quality badge," even though this level is not always achievable for every type of content—for example, providing sign language for all live video is often beyond budget. Consistently meeting AA already places your website above most competitors, and the journey to AA usually captures most of the level A benefits along the way.
Why Your Business Should Care
Accessibility Is a Real Market
According to data from Indonesia's Ministry of Social Affairs and various sources, Indonesia has more than a dozen million people with disabilities—a number equivalent to the population of a large city, and larger than the population of some countries. This figure does not even include the aging population, which keeps growing: weakening eyes, declining hearing, and fading grip strength affect almost everyone over time.
Accessibility also does not only help people with disabilities. Good color contrast helps everyone read in bright sunlight. Alternative text helps when images fail to load on slow connections. Keyboard navigation helps anyone using a laptop without a mouse. Inclusive design is better design for everyone.
A Legal Obligation That Is Becoming Real
In Indonesia, Law No. 8 of 2016 on Persons with Disabilities affirms the right of persons with disabilities to access information and communication technology. Government agencies and public service providers are increasingly pushed to meet accessibility standards, and the trend is spreading to the private sector—especially for businesses serving government institutions or working with international organizations.
In other countries, the legal trend is already much stronger. In the United States, businesses have been sued because their websites were inaccessible. In the European Union, accessibility law mandates many digital services. If your business works with international partners or clients, accessibility compliance can become a real contractual requirement.
Accessibility Builds Reputation
When your website is usable by everyone, it is a visible statement of values. Customers who have struggled to use a competitor's service will remember the website that did not make things hard for them. In the age of online reviews, bad experiences spread fast—and so do good ones.
Who Is Affected and How
To understand accessibility, first recognize who the users are and what barriers they face:
Blindness and Low Vision
These users rely on screen readers—software that reads screen content aloud—or on screen magnification. Common barriers: images without alternative text, low color contrast, text that cannot be enlarged, and page structures that cannot be navigated logically.
Deafness and Hearing Impairment
These users cannot rely on sound. Common barriers: videos without captions or transcripts, notifications delivered only by audio, and audio content with no visual alternative.
Motor Limitations
Some people have difficulty or inability to use a mouse, due to tremors, neurological conditions, or injuries. They depend on keyboards, switch devices, or voice control. Common barriers: functions that only work on mouse hover, touch targets that are too small, and chaotic keyboard focus order.
Cognitive Disabilities
Including reading difficulties, attention disorders, and conditions such as dyslexia. Common barriers: endless text without structure, complicated language, constantly moving animations, and inconsistent layouts.
Practical Principles: Starting with the Foundation
The good news: most accessibility fixes are not expensive if done from the start, and many are simply good web development practice in general. Here is the foundation every business website should meet.
Semantic HTML: A Language Assistive Technology Understands
Semantic HTML means using elements according to their meaning: <nav> for navigation, <main> for main content, <h1>–<h6> for heading hierarchy, <button> for buttons, and <a> for links.
Why does it matter? Screen readers use this structure to navigate. Users can jump from heading to heading, or go straight to the main content, just as sighted people scan a page with their eyes. Websites built with <div> everywhere—without meaning—are "walls of text" that screen reader users cannot navigate.
Alternative Text for Images
Every informative image must have an alt attribute that briefly describes its content. Blind users will hear this description through their screen reader. Decorative images should have an empty alt so they are ignored, rather than read out in confusing ways.
A short rule: write alt text as if describing the image over the phone. "Company logo" for a logo, "Brown leather bag product photo" for a product photo, and do not stuff alt text with keyword lists—that is not only unhelpful to users, it harms the experience.
Sufficient Color Contrast
WCAG level AA requires a minimum contrast ratio of 4.5:1 for normal text and 3:1 for large text. The light gray text on white background that looks "elegant" often fails this test. Free contrast checkers measure your color ratios in a few clicks.
Good contrast does not block design. It simply demands more careful color choices—and the result is real: text that is easier to read on phone screens outdoors, by anyone.
Keyboard: Every Function Must Work Without a Mouse
Try using your website with only the keyboard: Tab to move, Enter to activate, and check whether the order makes sense. Users who cannot use a mouse depend entirely on this path.
An essential requirement: a visible focus indicator. When you press Tab, you must be able to see which element is active—not a faint outline or nothing at all. Many websites remove focus indicators for being "unattractive," which removes the primary navigation tool for some users.
Forms with Clear Labels
Every form field must have an associated label, not just placeholder text that disappears when typing. Placeholders are not a replacement for labels: they fade out, often have low contrast, and screen readers do not reliably announce them.
Error messages must also be clear and tied to the problematic field, not just a shade of red that color-blind users cannot distinguish.
Accessibility in the Real World: Video, Audio, and Interaction
Captions and Transcripts
If your business produces video—company profiles, product demos, tutorials—add captions and transcripts. This serves deaf users and everyone who watches without sound, which on social media is the majority.
Animation and Motion
Beautiful animation can be a distraction for users with vestibular disorders and neurological conditions. Content flashing more than three times per second can even trigger seizures in some people.
Good practice: respect the operating system's "reduce motion" preference, and provide a way to pause carousels or moving content. We apply this detail in the projects we build too—motion should clarify, not obstruct.
Clear Links
Links should explain their destination: "Read the website cost guide" is better than "click here." Screen reader users often navigate by link lists alone; a list of ten "click here" links is entirely useless.
Accessibility and Mobile: An Unavoidable Intersection
In Indonesia, web accessibility almost always means mobile accessibility, because most users arrive from phones. The good news: many principles overlap. Good mobile-first design—large touch targets, readable text, clear content hierarchy—is half the accessibility work.
We cover building for phones thoroughly in our responsive design and mobile-first guide. The key point: do not treat accessibility as extra work at the end of a project. Treat it as part of the basic design, alongside good mobile presentation.
Testing Your Website's Accessibility
The good news: you do not need to be an expert to start testing. There are layers anyone can do:
1. Automated Testing with Free Tools
Tools like Lighthouse (built into Chrome), axe, and WAVE scan pages and find common problems: images without alt text, low contrast, unlabeled buttons, and broken heading structure. Run them on your important pages. This is not proof of passing, but it catches most easily found problems.
2. Manual Keyboard Testing
Use your website with only the keyboard. Can you reach every function? Is the focus indicator visible? Does the Tab order make sense? This is a test anyone can do in minutes, and it often reveals problems automated tools miss.
3. Testing with a Screen Reader
Take a short navigation tour with a screen reader (VoiceOver on iPhone, TalkBack on Android, or NVDA on Windows). Listen to how your page structure is read aloud. This experience is eye-opening: a page that looks "tidy" visually can be chaos for a screen reader.
4. Involve Real Users
Nothing replaces testing with actual people with disabilities. If the budget allows, involve users with a range of conditions to test your business-critical flows. Their findings almost always reveal problems invisible to tools and developers.
The Cost of Implementing Accessibility
One of the biggest myths: "accessibility is expensive." The truth depends on when you start.
| Scenario | Estimated cost | Notes |
|---|---|---|
| Built with accessibility standards from the start | Minimal—part of the work | 10–20% extra development time, often less |
| Accessibility audit of an existing website | IDR 5–20 million | Depends on size and complexity |
| Full overhaul of an older website | IDR 10–75 million | Depends on how deep the problems run |
| Involving disabled users in testing | IDR 3–15 million per session | High value, yields real findings |
Compare that with the cost of doing nothing: customers lost because they cannot use your website, reputation risk, and potential legal exposure in the future as legal awareness grows. As our website security guide always stresses: prevention costs almost always far less than repair.
Accessibility and Technology: The Role of Frameworks and Developers
Accessibility cannot be patched in from the content side alone. It is embedded in code: HTML structure, JavaScript behavior for interactive components like dropdowns and modals, focus management, and how data is presented.
This is why technology choice and developer quality matter so much. Modern frameworks with accessible components make many things right by default. Carelessly written code—for example, buttons built from <div> elements—breaks accessibility even on websites with the best content.
When choosing a development provider, ask: "Does your team apply accessibility practices? How do you test them?" This is the same question we recommend asking in our guide to choosing website development services, this time focused on accessibility.
Accessibility for Applications and Internal Systems
Accessibility does not stop at public websites. Internal company applications—HR systems, field apps, customer portals—matter just as much. Employees with disabilities have the right to work tools they can use, and this is part of an inclusive workplace.
At many large companies, accessibility compliance for internal systems is already part of procurement and HR policy. Companies that build systems to accessibility standards from the start do not need to overhaul them later—and this is one of the key considerations when deciding between building custom software and choosing an off-the-shelf package.
Common Mistakes to Avoid
- "Accessibility overlays" as instant solutions. Many vendors sell widgets that claim to "make your website accessible with one line of code." Be careful: these overlays often fail to meet standards, can conflict with screen readers, and in some countries have even become lawsuit targets. There is no substitute for a proper foundation.
- Assuming accessibility is only about blindness. Deafness, motor limitations, and cognitive disabilities matter equally.
- Testing only once. Technology changes, content grows, and new problems appear. Accessibility needs periodic review, like security and SEO.
- Postponing it to "later." Patching a finished website always costs more and produces worse results than building correctly from the start.
- Removing keyboard focus indicators. This is a common and very harmful practice.
- Using automated tools as "proof" of compliance. Automated tools only catch a fraction of accessibility problems. Many barriers—context, logical order, real user experience—can only be judged by humans.
- Forgetting accessibility when buying software. When choosing a cashier system, accounting software, or e-commerce platform, ask about their accessibility standards. Systems that are inaccessible from the start will infect the websites and applications built on top of them.
Your First Steps Today
You do not need to overhaul everything at once. Start with small steps that are immediately felt:
- Run automated testing tools on your homepage and the most important business pages. Note the findings.
- Do a keyboard test of all critical flows: finding a product, contacting you, making a purchase.
- Fix color contrast and text size on your most visited pages.
- Complete alternative text for important images.
- Add labels to all form fields, and make sure error messages are clear.
- Schedule periodic reviews—accessibility is a maintained standard, not a one-time project.
Accessibility Is Quality, Not Charity
Back to the senior lecturer at the start. Imagine a different scenario: the company's website has good contrast, scalable text, and a structure screen readers can navigate. He completes his booking himself, without anyone's help, and feels respected as a customer. That website just won a loyal customer—not through a discount, but through a design decision made years earlier.
Accessibility is not charity and not an "annoying obligation." It is product quality. A website everyone can use reaches a wider market, builds a better reputation, reduces legal risk, and ultimately—like all good design—makes life easier for everyone, including people who never realized they needed it.
If you want to make sure your business website or application meets accessibility standards, the Kartech. team in Bandar Lampung can help audit the current state and implement the fixes. Start from our contact page or see our services on the services page.
Also read: responsive design and mobile-first guide and technical SEO guide for businesses.
