Writing modular CSS (Part 1) — BEM
An introduction to writing modular, maintainable CSS using the BEM methodology, focusing on architecture and best practices.
An introduction to writing modular, maintainable CSS using the BEM methodology, focusing on architecture and best practices.
A tutorial explaining how to create a 'wiggle' animation effect for product sliders, using a wine bottle slider as an example.
Explains how to apply progressive enhancement principles to CSS, covering fallbacks and feature queries for robust web design.
An explanation of CSS Grid Layout's core terminology, including grid containers, items, lines, columns, rows, and tracks.
A guide to optimizing CSS image sprites for better web performance, covering file separation, PNG8, UTF-8 icons, and memory management.
A developer details the 2017 technical relaunch of their personal website, switching from WordPress to Jekyll for a static, fast, and accessible site.
A technical guide to implementing 'Show More' and 'Read More' text truncation patterns on the web using JavaScript and CSS.
Explores three new CSS features for 2017: Feature Queries, Grid Layout, and Flexible Lengths, with practical code examples.
A personal list of the author's favorite and most impactful web development and design conference talks from 2016.
A curated list of newsletters for front-end developers to stay updated on CSS, design systems, UI/UX, and web tools.
A UI challenge to recreate the old iTunes library gallery using CSS transforms, focus states, and keyboard navigation.
A tutorial on building a custom responsive grid system for web design, covering design considerations, breakpoints, and CSS vs. HTML grid approaches.
A deep dive into designing web layout grids, covering column sizing, responsiveness, and choosing between equal or unequal widths.
A personal recap of the 2016 Porto Tech Hub conference, highlighting its community atmosphere and the collaborative Porto tech scene.
Explains the modern system font stack for web development, detailing font-family lists used by major sites like WordPress and GitHub.
A technique for autoprefixing CSS properties using CSS variables, demonstrated with clip-path.
Explores performance-friendly techniques for creating flexible, animatable shadows in responsive web design, comparing CSS box-shadow and filter approaches.
A developer re-evaluates inline CSS and internal stylesheets, testing performance benefits and challenging common front-end best practices.
A detailed guide to CSS background properties, covering color, image, repeat, size, and more for web developers.
Explores creative uses of the CSS :target pseudo-class to create interactive elements like modals and navigation drawers without JavaScript.