Hi guys,
I'm looking for feedback on my newly created personal website.
You can find it here: https://website-thomas.thomasledoux1.now.sh.
The source code can be found here: https://github.com/thomasledoux1/website-thomas
Quick preview: 
It was created with NextJS, I wrote some custom animations, used React Hooks, used some illustrations from unDraw, lazy loading for the images, and other speed optimizations.
It's currently lacking a resume section, this will be added in a later stage, I'll create it from scratch in HTML and provide a PDF download option for it.
Any other suggestions/remarks are more than welcome!
If you have any questions about how I implemented something, I'll gladly elaborate :-).
Thank you!
Discussion (9)
It's definitely a good start!
I highly recommend you use an HTML validation service. There are some errors that you should fix.
You can also use PageSpeed Insights to identify performance bottlenecks.
Hero banner and Personal
Starting at the top, I'd say the biggest issue is that there's too much whitespace in the hero banner. This'll be worse on bigger monitors, so I have two recommendations: Center your page, and consider using a darker navbar. The white bleeds into the white background and doesn't convey a sense of elevation very well. As you scroll, it does become transparent, but dark on light may look better.
Since first impressions can make a world of difference, I'd recommend moving your headshot to the hero banner so people immediately see you and associate your name with your face. Don't use faceless images/drawings. They look great, but they're never a good replacement for the real you!
The typewriter effect can be hit or miss. I don't personally like it because I get impatient waiting for it to cycle through all the options, but it depends on the user.
Projects
@~AlleAmiDev~ noted some improvements you could make to the portfolio section. I noticed your images are lazy loaded, and one of the errors noted in the W3 HTML Validator tool is that your images lack
srcattributes.I ran into this issue myself when adding lazy loading to my blog. The solution is to set the
srcattribute to a blurry, low-resolution placeholder image. I created a Python script called thumb that can do this for you, if you're interested. Then, simply insert the "real" image with your intersection observer and remove the placeholder.Also, the link on each card doesn't look too good in the bottom left; consider linking the entire card so people can just click on it (better UX, imo).
Contact
Same issue of sparseness/whitespace. You can add a free contact form to your site with something like Formspree to beef up the content there.
Consider coloring in the social media icons so they look more vibrant.
I don't personally like the arrow; I'd remove the unnecessary
titleattribute that appears when you hover over it, and probably just get rid of it altogether unless you can add an arrowhead to make it clear.I hope you find this feedback helpful! Good luck with your site :)
Hi Aleksander,
Thank you for the elaborate feedback!
Much appreciated.
I agree with your remarks, and I will see how I can best implement them into my site.
As for the arrow: something must have broken in my last commit, normally the arrow is animated and the arrowhead appears. Once this actually works I think it's a good addition to the website.
I'll comment here again when I updated my site, so you can maybe have a second look :)
Thomas
Np!
Hey Aleksandr,
I updated my website with most of the comments you gave. You can check it on the URL I provided before :)
Well done! The site looks much better now, imo.
I would say the strongest part visually is your contact section; the colors there play really well with each other, and things are laid out responsively. Looks very balanced overall.
Hero section is still a little sparse, but that's okayāputting your headshot there was definitely an improvement!
Edit: One thing you may want to consider is increasing the height of the message text area for your contact form (for UX). But otherwise, it looks great!
Nice feedback~!
Hi Thomas :)
I had a quick look at your website and wanted to point out a couple of things. First of all, the first time the user scrolls through your portfolio carousel, the logo images are not visualised immediately. They take a couple of seconds to load. I would look at a way to preload them or hide them until they are loaded. Something like that would not go unnoticed by someone evaluating your skills.
Furthermore, I'd extend your portfolio with some use cases, screenshots of the apps you developed, etc. I guess people want to see what you've done rather than just who you worked for.
Hope I've been helpful :) If you need anything else, drop me a message!
Alessia
Hey Alessia,
Thank you for the feedback!
I will take it into account and do the necessary changes :).
Thomas
Kitze roasts a site (gives honest feedback) weekly on Twitch.
You can leave a comment in weekly post on twitter.com/twiwdev by requesting to to "roast" (asking for a feedback) your site and how you can update it :)
This week's stream is over, so you might go for the next week's