Hello great minds, I wanna show simple steps to designing a website.
Now grab your PC,boot it and lets get started.
What is a website?
A website is a set of related web pages located under a domain name.
Web pages or files can be created using web languages like HTML, Php, CSS, Javascript, Node.js etc.
At this point we will start with HTML
HTML = Hypertext Markup Language
We are going to design a simple web page using HTML.
(Hope your PC is on)
Launch this software "Notepad"
Now Notepad is a text editor, it is available on all window operating systems.
Now HTML is like using a word processor like Microsoft sword
HTML gives the content structure, example: paragraphs, headings, images etc.
Before we create our first web page, let's look at the elements of HTML.
We have <h1> to <h6>, <em>, <div>, <a>, <span>, <strong>, <p>
As we proceed with HTML sessions, you'll get to understand all the elements.
Before proceeding, lemme show some features of coding.
There is what is called opening and closing tag
This is opening <>
This is closing </>
Now, on your Notepad, open a tag <>
In between the tag type DOCTYPE ="HTML"
Like this
<DOCTYPE ="HTML">
Press Enter
(Now we have open a tag and we have to close it).
Press Enter 4 times
Type
</HTML>
Save the file as test.html
When you save don't close the Notepad, minimize it instead.
Open the file you saved
It should be blank
And it should open in a browser.
Now back to the Notepad
Inbetween the opened tag and closed tag, we are going to open another Tag just like this
<DOCTYPE ="HTML">
<title>
</HTML>
Where you have
- <title>
type this
- <title> My first web page</title>
Press Enter
(Title is used in giving the name of the web page).
Type
- <body>
Press Enter 3 times
Then Type
- </body>
Now inbetween the opened and closed body tag, type
- <h1>
Like this
<body>
<h1>
</body>
Complete the
- <h1>
tag
Like this:
- <h1> I love my first web page </h1>
Now save the file exactly like you did before (test.html)
Open the saved file (remember not to close the Notepad, minimize instead).
**I love my first web page** is what should show on your browser.
Now h1 shows how big you want your write up to be.
Now back to Notepad
Go to
- <h1>
copy the whole line with the closing tag
Press Enter and paste 5times
Make it like this
<h2> I love my first web page </h2>
<h3> I love my first web page </h3>
<h4> I love my first web page </h4>
And so on till h6
Save the file
Now open the saved file
Note: you must not see any open tag or closed tag. If you see any script/code it means error
Now that's the Heading, so when designing a website, you can choose any heading you want that is either h1 to h6
Now delete all other h1 tags except h2, I want to use h2 heading
Now under h2 tag
Type
- <p>This is my first time of designing a website through Notepad </p>
Now on this code,
- <p>
means paragraph
Save and open
What you will is
- I love my first web page
- This is my first time of designing a website through Notepad
- Let's stop here for now, to be continued next time...
*Thank you for always visiting my blog*
💖💖💖💖💖
hiveblocks