Pat Skot Logo
Screenshot of personal portfolio website homepage

Personal Portfolio Website

April 15, 2025

Client: Self

I designed and developed this personal portfolio website to showcase my work, share my thoughts through blog posts, and provide information about my skills and experience.

Project Goals

The main objectives for this website were:

  1. Create a clean, modern design that focuses on content
  2. Ensure excellent performance and accessibility
  3. Build a platform that's easy to update and maintain
  4. Implement responsive design for all device sizes

Technologies Used

  • Eleventy for static site generation
  • Tailwind CSS for styling
  • JavaScript for interactive elements
  • Markdown for content management
  • Netlify for hosting and deployment

Design Process

I started with sketches and wireframes to plan the layout and information architecture. The design focuses on typography and whitespace to create a clean, professional appearance.

I chose Space Grotesk as the primary font for its modern, distinctive character that balances professionalism with personality.

Development Highlights

The site is built with performance and maintainability in mind. Some technical highlights include:

  • Perfect Lighthouse scores for performance, accessibility, and SEO
  • Custom Eleventy collections for projects and blog posts
  • Optimized images and assets
  • Minimal JavaScript for fast loading times

Challenges and Solutions

One challenge was balancing visual interest with performance. I addressed this by:

  • Using SVG for illustrations and icons
  • Implementing lazy loading for images
  • Minimizing third-party dependencies

Results

The final website provides a clean, effective platform for showcasing my work and sharing content. It loads quickly, works across all devices, and is easy to update with new projects and blog posts.