1
00:00:02,090 --> 00:00:03,630
Now last but not least,

2
00:00:03,630 --> 00:00:07,021
another important aspect of search engine optimization

3
00:00:07,021 --> 00:00:09,668
and a good user experience in general,

4
00:00:09,668 --> 00:00:12,453
is that you should improve and optimize

5
00:00:12,453 --> 00:00:14,243
the performance of your site,

6
00:00:14,243 --> 00:00:17,200
and that you specifically should ensure

7
00:00:17,200 --> 00:00:19,885
that your users don't have to download large

8
00:00:19,885 --> 00:00:22,595
JavaScript files or image files.

9
00:00:22,595 --> 00:00:26,420
Now I got no front-end JavaScript code here.

10
00:00:26,420 --> 00:00:28,170
And even if I would have some code here,

11
00:00:28,170 --> 00:00:30,633
it probably would be pretty small.

12
00:00:31,530 --> 00:00:33,360
Nonetheless, if you have websites

13
00:00:33,360 --> 00:00:35,391
with more complex JavaScript code,

14
00:00:35,391 --> 00:00:38,710
you might want to look for ways of writing it

15
00:00:38,710 --> 00:00:40,095
in a more concise way.

16
00:00:40,095 --> 00:00:44,920
And then there also are tools like Minify JS,

17
00:00:44,920 --> 00:00:45,973
for which you can Google,

18
00:00:45,973 --> 00:00:49,834
which can also help you minify your JavaScript code.

19
00:00:49,834 --> 00:00:53,520
You can put your raw JavaScript code in here

20
00:00:53,520 --> 00:00:55,960
and get the optimized code on the right,

21
00:00:55,960 --> 00:00:57,460
which will still work,

22
00:00:57,460 --> 00:01:00,290
but which, for example, will have the variable names,

23
00:01:00,290 --> 00:01:03,255
shortened and unnecessary white space removed,

24
00:01:03,255 --> 00:01:07,040
and you can then use that optimized code for deployment

25
00:01:07,040 --> 00:01:09,918
and the readable code for local development.

26
00:01:09,918 --> 00:01:13,143
It doesn't matter here, but it is something to be aware of.

27
00:01:14,190 --> 00:01:16,792
You also want to optimize your images.

28
00:01:16,792 --> 00:01:18,591
Here I'm using one image

29
00:01:18,591 --> 00:01:21,840
and I did actually already optimize it before.

30
00:01:21,840 --> 00:01:24,450
It's only around 27 kilobytes big,

31
00:01:24,450 --> 00:01:26,660
which is not very big.

32
00:01:26,660 --> 00:01:29,110
You definitely want to avoid having images

33
00:01:29,110 --> 00:01:31,750
that are two or three megabytes big.

34
00:01:31,750 --> 00:01:34,489
And instead you want to use tools like Photoshop

35
00:01:34,489 --> 00:01:38,020
or other image editing tools to shrink them,

36
00:01:38,020 --> 00:01:40,443
to shrink their dimensions.

37
00:01:40,443 --> 00:01:43,050
You, for example, don't need images

38
00:01:43,050 --> 00:01:45,640
that are 4,000 pixels wide.

39
00:01:45,640 --> 00:01:49,160
You probably won't display them with that size

40
00:01:49,160 --> 00:01:50,520
on the screen anyways.

41
00:01:50,520 --> 00:01:54,040
And you might also want to reduce the quality of the image

42
00:01:54,040 --> 00:01:56,950
inside of an image editing program a little bit

43
00:01:56,950 --> 00:01:59,556
so that you ship by even smaller file.

44
00:01:59,556 --> 00:02:01,940
For example, here, in this example,

45
00:02:01,940 --> 00:02:04,954
I set my image to a width and height of five REM,

46
00:02:04,954 --> 00:02:07,750
which by default is 80 pixels

47
00:02:07,750 --> 00:02:10,850
and hence it would make no sense if my raw image

48
00:02:10,850 --> 00:02:13,535
would have a thousand pixels width,

49
00:02:13,535 --> 00:02:17,090
because it would be the raw image that would be downloaded

50
00:02:17,090 --> 00:02:20,234
and then its size would be adjusted inside of the browser

51
00:02:20,234 --> 00:02:22,218
after it was downloaded.

52
00:02:22,218 --> 00:02:25,870
That's why you want to avoid having super large images,

53
00:02:25,870 --> 00:02:27,316
which are way too large.

54
00:02:27,316 --> 00:02:30,130
A little bit too large is okay,

55
00:02:30,130 --> 00:02:32,180
but having a 2000 pixels image,

56
00:02:32,180 --> 00:02:36,044
if you only need five REM of width is definitely too much.

57
00:02:36,044 --> 00:02:39,210
I also briefly want to mention services

58
00:02:39,210 --> 00:02:40,740
like Cloudinary again,

59
00:02:40,740 --> 00:02:44,630
which you cannot just use for storing user uploaded files,

60
00:02:44,630 --> 00:02:48,231
but also for your own images that are part of your website.

61
00:02:48,231 --> 00:02:52,120
You can upload them manually as a developer

62
00:02:52,120 --> 00:02:55,223
and then use the URLs Cloudinary gives you

63
00:02:55,223 --> 00:02:59,000
to embed those URLs into the HTML code

64
00:02:59,000 --> 00:03:02,910
and then Cloudinary even offers some optimization

65
00:03:02,910 --> 00:03:06,993
on their servers to shrink and optimize the image for you.

66
00:03:06,993 --> 00:03:10,170
They have a lot of features related to that.

67
00:03:10,170 --> 00:03:11,628
If you want to use them,

68
00:03:11,628 --> 00:03:14,120
definitely check out their documentation

69
00:03:14,120 --> 00:03:16,050
and that can then be another building block

70
00:03:16,050 --> 00:03:19,823
which allows you to provide an even more optimized website.