Personal Portfolio Website

A basic personal portfolio website created using HTML and CSS.

This project was developed while learning front-end web-development fundamentals. It presents my introduction, education, technical skills, projects and contact information through a structured and visually styled webpage.

Features

• Personal introduction
• About-me section
• Education information
• Contact information
• Styled navigation
• Custom colors and typography
• Organized page layout
• Hover effects

Technologies Used

• HTML5
• CSS3

Concepts Practised

HTML

• Basic document structure
• Semantic HTML elements
• Headings and paragraphs
• Links and images
• Lists
• Forms
• Page sections and navigation

CSS

• Selectors
• Colors and backgrounds
• Typography
• Margins and padding
• Borders
• Width and height
• Element alignment
• Hover effects

Project Structure

basic-html-css-portfolio/
├── index.html
├── style.css
├── README.md
├── LICENSE
├── images/
│   └──profile.png
    └──bk img.jpg
    └──cover1.jpg

How to Run

No installation is required.

1. Download or clone the repository.
2. Keep index.html and style.css in their correct locations.
3. Open index.html in a web browser.

The website can also be opened through the Live Server extension in Visual Studio Code.

What I Learned

This project helped me understand how HTML provides the structure of a webpage while CSS controls its appearance and layout. I practised styling page sections, organizing content, adjusting spacing, selecting colors, and creating a consistent portfolio design.

It provided a foundation for learning responsive design and JavaScript.

Future Improvements

• Improve mobile responsiveness
• Add JavaScript interactions
• Add project screenshots and links
• Add a downloadable CV
• Create a functional contact form
• Improve accessibility
• Deploy the website using GitHub Pages

Author

Talal Nasir Computer Science Student

License

This project is available under the MIT License.