Open Glitch, click on "hello-webpage", and click "Remix your own."
HTML is the language we use to write webpages. Every website you've ever visited uses HTML, and yours is no different.
Open the index.html file in the sidebar, and delete everything :)
Now, start typing your code (don't copy and paste!!)
<!DOCTYPE html>
<html>
<head>
</head>
<body>
</body>
</html>
First things first, let's add a heading! Below the <body>
line, add an <h1>
, which is a large heading:
<h1>Shake It Off by Taylor Swift</h1>
Click the Show Live button in the upper left to see your website so far! You've got your own webpage!
Find a photo online, then right-click and "Copy Image Address".
Add it to your page like this:
<img src="YOUR URL">
Want to add a paragraph of text? Try this:
<p>Shake It Off is the best song ever written.</p>
Maybe embed a YouTube video? On a YouTube page, click "Share," then "Embed." Copy the HTML code it gives you into your page, and voilà!
While we use HTML to write the content of webpages, we use another language, called CSS, for styling and layout.
First, we need to add a link to the CSS we're going to write. Below the <head>
:
<link rel="stylesheet" href="style.css">
Now open your style.css
file in the sidebar, and delete everything.
In your CSS file, write this: (don't copy and paste!)
body {
font-family: Arial;
text-align: center;
}
Just like that, you're starting your own design!
Not sure how to do something? Google it! Try how to add a link in html
or how to embed audio with html
. Find some code, copy and paste it, change things. The web is built by tinkerers.