1
00:00:00,410 --> 00:00:03,530
Have you ever been frustrated
because it was difficult to

2
00:00:03,530 --> 00:00:05,230
click a particular element on a webpage?

3
00:00:06,230 --> 00:00:08,660
Maybe it was just very small.

4
00:00:08,660 --> 00:00:11,820
Perhaps, it was too close to
other elements and you wound up

5
00:00:11,820 --> 00:00:17,220
clicking the wrong thing which meant even
more clicks to get back where you started.

6
00:00:17,220 --> 00:00:20,280
Clickable areas should always
provide amper room for

7
00:00:20,280 --> 00:00:24,390
error nd we need to keep in mind
the prevalence of touch devices.

8
00:00:24,390 --> 00:00:27,480
Big fingers have a hard time
pin pointing small touch areas.

9
00:00:28,650 --> 00:00:33,700
Take this view of the travel app an
example, there is a create new team link

10
00:00:33,700 --> 00:00:37,640
at the bottom with some subtle but
well placed padding.

11
00:00:37,640 --> 00:00:40,490
It pushes the click
able area just a little

12
00:00:40,490 --> 00:00:43,240
past the dimensions of the text itself.

13
00:00:43,240 --> 00:00:46,896
That makes the link a little easier to
click on whenever you have the available

14
00:00:46,896 --> 00:00:49,890
such as navigation bars.

15
00:00:49,890 --> 00:00:53,560
Take advantage and
make as much clickable space as possible.

16
00:00:53,560 --> 00:00:57,320
At the same time,
any clickable should stay in one place

17
00:00:57,320 --> 00:01:00,230
because any movement makes
it harder to target.

18
00:01:00,230 --> 00:01:02,990
There are of course
exceptions to this rule.

19
00:01:02,990 --> 00:01:05,580
Say you're building an alarm clock app and

20
00:01:05,580 --> 00:01:09,570
you want the user to click on a target
before the alarm will stop sounding.

21
00:01:09,570 --> 00:01:14,060
The difficulty of clicking on that
target is inherent in its purpose.

22
00:01:14,060 --> 00:01:16,030
So, it's fine for it to move.

23
00:01:16,030 --> 00:01:18,960
You may want to consider
adjustable settings for speed and

24
00:01:18,960 --> 00:01:21,280
size of the target in a case like that.

25
00:01:21,280 --> 00:01:25,967
Users with diminished control over hand
movements might still use a mouse.

26
00:01:25,967 --> 00:01:29,780
Their movements might be
shaky unless accurate though.

27
00:01:29,780 --> 00:01:34,890
In that case, a larger clickable area
will result in fewer misplaced clicks and

28
00:01:34,890 --> 00:01:36,220
higher user satisfaction.