Semantic HTML

Accessibility (often abbreviated a11y) is the practice of designing and building websites and apps so they can be used by everyone, including people with visual, motor, auditory, or cognitive disabilities. This involves proper semantic markup, keyboard navigation support, sufficient color contrast, and screen reader compatibility. Beyond being an ethical responsibility, accessibility is increasingly a legal requirement in many jurisdictions.

Dart is the programming language created by Google and used as the sole language for Flutter development. It features a sound type system, null safety, async/await support, and compiles both ahead-of-time (AOT) for production performance and just-in-time (JIT) for fast development cycles with hot reload. Dart's syntax feels familiar to developers coming from JavaScript, TypeScript, Java, or Kotlin, making the transition to Flutter relatively smooth.

A component library is a curated set of pre-built, reusable UI elements — buttons, inputs, modals, cards — packaged for consistent use across projects. Libraries like Material UI, Chakra UI, or Radix provide accessible, themeable building blocks so developers don't have to reinvent common patterns. A well-maintained component library drastically reduces development time and ensures visual consistency throughout an application.

CSS Modules are CSS files where all class names are locally scoped by default, meaning they're automatically transformed into unique identifiers at build time to prevent naming collisions. You import them into your JavaScript as an object and reference classes like `styles.button` instead of plain strings. This approach is natively supported by bundlers like Webpack, Vite, and Next.js, offering style isolation without the runtime overhead of CSS-in-JS.

Storybook is an open-source tool for building and testing UI components in isolation, outside of your main application. Developers define "stories" — different states and variations of a component — which are rendered in a dedicated browser-based workshop. It supports React, Vue, Angular, and other frameworks, making it invaluable for component documentation, visual regression testing, and collaboration between designers and developers.

Color contrast is the measurable difference in luminance between foreground text (or UI elements) and their background. WCAG guidelines require a minimum contrast ratio of 4.5:1 for normal text and 3:1 for large text to ensure readability for users with visual impairments. Tools like Chrome DevTools, Stark, and WebAIM's contrast checker help developers verify compliance during development.