Scribd
Upload
3 views2 pages

HTML Multipage Portfolio Structure

The document outlines the structure for a multi-page portfolio website using pure HTML, consisting of Home, About, Portfolio, and Contact pages. Each page will share a common structure with a header, main content, and footer, ensuring consistency. Students are instructed to focus on writing HTML first, with CSS to be applied later for layout and design.

Uploaded by

Deepak Sharma
Copyright
© All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
3 views2 pages

HTML Multipage Portfolio Structure

The document outlines the structure for a multi-page portfolio website using pure HTML, consisting of Home, About, Portfolio, and Contact pages. Each page will share a common structure with a header, main content, and footer, ensuring consistency. Students are instructed to focus on writing HTML first, with CSS to be applied later for layout and design.

Uploaded by

Deepak Sharma
Copyright
© All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd

HTML Multi■Page Portfolio Website Structure

Objective: Students ko pure HTML se ek multi■page portfolio website banana sikhana jisme
Home, About, Portfolio, Contact pages ho. Pehle sirf HTML structure banaya jaega, CSS baad me
apply hogi.

Pages Required:
1 [Link] (Home Page)

2 [Link] (About Page)

3 [Link] (Projects Page)

4 [Link] (Contact Page)

Common Structure for ALL Pages:


Har page me same basic structure hoga taaki students consistency samjhein.
<!DOCTYPE html>
<html>
<head>
<title>Page Title</title>
<link rel="stylesheet" href="[Link]">
</head>
<body>
Header
Main Content
Footer
</body>
</html>

Header Section (Same on All Pages):


Header me logo aur navigation links honge jo sabhi pages ko connect karenge.
<header>
<div class="logo">My Portfolio</div>
<nav>
<a href="[Link]">Home</a>
<a href="[Link]">About</a>
<a href="[Link]">Portfolio</a>
<a href="[Link]">Contact</a>
</nav>
</header>

Home Page ([Link]):


Home page me Hero section hota hai jaha introduction diya jata hai.
<section class="hero">
<h1>Hello, I'm <span>Your Name</span></h1>
<p>Web Developer</p>
</section>

About Page ([Link]):


Is page me student apna introduction aur skills explain karega.
<section>
<h2>About Me</h2>
<p>Short introduction here</p>
</section>

Portfolio Page ([Link]):


Is page me projects cards ke form me show honge.
<section>
<h2>My Projects</h2>
<div class="project">Project 1</div>
<div class="project">Project 2</div>
</section>

Contact Page ([Link]):


Contact page me form ka basic structure hota hai.
<section>
<h2>Contact Me</h2>
<form>
<input type="text" placeholder="Name">
<input type="email" placeholder="Email">
<button>Submit</button>
</form>
</section>

Note for Students: Pehle sirf HTML likho, layout aur design baad me CSS se hoga. Har page ko
same header aur footer ke sath banana zaruri hai.

You might also like