Voiceover: Welcome back. 2 2
We are finally going to start building our killer web page. 3 3
Great. 4 4
But before diving right in, 5 5
you got to have a very clear plan 6 6
of exactly what we're gonna do. 7 7
With a good plan, you're already halfway 8 8
to a great website. 9 9
Because building a website is not just writing some code, 10 10
it's much more than that. 11 11
It's a whole process 12 12
from complete scratch 13 13
to a completely functional website. 14 14
And I'm going to reveal the seven real world steps 15 15
of that process right now. 16 16
Every good website in the world needs to follow 17 17
at least these seven steps. 18 18
You should definitely take some notes of these. 19 19
So let's go. 20 20
Start off by defining the goal of your project. 21 21
This can be showing your portfolio to the world, 22 22
selling an e-book, building a blog, or whatever you want. 23 23
Also define your audience. 24 24
Ask yourself which is the typically user 25 25
that will visit my website. 26 26
This is important because you should always design 27 27
with your goal and audience in mind. 28 28
Once your project is defined, 29 29
plan your content carefully. 30 30
This includes text, images, videos, icons, et cetera. 31 31
Remember what I told you about visual hierarchy 32 32
in the web design section? 33 33
It plays an important role when you start thinking 34 34
about what you want on your website 35 35
and what you don't. 36 36
Defining the content before actually starting the design 37 37
is called the content-first approach. 38 38
It means that you should design for the content, 39 39
instead of designing a webpage 40 40
and then filling it with some stuff. 41 41
Also define the navigation 42 42
and the site structure in this step. 43 43
You can draw a side map in this step if we're talking 44 44
about a bigger project. 45 45
Now it's time to get inspired 46 46
and think about your design. 47 47
Then get the ideas our of your head. 48 48
And by that I mean 49 49
sketch your ideas before you start designing. 50 50
It will help you explore ideas and create a concept 51 51
of what you want to build. 52 52
Using pencils and paper is a great way 53 53
of quickly retaining your valuable ideas. 54 54
And make as many sketches as you want, 55 55
but don't spend too much time perfecting anything. 56 56
Once you have an initial idea 57 57
you can concentrate on the details 58 58
when designing in HTML and CSS. 59 59
I advise you to never ever start designing 60 60
without having an idea of what you want to build. 61 61
Getting inspiration is very important in this phase 62 62
and I already told you how to do that. 63 63
Now after sketching start to design your website 64 64
using all the guidelines and tips you've learned 65 65
in the web design section. 66 66
You will do that using HTML and CSS 67 67
which is called designing in the browser. 68 68
So designing in the browser is basically designing 69 69
and developing at the same time. 70 70
There are actually more and more designers 71 71
leaving traditional design programs such as Photoshop 72 72
and start designing in the browser 73 73
such as we are going to do. 74 74
The biggest reason for this 75 75
is that you can't design responsive websites in Photoshop. 76 76
It also saves you tons of time. 77 77
And in this phase you'll use your sketches, content, 78 78
and planning decisions you've made in steps 79 79
one, two, and three. 80 80
This step is of course the biggest part 81 81
of building a website. 82 82
But don't forget, 83 83
all the other steps are also very, very important. 84 84
Now before you can launch your beautiful masterpiece 85 85
for the world to see it, 86 86
we have to optimize it's performance 87 87
and for search engines such as Google. 88 88
You don't want a slow website or one that no one can find. 89 89
Right? 90 90
Your optimized website is then finally ready to launch. 91 91
All you need for this is a web server 92 92
that will host your website and deliver it to the world. 93 93
I will later show you a way to do exactly that. 94 94
But the launch of your website is not the end of the story. 95 95
Now it's time to monitor your users' behavior 96 96
and make some changes to your website if necessary. 97 97
You should also update your content regularly 98 98
in order to show your users that your website is alive. 99 99
For instance a blog can be a very great way of doing that. 100 100
These steps I just showed you are so incredibly important 101 101
that I also included them in the course e-book 102 102
so that you always know where to find them. 103 103
Also in the e-book is the link to a document 104 104
called The Periodic Table of Web Design Process, 105 105
if you want an even deeper understanding 106 106
of the complete web design and development process. 107 107
So make sure to check it out. 108 108
Now over the rest of the course 109 109
we're going to put these 110 110
seven real world steps into action. 111 111
After that we will have a fully functional, 112 112
beautiful designed and developed website on the internet. 113 113
Excited? So let's start it.