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