Portfolio Website (v1)
A fully hand-coded portfolio website built with HTML and CSS to establish a strong foundation in semantic markup, responsive layout, accessibility, and maintainable front-end architecture.
Overview
This project represents the first full version of a personal portfolio website built entirely with hand-written HTML and CSS, without frameworks or site builders. The goal was to develop a strong foundation in front-end fundamentals before introducing abstraction layers or JavaScript frameworks.
The site is designed as a long-lived, self-hosted project and serves both as a professional portfolio and a learning platform. Emphasis was placed on semantic structure, accessibility, responsive behavior, and a scalable CSS architecture that can support future iterations.
Tech Stack
- HTML
- CSS
- Responsive Layout
Highlights
- Built a fully responsive portfolio using semantic HTML and modern CSS.
- Designed a custom CSS architecture using tokens, layouts, utilities, and BEM-style components.
- Implemented consistent spacing, typography, and color systems using design tokens.
- Focused on accessibility with proper landmarks, heading hierarchy, and keyboard navigation.
- Structured the site to support long-term iteration and versioned future rebuilds.
- Deployed the site as a self-hosted static application served through Dockerized Nginx.
Next Steps
- Introduce JavaScript for progressive enhancement and interactivity.
- Refactor styling into a utility-first or component-driven system in a future version.
- Explore build tooling or frameworks (e.g., React) while preserving accessibility and performance.
- Maintain older versions as historical references to document skill progression.
- Continue improving SEO, performance, and content structure as the site evolves.