UX 101

Simple tips & tricks for beautiful, usable websites.
@andreacroftsandreacrofts.com
x
you

Usable
Desirable
Feasible

We are capable of
discerning far more
than we are capable
of articulating.
- Jonathan Ive
“

tipssssseasy wins to make your websites über usable.

LET’S GET STARTED
Strategies for effective calls to action.

Be speciﬁc with
calls to action.
LEARN MORE
LEARN MORE
LEARN MORE
LEARN MORE
LEARN MORE

ADD TO WATCHLIST
READ THE BOOK
WATCH THE VIDEO
GET ORGANIZED
DONATE $45
Be speciﬁc with
calls to action.

Be succinct with
your calls to action.
READ THE REPORT AND GET STARTED

Use contrast
In colour, to denote emphasis.

Use contrast
In value, to denote hierarchy.

Use contrast
In typography, to denote tone and personality.

Contrast is our friend.
Optimal contrast for an optimal
reading experience.
High-contrast typography treatments provide
more visual gravitas, and are much easier to
read for older users and those with low vision.
EXAMPLE No. 2
Don’t go overboard, though.
Accessibility matters.
Low-contrast typography, however tempting to use,
isn’t accessible to those with even minor visual
impairments, let alone users with low vision or old age.
EXAMPLE No. 1

H1H2
H3

Reserve hover states for
clickable elements.

Content cards for the win.

Because, the whole card
can be made clickable

Because, animation

There’s a good reason why
all websites look the same.
These patterns create cognitive models for users.
DO THE THING
About ContactLogo The Thing

My website does
this cool thing.
Here’s how it provides value in your life.
DO THE THING

Cool it on the
busy patterns.
A cleaner, more focused approach = better UX
DO THE THING

toolssssto make your life easier.

zeplin.io

typography
is hard, I get it.

Tips and tricks for sexy web typography
Find your typeography

Q&A

UX 101

Recommandé

Recommandé

Contenu connexe

Tendances

Tendances (9)

En vedette

En vedette (20)

Similaire à UX 101

Similaire à UX 101 (20)

Dernier

Dernier (20)

UX 101