DEV Community

Shrikant Dhayje
Shrikant Dhayje

Posted on • Updated on • Originally published at codewithshriekdj.netlify.app

Building Website from Scratch - Part 3

So Now I Am gonna Try to Change Code With VS Code ( Visual Studio Code ) Editor.

The VS Code Have also There own Boilerplate for HTML File Which I Am Gonna Use and It Will Look Like Given Below.

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Hello World</title>
</head>
<body>
    <h1>Hello World</h1>
</body>
</html>
Enter fullscreen mode Exit fullscreen mode

Here <html lang="en"> will inform the Website is in English Language just Like the Language Code for Hindi is hi Language Code List.

Some Other Changes

I Also Added the Given Below Code In the File

<div class="wrapper">
    <header class="header">Website Header</header>
    <nav class="nav">
        <a href="#">Home</a><br />
        <a href="#">About</a><br />
        <a href="#">Contact</a><br />
    </nav>
</div>
Enter fullscreen mode Exit fullscreen mode

I Made The <header></header> and <nav></nav> tag separate because i like it that way and added them in wrapper div tag.

header tag can be used for Website Logo as Image Or Name.

nav tag is for the links within the site

All The Three <meta> are something like a additional information for site and Soms Configuration of the Site for all types of screens.

Site Looks like this Image.

Screenshot of the Simple Site

Pull Request

GitHub Repo

GitHub logo shriekdj / site-from-scratch

Here I Will Create My Site from Start to Finish.

Site From Scratch By @shriekdj

Here I Will Create My Site from Start to Finish.

I Will Now Speed Up The Process.




Top comments (0)