Matyas.
ServicesProjectsExperienceBlogContact
CSGet in touch
Back to Dictionary
web-devux

Media Queries

Media queries are a CSS feature that allows you to apply styles conditionally based on device characteristics like viewport width, height, orientation, color scheme preference, or reduced motion settings. They are the backbone of responsive web design, enabling different layouts for mobile, tablet, and desktop screens. Modern media queries also support user preference detection with prefers-color-scheme and prefers-reduced-motion for more accessible experiences.

#web-dev#ux

Related Terms

Accessibility

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.

Figma

Figma is a browser-based collaborative design tool used for creating UI designs, prototypes, and design systems. Its real-time multiplayer editing, component system, auto layout, and dev mode have made it the industry standard for product design. Developers use Figma to inspect designs, extract CSS values, export assets, and — through plugins and APIs — automate the design-to-code workflow.

JSX

JSX (JavaScript XML) is a syntax extension for JavaScript used primarily in React that lets you write HTML-like markup directly within your JavaScript code. It gets transpiled by tools like Babel or SWC into regular `React.createElement()` calls before reaching the browser. JSX supports embedding dynamic expressions with curly braces, conditional rendering, and mapping over arrays, making it a powerful and intuitive way to describe UI structures declaratively.

Breadcrumb Navigation

Breadcrumb navigation is a secondary navigation pattern that shows the user's current location within a site hierarchy as a trail of links (e.g., Home > Products > Shoes). It helps users understand where they are and quickly navigate back to parent pages without relying on the browser's back button. Proper implementation uses an ordered list within a `<nav>` element with `aria-label="Breadcrumb"` for accessibility.

Flutter

Flutter is Google's open-source UI toolkit for building natively compiled applications for mobile, web, and desktop from a single Dart codebase. Unlike React Native which maps to platform-native UI components, Flutter renders everything with its own high-performance Skia/Impeller rendering engine, giving developers pixel-perfect control over every element on screen. This approach ensures identical visual output across platforms but means Flutter widgets don't automatically adopt platform-specific design conventions.

Tailwind CSS

Tailwind CSS is a utility-first CSS framework that provides low-level utility classes like `flex`, `pt-4`, `text-center`, and `bg-blue-500` to build designs directly in your markup. Instead of writing custom CSS, you compose pre-built classes to create any design, which results in smaller final CSS bundles thanks to automatic purging of unused styles. Its configuration file allows full customization of the design system including colors, spacing, breakpoints, and typography.

All Words
Matyas.

Web apps, mobile apps, AI automation. I help businesses save time and money with tech that actually works.

Links

  • Services
  • Projects
  • Experience
  • Blog
  • Dictionary
  • Contact

Coming Soon

  • Case StudiesSoon
  • Resources

© 2026 Matyas Prochazka. All rights reserved.