MeetMe is a personal portfolio and résumé website template for designers, developers and freelancers, built on Bootstrap 5, with a purple-to-blue gradient and Heebo headings. The layout is responsive and mobile-ready and works in all popular web browsers. It comes with seven pages: home, about, services, portfolio, blog, blog post and contact, plus an elements page.
The home page opens with a profile card (photo, name, short intro, contact details and social links), followed by an about section with figures and animated skill bars, experience and education tabs on a timeline, service cards, a filterable project gallery with a lightbox and a testimonial slider. The blog has a sidebar with search, an author card, popular posts, categories, a newsletter box and tags, and the post page adds comments and a comment form. The contact page has contact details, a working contact form and a map that loads on click.
What’s new in 3.0
Bootstrap 5.3.8 (the earlier release used Bootstrap 4.1 and jQuery), compiled from Sass together with the theme and the original Bootstrap 4 proportions, and plain JavaScript with no jQuery. Swiper 14 replaces Owl Carousel on the testimonial slider, a small built-in filter replaces Isotope, PhotoSwipe opens the project images, built-in counters and skill bars replace CounterUp and Waypoints, and styled native selects replace Nice Select. npm run build (Dart Sass and esbuild) compiles one minified stylesheet and one script.
Lighter pages: all eight pages together went from 13.8 MB and 364 requests to 5.7 MB and 181 requests. Every photo has an AVIF version with the original as the fallback, real dimensions and lazy loading below the first screen.
No third-party requests: Heebo and Roboto are self-hosted, Lucide SVG icons and a small social-logo subset replace the Linearicons, Flaticon and Font Awesome 4 icon fonts (the Twitter bird is now the X logo), the contact map is an OpenStreetMap that loads only after a click, and a Google Analytics 4 snippet stays commented out until you add your own ID.
Working forms: the contact form, the blog comment form and the newsletter boxes send through php/send-email.php, with validation, a spam trap and an in-page message.
Accessibility: a skip link and a main landmark on every page, one h1 per page, visible labels on the contact and comment forms, names on icon-only and image links, labelled skill bars and ratings, a keyboard-operable project filter, visible focus rings and WCAG AA text contrast, with a deeper brand gradient so white text stays readable on it.
SEO and fixes: a title and description for every page, Open Graph and Twitter tags, Person structured data, the current page marked in the menu, broken links to a missing blog page fixed, and fictional names, contact details, jobs, services and testimonials in place of repeated placeholder text. The documentation page is generated from the README.