The purpose of this project is to understand the basic structure of a web project and how the three fundamental technologies — HTML, CSS, and JavaScript — work together to create a simple webpage.
Below is the folder layout used in this lesson:
project-folder/
│── index.html # The main HTML page (structure/content)
│── styles.css # CSS file for styling and layout
│── script.js # JavaScript file for logic or interactivity
│── assets/ # Folder for images, icons, or other static resources
│── assets/ # Folder for images, icons, or other static resourcesindex.html— The main entry point for the webpage. Defines the structure and content that appears in the browser.styles.css— Controls how the HTML elements look (colors, fonts, spacing, layout).script.js— Adds logic and interactivity, such as animations or background color changes.assets/— Stores media files like images, icons, or background graphics. Keeping these in one folder keeps your project tidy.
Every webpage starts with a similar foundational structure:
<!DOCTYPE html>
<html lang="en">
<head>
<title>Hello Web</title>
<link rel="stylesheet" href="styles.css" />
</head>
<body>
<h1>Hello Web</h1>
<p>The first webpage</p>
<script src="script.js"></script>
</body>
</html>The project is a simple webpage Hello Web webpage , to get started with web development