My Personal Portfolio Project | Adi G Lase

Finally my latest projecft in RWB Certification. You can visit it here https://adiglase.github.io.
Feedbacks are welcome!!!

~ In case my critiques are due to my system, I’m running Windows 10, Google Chrome, Screen Res: 1920/1080

Wow this is a really great go at it, and I love the landing design! There are a few things I noticed in just a couple minutes that detract a little bit from all the great stuff though:

  • I’ll start with the links at the top left

    • When you hover over them, they’re a bit janky and jerk around. It’s not a major issue because they don’t move to where you can’t click them, but it’s more an aesthetic detail.
    • On the topic of being able to click the links, I like that you put the border around the word being hovered over, but if you move your mouse towards the edge of that border, you aren’t able to click the link anymore. Try attaching your link to the <div> and using CSS to change the cursor to the “pointer” icon when you’re over the “button” entirely.
    • Another thing is the “about” section just redirects to your landing page, which isn’t much of an about section ^^; Let’s hear more about you, what got you into development, how you got where you are today, where you plan on going from here, etc.!
  • The image for the landing page

    • I really like the image, it fits the design really well! The main issue with it though is that it takes a while to load in. The reason this is happening (I took a look at the source) is that you’re loading a gigantic 6000x4000 image in when it’s not entirely necessary to do so. See if you can’t compress the image, as well as reducing the resolution a bit. Sounds daunting at first, but goes miles for image load time.
  • The “Hi, I’m…” text

    • This also looks really nice, however from a UX perspective, it gets in the way of the content when scrolling down on the desktop version. Perhaps adding a media query to have it subtly disappear as the user scrolls past a certain point or having it static next to the image would be better
  • The mobile version - just a couple things here, too.

    • The mobile version responds nicely. There are two major things I would point out though. The first being your landing image and its connection with your about link. When you tap the about link, it goes to the picture, which is a bit jarring to users. The image is also the same large file used to load in the desktop version. My recommendation is to remove the image on the mobile version (or add it as a transparent backdrop to the yellow background with your “Hi, I’m…” text) and flesh out the about section that should go there instead. If you opt to keep the image, it will definitely need to be hotloaded to a much lower resolution.

    • The last and final thing is if you use Google Chrome’s “Mobile viewer” when inspecting the code in the browser, you’ll notice that the website doesn’t render quite correctly for smaller phones, namely the iPhone 5 and iPhone SE. For iPhones 6/7/8 and iPad (original), there is a pixel of space visible at the very bottom of the screen. That one isn’t necessarily that big an issue, but figure I’d point it out.

All in all, I’d say this is a really nice looking portfolio page. It shows almost everything it needs to show without wasting much time on needless fluff or design antics. Definitely better than my first couple of tries!

1 Like

Wow! Thank you so much for your feedback!

Links

  • I changed the hover effect of the links from putting border to changing the background. I think its fixed it.
  • I’ve attached the links to <li>, is it fixed?
  • I’ve changed about to home. Do you think it is good?

Image

  • Omg, i don’t know that the image is that big. I used to host it in my local computer before, that’s why i didn’t notice some lag :smiley:. I’ve compressed it from 5 mb :astonished: to 500kb. What do you think?
  • I choose to make it static. Yea i think it looks better now

Mobile version

  • I choose to remove the image for mobile version. I think it’s the better choice.

Thank you for the effort and time you put to review my portfolio, i really appreciate that!

1 Like

This is wonderful! Every single issue was addressed and changed for the better. In my opinion, this is a great start at a personal site! :smile: The image is still just a tad slow to load, but I’d say it’s at least twice as fast as it was, so I won’t fault you on it! Keep it up; can’t wait to see what else you come up with :grin:

1 Like