Ajay Thapa - Personal Portfolio Website

A modern, responsive portfolio website for Ajay Thapa - Freelancer, Trader, and Health Advocate. Built with HTML5, CSS3, and vanilla JavaScript featuring smooth animations, mobile-first design, and comprehensive SEO optimization.

🌐 Live Demo

Visit: https://ajaythapa.info.np

✨ Features

• Responsive Design - Works seamlessly on desktop, tablet, and mobile devices
• Smooth Animations - CSS animations for enhanced user experience
• SEO Optimized - Complete JSON-LD schema markup for better search engine visibility
• Social Media Integration - Links to Facebook, Instagram, and LinkedIn profiles
• Contact Form - Functional contact form integrated with Formspree
• Fast Loading - Optimized images with lazy loading
• Accessibility - ARIA labels and semantic HTML for better accessibility
• Mobile Menu - Hamburger menu for mobile navigation

📁 Project Structure

portfolio-website/
├── index.html          # Main HTML file
├── style.css           # Stylesheet with animations
├── script.js           # JavaScript for interactivity
├── img/                # Image directory
│   ├── ajay-thapa-profile.png
│   ├── ajay-thapa-about.png
│   └── ajay-thapa-favicon.png
└── README.md          # This file

🚀 Getting Started

Prerequisites

• A modern web browser (Chrome, Firefox, Safari, Edge)
• Text editor (VS Code, Sublime Text, etc.)
• Basic knowledge of HTML, CSS, and JavaScript

Installation

1. Clone or download the repository

   git clone https://github.com/yourusername/ajay-thapa-portfolio.git
   cd ajay-thapa-portfolio

2. Add your images

   • Create an img folder in the root directory
   • Add your images with these exact names:
     • ajay-thapa-profile.png (400x400px recommended)
     • ajay-thapa-about.png (250x250px recommended)
     • ajay-thapa-favicon.png (32x32px or 64x64px)

3. Update contact form

   • Sign up at Formspree
   • Replace the form action URL in index.html:

     <form action="YOUR_FORMSPREE_URL" method="POST">

4. Customize content

   • Open index.html and update personal information
   • Modify social media links
   • Update education and skills sections

5. Open in browser

   • Simply double-click index.html or
   • Use Live Server extension in VS Code

🎨 Customization

Colors

The website uses a pink/magenta color scheme. To change colors, update these CSS variables in style.css:

/* Primary color */
#ff00ee  /* Change this throughout the CSS file */

/* Background */
#0f0a0a  /* Dark background color */

Fonts

The website uses the Poppins font family from Google Fonts. To change:

@import url('https://fonts.googleapis.com/css2?family=YourFont:wght@300;400;500&display=swap');

Sections

To add or remove sections:

1. Update the navigation in <nav class="navbar">
2. Add/remove <section> elements in HTML
3. Update the BreadcrumbList in JSON-LD schema

📱 Responsive Breakpoints

• Desktop: 1200px and above
• Tablet: 768px - 1199px
• Mobile: Below 768px
• Small Mobile: Below 450px

🔧 Technologies Used

• HTML5 - Semantic markup
• CSS3 - Styling and animations
• JavaScript (ES6+) - Interactivity
• Boxicons - Icon library
• Formspree - Contact form handling
• JSON-LD - Structured data for SEO

📊 SEO Features

• Meta tags (description, keywords, author)
• Open Graph tags for social media
• Twitter Card tags
• JSON-LD structured data (Person, WebSite, WebPage, ProfilePage)
• Semantic HTML5 elements
• Optimized image alt texts
• Sitemap-ready structure

🌟 Browser Support

• Chrome (latest)
• Firefox (latest)
• Safari (latest)
• Edge (latest)
• Opera (latest)

📝 Performance Optimization

• Lazy loading for images
• Minified CSS (optional)
• Optimized image formats
• Efficient JavaScript with event delegation
• CSS animations using transforms for better performance

🐛 Known Issues

None currently. Please report issues via GitHub Issues.

🔄 Future Enhancements

• Add blog section
• Integrate analytics (Google Analytics)
• Add portfolio/projects showcase
• Dark/Light theme toggle
• Multi-language support
• Progressive Web App (PWA) features

📄 License

This project is open source and available under the MIT License.

👤 Author

Ajay Thapa

• Website: ajaythapa.info.np
• Facebook: @ajaythapaaa181
• Instagram: @_a.jaythapa
• LinkedIn: Ajay Thapa
• Email: thapaazey181@gmail.com
• Phone: +977-9808967735

🤝 Collaboration

Interested in collaborating? Check out Asbin Thapa's website

🙏 Acknowledgments

• Boxicons for the icon library
• Google Fonts for the Poppins font
• Formspree for form handling

📞 Support

For support, email thapaazey181@gmail.com or reach out via social media.

---

Note: Remember to replace placeholder URLs, images, and personal information with your actual content before deploying to production.