Helpful for generating CSS grid layouts and provide code that you can copy and paste instantly.
A tool for online guestbook or digital diary where visitors can leave notes.
Turn images into stylized pixel-dithered art, perfect for designs and to decrease image size
Quickly compress and optimize image file sizes.
Free web-hosting inspired by GeoCities — build and share personal websites.
Version control and collaboration platform for coding projects and portfolios.
Interactive drag-and-drop quantum circuit simulator for visualizing quantum logic.
A quick and simple guide to get started with coding for the web. These steps show how to make your own webpage using HTML, CSS, and JavaScript.
HTML is the structure of your page.
Open BBEdit or any text editor and create a new file named
index.html
. Then, paste this:
<!DOCTYPE html>
<html>
<head>
<title>My First Page</title>
</head>
<body>
<h1>Hello, world!</h1>
<p>This is my first webpage.</p>
</body>
</html>
CSS controls how things look.
Inside the same file (between <style>
tags)
or in a separate style.css
, try this:
<style>
body {
background-color: #f7f9fc;
color: #222;
font-family: "Courier New", monospace;
text-align: center;
margin-top: 10vh;
}
</style>
JavaScript makes your page dynamic. Try adding a button that shows a message when clicked:
<button onclick="alert('Hi there!')">Click Me</button>
When you open your page in a browser, pressing the button will display a message — your first bit of interactivity!
Save your file as index.html
, then double-click it.
Your browser will open it like any other webpage.
That’s all! You’ve just written your first working website using the same tools real developers use every day.