[go: up one dir, main page]

Kontrastor 82M – Dynamic Cascading Style Enhancer

Style Mixer Tube Style Mixer Tube Style Mixer Tube
Skip to main content
Matthias OttWeb Design Engineer
  • Home
  • Notes
  • Articles
  • Newsletter
  • Workshops
  • Links
  • About

Links

  • #a11y (10)
  • #accessibility (5)
  • #agile (1)
  • #algorithms (1)
  • #animation (3)
  • #apps (2)
  • #architecture (1)
  • #articles (1)
  • #automation (1)
  • #basics (2)
  • #books (3)
  • #branding (1)
  • #browsers (1)
  • #build pipeline (1)
  • #business (2)
  • #carbon management (1)
  • #chrome (1)
  • #climate (2)
  • #climate action (1)
  • #climate change (2)
  • #code (6)
  • #color (2)
  • #component libraries (1)
  • #components (3)
  • #compression (1)
  • #craft (1)
  • #css (14)
  • #css grid (1)
  • #culture (3)
  • #dark mode (1)
  • #dashboards (1)
  • #data (2)
  • #data visualization (1)
  • #dataviz (1)
  • #dependencies (1)
  • #design (29)
  • #design thinking (2)
  • #design-systems (6)
  • #development (7)
  • #devices (1)
  • #economy (1)
  • #education (1)
  • #energy transformation (1)
  • #engine (1)
  • #enhancement (1)
  • #flexbox (2)
  • #font (1)
  • #fonts (2)
  • #footer (1)
  • #foundations (1)
  • #freelancing (1)
  • #gallery (1)
  • #game (1)
  • #git (1)
  • #github (1)
  • #graphics (1)
  • #grid (2)
  • #grunt (1)
  • #handbooks (1)
  • #head (1)
  • #history (2)
  • #hosting (1)
  • #html (4)
  • #hypertext (1)
  • #ia (1)
  • #icons (1)
  • #image (4)
  • #image optimization (1)
  • #inclusive design (2)
  • #indieweb (2)
  • #information (2)
  • #inspiration (1)
  • #iterative (1)
  • #javascript (4)
  • #js (1)
  • #language (1)
  • #layout (6)
  • #leadership (2)
  • #learning (3)
  • #machine learning (1)
  • #media (1)
  • #media- (1)
  • #meta (1)
  • #modular (1)
  • #navigation (1)
  • #newsletters (1)
  • #optimization (1)
  • #organizations (1)
  • #pattern libraries (6)
  • #performance (6)
  • #perspective (1)
  • #physics (1)
  • #picture (1)
  • #platform (1)
  • #polyfills (1)
  • #postels-law (1)
  • #principles (4)
  • #process (6)
  • #progressive (2)
  • #progressive-enhancement (1)
  • #prototyping (4)
  • #public speaking (1)
  • #pwa (1)
  • #reference (2)
  • #renewables (1)
  • #resource (3)
  • #responsibility (1)
  • #responsive (4)
  • #robots (1)
  • #rss (1)
  • #rwd (4)
  • #sass (1)
  • #science (1)
  • #semantics (1)
  • #sketching (1)
  • #social (1)
  • #society (1)
  • #space (1)
  • #static generators (1)
  • #style (1)
  • #style guides (1)
  • #styleguides (9)
  • #svg (3)
  • #systems (1)
  • #tags (1)
  • #takebackyourweb (2)
  • #talks (2)
  • #teaching (1)
  • #technology (2)
  • #terms (1)
  • #testing (1)
  • #theory (1)
  • #tools (7)
  • #training (1)
  • #type design (1)
  • #typefaces (1)
  • #typography (7)
  • #ui (8)
  • #ui engineering (1)
  • #user experience (1)
  • #ux (7)
  • #variable fonts (1)
  • #web (13)
  • #Web (1)
  • #web design (1)
  • #webfonts (3)
  • #webmention (1)
  • #webp (1)
  • #websites (2)
  • #wireframes (1)
  • #workshops (1)
  • #World Wide Web (1)
  • #writing (1)

Entries tagged with #rwd.

↳ Show all entries

🔗 Building Web Layouts For Dual-Screen And Foldable Devices

https://www.smashingmagazine.com/2022/03/building-web-layouts-dual-screen-foldable-devices/

Stephanie Stimac: “Dual-screen devices have been on the market for nearly three years. In that time new web platform technologies have been built with developer feedback to enable layout on the web that adapts to these devices. These web platform capabilities integrate with existing concepts, such as the viewport and media queries, so that developers and designers can spend more time ideating about how to leverage two displays to create enhanced experiences rather than learning a new set of code to build them.”

  • #css
  • #css grid
  • #browsers
  • #devices
  • #responsive
  • #rwd

🔗 Get the Balance Right: Responsive Display Text, by @clagnut ◆ 24 ways

https://24ways.org/2016/responsive-display-text/

Richard Rutter (Clearleft) shows how to use vmin and a hybrid method of sizing text using CSS calc() to achieve balanced font-sizes for different viewports.

  • #typography
  • #responsive
  • #design
  • #rwd
  • #css
  • #code

🔗 Just turned 6: Responsive Web Design, by @beep

http://alistapart.com/article/responsive-web-design

“Now more than ever, we’re designing work meant to be viewed along a gradient of different experiences. Responsive web design offers us a way forward, finally allowing us to “design for the ebb and flow of things.”

  • #responsive
  • #design
  • #rwd
  • #web
  • #layout

🔗 Responsive Images: Use Cases and Documented Code Snippets to Get You Started

https://dev.opera.com/articles/responsive-images/

Nicely sums up of different ways to use responsive images.

  • #html
  • #media
  • #media-
  • #image
  • #picture
  • #rwd

Get in touch!

mail@matthiasott.com +491776546175

Click here!

  • Home
  • Notes
  • Articles
  • Newsletter
  • Workshops
  • Links
  • About
  • /now
  • /uses

Socialize!

  • RSS Feed
  • Mastodon
  • Bluesky
  • Threads
  • Instagram
  • LinkedIn
  • Xing
  • GitHub
  • CodePen
  • YouTube
Matthias Ott 

Legal Information

  • Webmention endpoint
  • Privacy Policy
  • Site Notice / Impressum

Design and code © 2007–2026 Matthias Ott • Made with HTML, CSS, enhanced with JavaScript, powered by Craft CMS • Set in NaN Tresor and NaN Tragedy •