1
00:00:02,125 --> 00:00:05,760
Our page looks really good now, but again,

2
00:00:05,760 --> 00:00:08,340
checking our finished result here.

3
00:00:08,340 --> 00:00:13,340
This arrow here next to the explore text is missing.

4
00:00:13,470 --> 00:00:17,480
Now you might say this could be an icon or an image or

5
00:00:17,480 --> 00:00:20,800
anything like this or some kind of predefined object

6
00:00:20,800 --> 00:00:22,610
we added right here.

7
00:00:22,610 --> 00:00:25,163
But this is actually not the case.

8
00:00:27,030 --> 00:00:31,580
In our code back here in the HTML file.

9
00:00:31,580 --> 00:00:35,190
You might remember this meta information up here in the

10
00:00:35,190 --> 00:00:38,013
head. Meta charset UTF 8.

11
00:00:39,180 --> 00:00:43,210
This is a standard applied to our HTML page here,

12
00:00:43,210 --> 00:00:47,230
which allows the browser and HTML to understand a certain

13
00:00:47,230 --> 00:00:51,527
set of characters on any platform on any device.

14
00:00:51,527 --> 00:00:53,820
Now, this set of characters

15
00:00:53,820 --> 00:00:55,570
is not limited to

16
00:00:55,570 --> 00:00:57,530
text and numbers only.

17
00:00:57,530 --> 00:00:59,660
It is text numbers, of course,

18
00:00:59,660 --> 00:01:04,660
but the result that is being displayed can also be different

19
00:01:04,819 --> 00:01:07,183
from plain numbers and texts.

20
00:01:08,890 --> 00:01:11,220
Attached to this video you can find the link

21
00:01:11,220 --> 00:01:13,170
to this Wikipedia page,

22
00:01:13,170 --> 00:01:16,070
and turns out that in Unicode,

23
00:01:16,070 --> 00:01:18,700
we also have arrows available.

24
00:01:18,700 --> 00:01:20,380
We need an arrow, basically,

25
00:01:20,380 --> 00:01:23,520
we need an arrow from the left to the right.

26
00:01:23,520 --> 00:01:27,010
And if we check this list down here,

27
00:01:27,010 --> 00:01:30,890
well then something like this here might be exactly what we

28
00:01:30,890 --> 00:01:32,390
are looking for.

29
00:01:32,390 --> 00:01:35,290
We also have these cryptic numbers here.

30
00:01:35,290 --> 00:01:36,490
What do these mean?

31
00:01:36,490 --> 00:01:40,570
Well, 2, 1 9 X simply means we need to enter

32
00:01:40,570 --> 00:01:42,593
2, 1, 9 X.

33
00:01:43,612 --> 00:01:46,513
So two in our case for the right arrow, so 2 1 9 2.

34
00:01:47,500 --> 00:01:48,720
And then at the beginning,

35
00:01:48,720 --> 00:01:53,720
this U plus is not what we need for our UTF eight standard

36
00:01:54,990 --> 00:01:58,270
Here, we want to display the characters as

37
00:01:58,270 --> 00:02:00,620
hexadecimal reference,

38
00:02:00,620 --> 00:02:03,480
which would mean instead of this U plus

39
00:02:03,480 --> 00:02:08,479
we have to add an and symbol, a hash and an X.

40
00:02:08,910 --> 00:02:11,110
Now this sounds a bit complicated,

41
00:02:11,110 --> 00:02:15,230
but basically you can remember the number 2, 1 9 2,

42
00:02:15,230 --> 00:02:18,353
for this right arrow, and go back to the code.

43
00:02:20,350 --> 00:02:23,880
And know here into our places HTML file,

44
00:02:23,880 --> 00:02:26,620
and there we'll go to our

45
00:02:27,750 --> 00:02:32,290
explore reference here for our Barcelona link.

46
00:02:32,290 --> 00:02:37,170
And now we entered this 2, 1 9 2 number I just talked about.

47
00:02:37,170 --> 00:02:41,040
And now for the hexadecimal reference in UTF eight,

48
00:02:41,040 --> 00:02:43,680
we enter and hash

49
00:02:43,680 --> 00:02:45,310
and an X.

50
00:02:45,310 --> 00:02:46,890
This looks a bit strange,

51
00:02:46,890 --> 00:02:51,890
but if we save this and go back to the project, yeah,

52
00:02:52,510 --> 00:02:55,083
you see, we have the arrow in here now.

53
00:02:56,570 --> 00:02:59,492
And this just works because of this predefined and

54
00:02:59,492 --> 00:03:03,070
globally available character set.

55
00:03:03,070 --> 00:03:03,903
Now,

56
00:03:03,903 --> 00:03:07,530
what we have to do now is we have to add this arrow here

57
00:03:07,530 --> 00:03:09,720
to our other explorer links.

58
00:03:09,720 --> 00:03:12,650
So this is a bit of copy and paste here.

59
00:03:12,650 --> 00:03:16,940
So just selected including the space here

60
00:03:16,940 --> 00:03:19,103
and now add it once.

61
00:03:20,480 --> 00:03:22,897
Twice right here,

62
00:03:22,897 --> 00:03:25,403
right there,

63
00:03:27,010 --> 00:03:29,053
right here.

64
00:03:31,430 --> 00:03:32,553
Paris,

65
00:03:34,200 --> 00:03:36,090
Sydney,

66
00:03:36,090 --> 00:03:37,530
and

67
00:03:37,530 --> 00:03:40,110
Tokyo down here.

68
00:03:40,110 --> 00:03:42,200
So let's see, yeah.

69
00:03:42,200 --> 00:03:47,020
Now we have this nice little arrow added to all our cities.

70
00:03:47,020 --> 00:03:48,440
No, I forgot Bali.

71
00:03:48,440 --> 00:03:50,210
Sorry, my bad.

72
00:03:50,210 --> 00:03:53,040
Such a nice destination.

73
00:03:53,040 --> 00:03:55,840
Now the arrow is also here.

74
00:03:55,840 --> 00:03:57,420
With this,

75
00:03:57,420 --> 00:04:00,000
we learned another very helpful feature,

76
00:04:00,000 --> 00:04:03,820
which allows us to easily implement such symbols without

77
00:04:03,820 --> 00:04:06,389
adding any images or icons.

78
00:04:06,389 --> 00:04:07,380
Of course,

79
00:04:07,380 --> 00:04:10,030
this is not limited to arrows here.

80
00:04:10,030 --> 00:04:11,130
Attached to the lecture,

81
00:04:11,130 --> 00:04:15,000
you can find more resources about Unicode and how you can

82
00:04:15,000 --> 00:04:19,510
implement different, nice default symbols with it.

83
00:04:19,510 --> 00:04:22,480
This means we are almost done with this module.

84
00:04:22,480 --> 00:04:25,690
The next lecture we'll apply some finishing touches

85
00:04:25,690 --> 00:04:28,743
and see if we have to clean up our code a bit.