How to Make a Basic Website Using Notepad

Introduction: How to Make a Basic Website Using Notepad

About: I like making VBScript files, batch files, I am learning PHP, HTML, and CSS, and I photoshop when I'm bored.

Has anyone wondered

"how do I make a website out of a basic writing program?"

Well, obviously, not specifically...

Anyway, here I'll show you how to make a BASIC website using only notepad.

Supplies

For this project you will need:

-a big brain

-notepad

-maybe an HTML and CSS commands cheat sheet

-a lot of patience

Step 1: The Start

Open notepad. Actually, open it twice. You'll be coding 2 files at the same time.

Now, save both files. One will be [file name].html, and the other will be [file name].css

Step 2: Setting Up the HTML File.

On the HTML file, write on the first line ""
skip a line

line 2 -

line 3 - [name of page]

line 4 -

line 5 -

skip a line

line 6 -

line 7 -

[what you want on the first line. this is regular text.]

line 8 -

line 9 -


Now, edit where I put the messages in [ ]

EXPLANATION - - -

states the start of the code.

states the start of the header.

states what will show on the tab name</p><p> +other code in link will link the css stylesheet to the html for styles.</p>

ends the statement.

ends the header statement

states the start of the body text / code

is the start of the paragraph of the text that will show up when you run the html code.

you guessed it. it ends the body statements

signifies the end of the code.

Step 3: Setting Up the CSS File.

on the first line of the CSS file, put ( @charset "utf-8"; )

line 2 - body

line 3 {background: [what you want as the background color]

line 4 - }

line 5 - h1 {

line 6 - font-family:bold

line 7 - }

You can add more variables, and change my notes in between [ ]

Step 4: Well, That Was It.

If you want, you could use a better guide like

"Web Designing Basics" by vishalapr

https://www.instructables.com/Web-Designing-Basics...

Also, beware that notepad does not show you where your code goes wrong.

That is why website coding software is recommended.

Be the First to Share

    Recommendations

    • Fix It Speed Challenge

      Fix It Speed Challenge
    • Photography Challenge

      Photography Challenge
    • Anything Goes Contest 2021

      Anything Goes Contest 2021

    Comments