DEV Community

Punitha
Punitha

Posted on

Portfolio Website HTML Page

Step 1: Create the HTML Structure

<!DOCTYPE html>
<html>
<head>
</head>
<body>
</body>
</html>
Enter fullscreen mode Exit fullscreen mode

Step 2: Add Meta Information

<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
Enter fullscreen mode Exit fullscreen mode

Step 3: Link CSS and Icons

<link rel="stylesheet" href="style.css">
Enter fullscreen mode Exit fullscreen mode

Step 4: Create Navigation Bar

Menu Items

About 
Skills 
Projects 
Education 
Contact
Enter fullscreen mode Exit fullscreen mode

Step 5: Create Hero Section

Hero Section

Profile Photo 
Name 
Job Title 
Technical Skills 
Resume Download Button
Enter fullscreen mode Exit fullscreen mode

Step 6: Create About Me Section

Provides information about educational background and career interests.

Step 7: Create Technical Skills Section

SQL 
Power BI 
Excel
Python 
MySQL
Enter fullscreen mode Exit fullscreen mode

Step 8: Create Projects Sections

  • Retail Sales Analysis Dashboard

  • Pharmacy Management System

  • Event Management System

Step 9: Create Education and Languages Section

  • Education details and language proficiency were displayed.

Step 10: Create Content Section

  • Email Address

  • Phone number

  • Location

  • LinkedIn Profile

  • Gitlab Profile

Step 11: Create Footer

A footer was added at the bottom of the page.

Top comments (0)