Discussion on "How I Built My Perfect Score Portfolio Website"

Jemima Abu · 2021-03-31T09:07:58.855Z

I recently published the fourth version of my portfolio jemimaabu.com. With this version, I tried to make the code as performant and accessible as possible but still have an interactive site, so this article will be about how I managed to achieve th...

I've also developed one for myself but yes, your looks better and classy.😁

Great portfolio website! I am so in love with the design, especially the colors :D I am so thrilled when i scrolled down, the icons bounced so nicely

😊 thanks, the icons are also one of my favorite parts

Thank you for sharing your experience! I've been procrastinating on my portfolio for months now going down wormholes of frameworks and different designs. This was informative and inspiring for me to focus on building an accessible site with the basics!

Thanks so much, I'm glad you found it helpful. Best of luck with building your site 😁

Really good work! I’m personally working in React for the time being therefor cutting on some libraries and files is not really recommended but React as a default makes sure to load only necessary files. Amazing scores! Congratz! Really brave to try this out in Vanilla Js due to crazy amount of libraries today to make work faster.

Thanks 😊 good point about React

Congrats on getting all those green 100's! 👏

Great job Jemima, but that being said you shouldn't only trust in the lighthouse! Actually, I find several issues on your website! For example the "iframe loading" is not supported by the Firefox and Safari prove: caniuse.com The "meta theme color" almost only support on Chrome (so your multiple color themes is useless at this point!) prove : caniuse.com

Scripts are not minified!

Thanks for the feedback Masih :)

The meta theme color only changes the color for the meta theme but it doesn't affect the rest of the page. Lazy loading of the iframes is just an added benefit for browsers that support it.

Hope that clears things up.

Great job! Thanks for sharing! Quick question, is this not apply for PageSpeed Insights?

developers.google.com/speed/pagespeed/insights

Pagespeed and Lighthouse process scores differently.

Since I have a lot of third party code, like analytics and YouTube embeds on the landing page, Pagespeed takes the load time for those elements into consideration as well. Lighthouse focuses more on a well-rounded audit based on different paramaters.

You can read up more in this article: pagespeedplus.com/blog/pagespeed-insights-vs-ligh…

Your portfolio looks wonderful! Thank you for sharing, I am yet to complete my portfolio this helps a lot.

Thanks 😊 I'm glad it helps

After playing around with your portfolio yesterday, I was really thrilled by how everything worked.

The color themes were great, especially the neon theme, that's my favourite.

I'm glad you wrote this article explaining you process of achieving the portfolio, now I know why you choose not to use a library/framework.

Thanks a lot, I'm glad you enjoyed the article 😊

Very insightful article and the portfolio looks great! Well done Jemima Abu

This is great work, Jemima Abu. 🙌

Search Hashnode

How I Built My Perfect Score Portfolio Website

Responses11