1
00:00:06,210 --> 00:00:07,170
- [Instructor] In this segment,

2
00:00:07,170 --> 00:00:08,880
we're going to look at good practices

3
00:00:08,880 --> 00:00:11,190
for constructing error messages.

4
00:00:11,190 --> 00:00:14,190
It is so important to not expose code

5
00:00:14,190 --> 00:00:16,650
or technical details in error messages,

6
00:00:16,650 --> 00:00:20,040
because they could be used
for reconnaissance purposes.

7
00:00:20,040 --> 00:00:23,220
But that being said, error
messages have a purpose,

8
00:00:23,220 --> 00:00:25,200
which is very often to help users

9
00:00:25,200 --> 00:00:27,690
understand what went wrong.

10
00:00:27,690 --> 00:00:30,240
So ultimately, we need to find the way

11
00:00:30,240 --> 00:00:33,900
to balance exposure and usability.

12
00:00:33,900 --> 00:00:36,480
So I wanna share with
you some best practices

13
00:00:36,480 --> 00:00:38,820
for writing good error messages,

14
00:00:38,820 --> 00:00:42,900
with credit to Saadia Minhas
who wrote an excellent article

15
00:00:42,900 --> 00:00:47,640
in uxplanet.org on how to
write good error messages.

16
00:00:47,640 --> 00:00:49,110
Now bearing in mind through all this

17
00:00:49,110 --> 00:00:52,290
that we wanna make sure that
we're honoring the constructs

18
00:00:52,290 --> 00:00:55,440
of input and output validation,

19
00:00:55,440 --> 00:00:59,250
and that we're not exposing
any unnecessary details.

20
00:00:59,250 --> 00:01:02,730
At the same time, we're
looking to make the experience

21
00:01:02,730 --> 00:01:05,163
a really good one for the users.

22
00:01:06,000 --> 00:01:09,000
So let's look at some
of those best practices.

23
00:01:09,000 --> 00:01:12,060
Our first best practice
is that our error messages

24
00:01:12,060 --> 00:01:14,460
should be short and meaningful.

25
00:01:14,460 --> 00:01:16,590
If you look at the message
on the left hand side

26
00:01:16,590 --> 00:01:18,960
where you see the green
circle in the check box,

27
00:01:18,960 --> 00:01:21,907
you can see an email field
and the instructions are,

28
00:01:21,907 --> 00:01:24,690
"Please enter your email address in format

29
00:01:24,690 --> 00:01:27,120
yourname@example.com."

30
00:01:27,120 --> 00:01:28,920
Now we're assuming that
the field was filled out,

31
00:01:28,920 --> 00:01:30,240
it was filled out incorrectly,

32
00:01:30,240 --> 00:01:33,180
so this is the message
that's being displayed.

33
00:01:33,180 --> 00:01:35,730
It's a precise and meaningful indicator

34
00:01:35,730 --> 00:01:37,830
of the desired behavior.

35
00:01:37,830 --> 00:01:39,330
Let's compare and contrast that

36
00:01:39,330 --> 00:01:41,347
with the message on the right that says,

37
00:01:41,347 --> 00:01:42,720
"The email address you entered

38
00:01:42,720 --> 00:01:44,760
does not match the required format.

39
00:01:44,760 --> 00:01:47,490
Please enter your email
address using standard format."

40
00:01:47,490 --> 00:01:50,160
But we never say what
the standard format is,

41
00:01:50,160 --> 00:01:53,730
so it's a long message, it
has unnecessary details,

42
00:01:53,730 --> 00:01:56,670
but it's missing the required information.

43
00:01:56,670 --> 00:01:58,830
So short and meaningful error messages

44
00:01:58,830 --> 00:02:00,240
are more understandable.

45
00:02:00,240 --> 00:02:02,790
And in this case, we're asking for input

46
00:02:02,790 --> 00:02:06,033
that's going to meet our
input validation rules.

47
00:02:09,300 --> 00:02:12,630
Our next best practice
is clear and simple.

48
00:02:12,630 --> 00:02:14,070
In this case we have a network error,

49
00:02:14,070 --> 00:02:16,110
where the network connection is lost.

50
00:02:16,110 --> 00:02:18,307
On the left hand side
we're just being told,

51
00:02:18,307 --> 00:02:20,010
"The network connection is lost,

52
00:02:20,010 --> 00:02:21,930
do you wanna cancel or reconnect?"

53
00:02:21,930 --> 00:02:25,590
The user's informed about the
problem using simple details,

54
00:02:25,590 --> 00:02:29,070
again, clear and simple,
either cancel or reconnect.

55
00:02:29,070 --> 00:02:30,630
Again, compare and contrast it

56
00:02:30,630 --> 00:02:33,217
to the message on the right hand side,

57
00:02:33,217 --> 00:02:36,240
"Network error, the operation
couldn't be completed.

58
00:02:36,240 --> 00:02:37,890
WDGeneralNetworkError 500."

59
00:02:40,168 --> 00:02:42,510
Well, that may be revealing some details,

60
00:02:42,510 --> 00:02:44,340
you know, to our bad guy

61
00:02:44,340 --> 00:02:46,830
who's looking for reconnaissance clues.

62
00:02:46,830 --> 00:02:49,230
On the other hand, it's
not the least bit helpful

63
00:02:49,230 --> 00:02:52,740
for our users, who have no
idea what that actually means.

64
00:02:52,740 --> 00:02:55,110
So in that case, you know,
the user's not concerned

65
00:02:55,110 --> 00:02:57,540
with the technical details
of the error that occurred,

66
00:02:57,540 --> 00:03:00,300
nor will they understand
that, it doesn't help them.

67
00:03:00,300 --> 00:03:02,490
But the first message,
the message on the left,

68
00:03:02,490 --> 00:03:05,940
the user's informed about the
problem using simple language.

69
00:03:05,940 --> 00:03:07,200
You know, technical details

70
00:03:07,200 --> 00:03:11,700
make an error message more
complex, certainly less usable,

71
00:03:11,700 --> 00:03:14,250
and has the potential of exposure.

72
00:03:14,250 --> 00:03:15,633
So clear and simple.

73
00:03:16,500 --> 00:03:20,280
Our next best practice is to
be visible and noticeable.

74
00:03:20,280 --> 00:03:23,070
If you look at the message
on the left hand side,

75
00:03:23,070 --> 00:03:24,390
we're gonna assume that our user

76
00:03:24,390 --> 00:03:27,270
did not fill out the
city and zip code fields,

77
00:03:27,270 --> 00:03:30,840
so those boxes are now in
red with the relevant option

78
00:03:30,840 --> 00:03:32,107
of what they need to do right there.

79
00:03:32,107 --> 00:03:35,520
"City is required, zip code is required."

80
00:03:35,520 --> 00:03:37,440
Again, we're not violating
any of our rules,

81
00:03:37,440 --> 00:03:39,480
we're asking for that information,

82
00:03:39,480 --> 00:03:42,120
and it's always better
to display error messages

83
00:03:42,120 --> 00:03:44,670
along with the relevant options.

84
00:03:44,670 --> 00:03:46,837
Look at the right hand side where we have,

85
00:03:46,837 --> 00:03:49,050
"City and zip code is required."

86
00:03:49,050 --> 00:03:51,210
But that's up at the top of the form,

87
00:03:51,210 --> 00:03:53,100
and the user will take a while

88
00:03:53,100 --> 00:03:55,800
to relate the error message with options.

89
00:03:55,800 --> 00:03:59,220
So it's a really good experience
to provide error details

90
00:03:59,220 --> 00:04:01,713
right along with the control or the field.

91
00:04:05,010 --> 00:04:09,030
And our last best practice
is to be humble and positive,

92
00:04:09,030 --> 00:04:11,790
again, we want our users
to have a good experience.

93
00:04:11,790 --> 00:04:13,830
We have a name field,
apparently it was skipped,

94
00:04:13,830 --> 00:04:15,450
the user didn't put in their name,

95
00:04:15,450 --> 00:04:16,987
and now we just say, please,

96
00:04:16,987 --> 00:04:18,690
"Please enter your name."

97
00:04:18,690 --> 00:04:19,920
The user's informed

98
00:04:19,920 --> 00:04:23,943
in a humble, polite, positive
way about the problem,

99
00:04:24,900 --> 00:04:27,757
opposed to the box on the
right hand side, which says,

100
00:04:27,757 --> 00:04:29,400
"You didn't enter a name."

101
00:04:29,400 --> 00:04:31,830
The error message seems to blame the user,

102
00:04:31,830 --> 00:04:33,300
and if that message was in caps,

103
00:04:33,300 --> 00:04:35,340
it would feel like they're
yelling at the user,

104
00:04:35,340 --> 00:04:37,860
and no one wants to feel
like they're being yelled at

105
00:04:37,860 --> 00:04:39,120
or insulted, all right?

106
00:04:39,120 --> 00:04:42,300
We wanna be humble, we wanna
be positive, all right?

107
00:04:42,300 --> 00:04:44,880
We wanna be straightforward
and simple, all right?

108
00:04:44,880 --> 00:04:46,650
But we just want to inform the user

109
00:04:46,650 --> 00:04:48,993
so they can do the next correct thing.

110
00:04:50,820 --> 00:04:55,800
So quick recap, clear and
simple, short and meaningful,

111
00:04:55,800 --> 00:04:59,430
visible and noticeable,
humble and positive.

112
00:04:59,430 --> 00:05:03,000
Again, not revealing,
no unnecessary details,

113
00:05:03,000 --> 00:05:05,670
we don't wanna give any
ammunition or any clues

114
00:05:05,670 --> 00:05:09,300
to anyone who is doing a
reconnaissance operation.

115
00:05:09,300 --> 00:05:10,170
At the same time,

116
00:05:10,170 --> 00:05:13,050
we wanna make sure that we're
providing a great experience

117
00:05:13,050 --> 00:05:14,850
for our user community.

118
00:05:14,850 --> 00:05:16,713
And that's a closer look.