Hover styles are easily added to interactive elements with CSS. When not careful, they can mess with the layout and user experience. Here are three examples where small details will improve your web design.
This is the very last post of the web development basics tutorial covering code refactoring and little design improvements. In the end, I am going to share a list of great resources and must-reads about HTML and CSS.
Everything is about user experience (UX). Whether your users like the websites and web apps you build or not, depends on the experience they have while using it. In this article we will cover some UX fundamentals.
In times when it feels that everything is built using powerful CSS layout algorithms like flexbox or grid, I’d like to have a look at some other layout modes still required to build great designs.
Why do people think HTML is easy? What does “easy” even mean in this context? In this article, Lara shares her thoughts on the role that HTML plays in web development.
Custom properties are a great addition to CSS. In this article I give you a short introduction how they can be used to build a dark theme for our small tutorial website.
HTML offers a bunch of great features to include images on your website that perfectly fit your responsive design and to improve their performance. Let’s explore them together in this article.
Forms are everywhere on the web. Unfortunately, very often they turn out to be an accessibility and UX nightmare. Here are some examples of forms I found, what problems there are, and how to (easily!) fix them.
CSS grid is a powerful layout algorithm that enables us to build great designs. In this part of the tutorial series we use it to create a responsive layout for a small contact form.
In this article, I share my experiences and thought process while coming up with ways of upgrading my doorbell and intercom system. There’s also a short how-to to follow along.
Websites are responsive by default. They adapt perfectly to every screen size—without any help from CSS. The goal of this article is to learn the basics about modern CSS features you need to build advanced responsive layouts.
What is the CSS box model and how to transform a hand-drawn wireframe into a webpage layout? These are only two questions I am going to answer in this article.
This is a guide on how to create reusable Contentful components that define the page and content structure of a static Next.js website by keeping the design and business logic in the hands of the developer.
This is a guide about how to set up a small static blog website using Next.js (with TypeScript) as a static site generator, Contentful as a headless content management system, and Netlify for hosting.
Stepping out of my comfort zone brought me new opportunities. One of them is teaching. In this article I share some insights and experiences I made on the way.
Learn about that time I tried to internationalize our own Website using React-based static site generation and ended up tearing out our whole build setup.
Understanding different CSS selectors and possible combinations is a foundation of writing good CSS code. Basic knowledge about the specificity of CSS selectors will help you to create maintainable CSS code right from the beginning.
This is part four of my web development tutorial series and this one is an introduction to CSS and how to integrate some basic styles to our tiny website.
In times when “simple” website builder tools get more and more popular, it’s hard to sell classic marketing websites. Here’s a story about why I still like building handcrafted websites and what my clients get out of it.
Like my previous post, this one is again about HTML. Together we will build a setup for a small website containing a homepage, an about me page, and a contact page.
When your client’s requirements suddenly turn into your new start-up. In this post I look back on the initial problem and why the solution was three products.
