My Final Project on Github


#1



Hi there,

Here is a link to my final project:
https://cree8002.github.io/

Sharing and also you can add feedback.

Thanking you


Replace this line with your code.


#2

Looks very good!

Nice blend of images, colours, and text. 2 suggestions for you, if you can figure them out...

  1. Add a fixed navbar, so as you scroll through the page, your navbar stays with you, allowing you to click a link anytime you want, without being at the top. (Investigate position:fixed to do this.)

  2. Add something called smooth scrolling, so that when you select an internal link bringing you to another part of your page, it will scroll there, instead of just jumping. This gets into a little more of an advanced topic, called JQuery. (This page might help you.)

Nicely done on your project, and I wish you happy coding in the future. Enjoy!


#3

Fairly good overall, but a few things I noticed:

The website doesn't pass Google's responsiveness test. This is the biggest issue imo. Try adding this in the head and then see if the font is more readable on a mobile:
<meta name="viewport" content="width=device-width, initial-scale=1.0">
The above line should be in all websites to help them work on mobile.
I'd also recommend looking into media queries. Over half of internet traffic is on mobile devices, and media queries are important in making websites work well on different screen sizes.

I used an HTML validator to look for errors (https://validator.w3.org). The images are missing alt tags, and there's also some tags which aren't closed.

I'd also recommend an image compressor to reduce the size of your photos. It will make a big difference to the load time. eg http://compressjpeg.com

The black text will be a bit hard for some people to read against a black photo.

I think the CSS looks tidy overall, although I did notice a bit of repetition as you declared the font-family and weight multiple times. If you can just declare the identical fonts once it will make it easier if you need to change the font in the future. eg:
h1, .col-md-4 ul li, .supporting h2, .supporting p, .main h2, .main p, .footer p, .footer a {
font-family: 'Acme', sans-serif;
font-weight: 600;
}


#4

Thank you both,

The fixed nav bar is a nice touch isn't it 825orion?

Andrethedrummer1, yes, I only realised about the issues with mobile responsiveness after we pushed it up to Github. I agree with you that's the biggest issue at present. Also realised about the non-existent alt tags too!!

Great tip re: the single declaration of the font-family and font-weight....along with image compression.

Thanking you :slight_smile: