Test-Driven Product Design

Cognitive Biases — The Barnum Effect

Cognitive Biases — The Bandwagon Effect

Cognitive Biases — The Anchoring Effect

Cognitive biases: loss aversion

Leading a data-driven strategy

Cognitive Biases — Availability heuristic

Decisions and distractions

Cognitive Biases — Post-Purchase Rationalisation

Cognitive Biases — Framing Effect

Level up — Design Better Steppers

Cognitive Biases — The IKEA Effect

Cognitive Biases — Unit Bias

7 Ways To Improve Your UX Writing

CSS url()

The use cases of url() in CSS are huge, here are most of the properties the url()…

CSS :focus-within pseduo-class

The :focus-within pseudo-class is a CSS Level 4 selector that is supported by Firefox, Chrome, Safari as…

Cognitive Biases Cheat Sheet

Framing effect In summary: Framing is not about what is said, but how it is said. Example of…

WebPageTest Obscure Features for Performance Testing

WebPageTest for those who haven't used it can allow anyone, for free, to test their website performance…

CSS custom properties for cascading variables

Preprocessors like Less and Sass have helped over the past few years to keep development CSS codebases…

Google to Use Page Speed as Ranking Signal in Mobile Search

From July 2018, Google is going to consider page speed as a ranking signal for mobile search. Page…

UX and UI Tools 2018

With a plethora of UX tools on the market it can be overwhelming what to use. From…

The guide on progressive web apps

It is very difficult to get people to install a native mobile app. Even if someone installs…

The web is bloated

First published on LinkedIn - June 25, 2017 One of the greatest frustrations with websites is speed.…

CSS Borders

The border property allows you to specify how the border of the box representing an element should…

CSS Padding and Margin

The most two popular CSS properties are margin and padding, they are used for spacing-out elements. Simply…

CSS Font Smoothing in Webkit and Firefox

Using font smoothing can turn a horrible typeface to a beautiful one. The Webkit and Firefox browsers…

Pseudo Class

A pseudo-class starts with a colon (:),it is similar to a class in HTML, but it's not…

Hiding Elements using CSS

We have plenty of options at our disposal at hiding elements with CSS. In this post we…

Quick Tip – Using CSS3 For Alternate Row Colours

Using the CSS3 pseudo class nth-child we can style table rows to be alternating colours.Browser support using…

CSS How to Style External Links

Styling an external links is a nice visual indictor for users that if they click the link…

Opacity Property in CSS

The CSS opacity property controls how transparent an element is. The values can be between 0 (not…

CSS Cursors

Using the correct type of cursors is becoming more important than ever with the increase in web…

Comments in HTML

Using comments in the HTML document will not be visible in the user's browser. It can be…

A Guide to HTML Tables

Tables have been used in the past (hopefully not still) to design the full layouts of websites.…

Flexbox

Originally posted on Codepen, this post will look into Flexbox. (more…)

The Pseudo Element

Not to be mistaken with pseudo-classes, pseudo-elements allow you to style certain parts of a document. We…

HTML5’s Input Type’s

In the previous post about Disabling Autocomplete, Autocapitalise  and Autocorrect we looked at how we can improve forms for…

A Guide to Understanding the Favicon

The Favicon is sometimes an overlooked aspect to digital branding, yet this small opportunity is just another…

Disable Autocomplete, Autocapitalize, and Autocorrect

Although autocomplete, autocapitalise and autocorrect is useful when creating notes or posting a comment on a Twitter status…

HTML Link hreflang

Introduced by Google in 2011, the hreflang tag specifies the language of the text in the linked document.…