My First Website! Feedback please

Hey guys! I have been hard at work trying to create my first website. I made it for a fictional sound engineering company called Versai Mastering. I utilized bootstrap 4 for the front end design and coded some JavaScript myself to create the smooth scrolling for the menu as well as making the menu collapse on click for mobile screens.

http://versaimastering.surge.sh

Any feedback is very much appreciated!

11 Likes

Clean n modern UI .looks great well done :+1:

1 Like

Hi! It looks stylishly, really)

Wow! It’s great. :+1: :clap:

Thanks for the positive comments guys! Any constructive criticisms? Would love to know where I could improve

Footer section can be improved, though the overall look is clean. Did you use flexbox in your site?

I used Bootstrap 4 as the front-end framework. This latest version 4.3 uses flexbox in its css architecture. Most of the responsiveness is coded in the HTML though like class=“col-lg-6”.

As for the footer, what kind of stuff could I add? I have the social media icons, but being a fictional website it’s tough to think of other things to include since it all goes no-where.

Thanks for the feedback!

cool bro. it looks nice

Looks Cool.
How much time it took for you to learn all that?

I started learning HTML on Jan 4th. So it’s been about a 3 month journey so far. Diving into JavaScript with everything I have now! Looking forward to learning some more in depth front end development

Your page has almost 17 MB of pictures that are like 6000x4000px, but are displayed as 300px :scream:

Try to load your page with disabled cache, and then try with throttled network (in Chrome: F12 -> Performance -> Network -> select something slow, like “Fast 3G”). Your page will take forever to load.

There are online tools that will resize and compress your images.
For example using this tool: https://www.reduceimages.com, I resized one of your images from 6000x4000 to 600x400 and it shrunk from 2.7MB to 35KB (more than 70x).

3 Likes

small Idea, please keep the - basic, plus and pro tabs under PRICING Tabs, side-by-side, so that user can easily compare with the benefits of each type.

And the facebook, twitter, insta, g+ quick links at the bottom are not redirecting.

Thank you so much @jenovs this is the criticism that I need to know. I have only scratched the surface of page-load speed. I am assuming the page loads quick when I’m building it because I’m on a local host. I will resize my images to optimize my load speed!

Hey there! The site looks clean and beautiful. I would like to add in a few suggestions (personal opinion, not professional advice!!):
1.) You could add in the “active” class in your menu items to show which section the user is currently at. I think that is standard practice.
2.) The boxes in the features, meeting the team and maybe even the pricing session, could use a light hovering effect, nothing too flashy though.
3.) The sections after Features do not have a background. Putting in something instead of the plain white background would be nice.

Overall, it looks awesome.
Keep up the good work!!
Happy Coding!

Thanks to @jenovs I have optimized my images and my page speed score has skyrocketed on mobile from a HORRIBLE 64 to a BEAUTIFUL 97!!!

Thanks to @Jobin1094 for the feedback. I have coded a scroll spy JavaScript into the page so it will switch the active navbar link relative to your position on the page.

I also added a gradient background to the “meet the team” section to cut down on all the plain white background

1 Like

Its beautiful…nice work

Really like the UI . Very clean and beautiful

Looks very good Bro!

Looks Great. Well done!