Navigating the High Seas of CSS Anchor Positioning

Lawrence Chabela CSS & HTML, Design, Development Technologies, HTML5 Leave a Comment

Navigating the seas of web development, the CSS Anchor Positioning API has emerged as a foundational tool, enabling developers to anchor elements precisely relative to others. This blog post explores key concepts such as anchor elements and anchor-positioned elements, demonstrating how to set up relationships between elements, utilize the anchor() function for positioning, and leverage the new anchor-center value for effortless centering. Advanced techniques like multiple anchors, the inset-area property, the anchor-size() function, and visibility options are also covered.

View Transition API

Introducing the View Transition API: Your DOM’s New Best Friend!

Lawrence Chabela CSS & HTML, Design, Development Technologies, JavaScript 2 Comments

Tired of clunky transitions and tangled web states? Meet the View Transition API, your secret weapon for silky-smooth DOM transformations. Say hello to elegant animations and goodbye to the confusion of overlapping states. Your web pages are about to get a serious upgrade!

Think about it, page transitions aren’t all about the looks. They’re like guides, leading users through your content. And they’re not just about appearances, these transitions can also increase the perceived speed of how responsive your site feels, especially during async running tasks…

:Has Selector

Exploring the New :has Pseudo Selector and Its Uses

Lawrence Chabela CSS & HTML, Design, Development Technologies Leave a Comment

Through the years, we were told a parent selector would be an engineering feat that could not be achieved due to the way browsers render a page and apply computed styles to elements as a stream, one element after the other. When the browser paints a parent and inevitably its children, reevaluating this already-painted DOM to evaluate parents for children containing a particular context would be too expensive of a task.

As the years moved on, we all applied different hacks or strategies, either reworking our DOM to avoid the issue altogether or using various JavaScript techniques to select parents and add CSS classes to use instead. We were just waiting for something to save us…

Designing Digital Product Without User Data

Designing Digital Products Without User Research

Rus Anderson Consulting, Design, UI/UX Leave a Comment

Often, we are approached by startups and established companies with an idea for a new product. Just as often, there is little to no user base from which to conduct research. In this blog, we’ll look at how to understand the product, its potential users, and how to create the application with minimal user data and investment.