Tagged articles
10 articles
Page 1 of 1
KooFE Frontend Team
KooFE Frontend Team
Jan 4, 2024 · Frontend Development

Avoid Common Button Design Mistakes: Practical Tips for Accessible UI

Drawing on nearly two decades of design experience, this article identifies frequent button design errors that hinder usability and accessibility, examines real-world examples across primary, secondary, and tertiary button styles, and offers concrete, WCAG‑compliant guidelines to create clear, inclusive, and visually hierarchical buttons.

UI accessibilityUX best practicesWCAG
0 likes · 11 min read
Avoid Common Button Design Mistakes: Practical Tips for Accessible UI
FunTester
FunTester
Mar 2, 2023 · User Experience Design

How to Conduct Effective Web Accessibility Testing: A Practical Guide

This article explains what web accessibility is, outlines relevant laws and WCAG guidelines, reviews both manual and automated testing methods, debunks common myths, lists useful tools, and provides a detailed checklist to help developers create inclusive, compliant web experiences for all users.

UX designWCAGaccessibility testing
0 likes · 15 min read
How to Conduct Effective Web Accessibility Testing: A Practical Guide
Coolpad Technology Team
Coolpad Technology Team
Nov 11, 2022 · Frontend Development

Quantitative Color Extraction and Optimization for UI Design

This article presents a scientific color adaptation solution that uses a quantization algorithm to extract dominant image colors, refines them via HSB adjustments, validates against WCAG contrast standards, and demonstrates practical deployment in app store and game center interfaces.

Android PaletteHSBUI design
0 likes · 8 min read
Quantitative Color Extraction and Optimization for UI Design
TikTok Frontend Technology Team
TikTok Frontend Technology Team
Jun 14, 2022 · Frontend Development

Implementing Accessibility (A11y) in Semi Design: Guidelines and Best Practices

This article explains why accessibility is essential for UI component libraries, describes the main types of disabilities, and provides concrete Semi Design guidelines—including color contrast, keyboard navigation, semantic markup, media handling, and layout recommendations—to create inclusive front‑end experiences.

DesignKeyboardUI components
0 likes · 15 min read
Implementing Accessibility (A11y) in Semi Design: Guidelines and Best Practices
Shopee Tech Team
Shopee Tech Team
Nov 4, 2021 · Frontend Development

Web User Experience Design Improvement Practices (Part 2): Interaction Design and Accessibility

The article offers a hands‑on guide, drawn from the Shopee WMS rebuild, that improves web user‑experience by optimizing interaction design—applying “Don’t Make Me Think,” appropriate cursor cues, expanded click zones, selective text‑selection, semantic navigation links, and system‑font stacks—and by enforcing accessibility standards such as WCAG contrast ratios, focus‑visible styling, and WAI‑ARIA roles and attributes.

CSSInteraction DesignWAI-ARIA
0 likes · 28 min read
Web User Experience Design Improvement Practices (Part 2): Interaction Design and Accessibility
Alibaba Terminal Technology
Alibaba Terminal Technology
Mar 17, 2020 · Frontend Development

Building Warm, Accessible Interactive Web Projects: A Practical Guide

This article explores what makes an interactive web project feel warm, why accessibility is essential for inclusive experiences, and provides concrete strategies—including WCAG principles, WAI‑ARIA usage, semantic HTML, CSS best practices, JavaScript techniques, and testing tools—to design and develop interactive projects that are both engaging and accessible to all users.

ARIADesign ThinkingWCAG
0 likes · 33 min read
Building Warm, Accessible Interactive Web Projects: A Practical Guide
360 Tech Engineering
360 Tech Engineering
May 9, 2019 · Frontend Development

Web Accessibility: Semantic HTML and Best Practices

This article explains why web accessibility matters for all users, demonstrates how semantic HTML, proper use of labels, alt attributes, keyboard navigation, and WCAG 2.0 guidelines improve accessibility, and provides practical code examples and recommendations for creating inclusive front‑end web pages.

Front-endWCAGWeb Development
0 likes · 11 min read
Web Accessibility: Semantic HTML and Best Practices
Qunar Tech Salon
Qunar Tech Salon
Oct 11, 2018 · Frontend Development

Ensuring Text Readability with Proper Color Contrast: WCAG Standards, Tools, and Implementation

This article explains why sufficient color contrast between text and background is essential for web readability, outlines WCAG AA/AAA contrast ratios, introduces practical tools and JavaScript/Sass functions for calculating and adjusting contrast, and provides tips for handling semi‑transparent colors and real‑world scenarios.

WCAGaccessibilitycolor contrast
0 likes · 14 min read
Ensuring Text Readability with Proper Color Contrast: WCAG Standards, Tools, and Implementation
21CTO
21CTO
Jun 18, 2017 · Frontend Development

Build an Inclusive Website: Practical Accessibility Guidelines for Developers

This guide explains website accessibility, describes how people with visual, auditory, motor, and cognitive disabilities interact with the web, and provides actionable steps—semantic markup, color contrast, keyboard navigation, ARIA attributes, form and table best practices, and testing tools—to build inclusive, accessible sites.

ARIAWCAGWeb Development
0 likes · 15 min read
Build an Inclusive Website: Practical Accessibility Guidelines for Developers
Architecture Digest
Architecture Digest
Jun 18, 2017 · Frontend Development

Web Accessibility Guide for Frontend Development

This article explains website accessibility, describes how people with visual, auditory, motor, and cognitive disabilities access sites, and provides practical guidelines—including semantic structure, color contrast, ARIA roles, form and table markup, keyboard navigation, media handling, and testing tools—to help frontend developers build accessible web pages.

ARIAWCAGWeb
0 likes · 13 min read
Web Accessibility Guide for Frontend Development