What are you most proud of, and what would you do differently next time?
Although the responsive design works across desktop, tablet and mobile as it reaches the breakpoints I would make it more responsive so the images and text change in size between designs.
What challenges did you encounter, and how did you overcome them?
I had some issue with the source and the srcset attribute not loading the correct size images, only used these once or twice so I'm still getting my head around the how they fully work. I've had issues before where it doesn't load but have read sometimes the image gets cached and doesn't load the alternative one when it should. This method doesn't seem that reliable...
What specific areas of your project would you like help with?
In the screen shot it seems to be loading the tablet image but seems to work fine when the site is viewed in a browser, Any ideas as to why this is? Thanks...
I am very impressed with the accuracy of your solution with the design, it is a really meticulous work. ////
The transitions work but are a bit abrupt on intermediate screen sizes. I do not place the transition points like you. The goal is to design for 3 screen sizes, 1440px, 768px and 375px. In my opinion this does not mean that the transitions of the media queries must be made at these values. I would have placed them for example at 1000px and 500px. The desktop (1440px) is greater than 1000px, so well designed - the tablet (768px) is between 1000px and 500px, so well designed too - and the phone (375px) is less than 500px, so well designed as well. Choosing transition points between the screen sizes for which we design allows a smoother transition in my opinion. //// I did not succeed to manage the different image sources for the hero like you. Instead I inserted all the hero images in the html file. Then in the css file I displayed or hid the images according to my need with the function {display: block} when I want the image to appear and {display: none} when I want to hide the image. I don't know if it's a good coding way but it makes things extremely simple. // Finally, I have no idea what's going on with your screenshot, but on a web page your site works perfectly! Very good work, keep it up!
Your code seems pretty clear, but I think less block would have been possible. The more blocks there are, the more difficult the code is to read.The design is good. The site is responsive. To go further, I suggest adding media queries to target intermediate screen sizes, this allows for better rendering on a majority of screens. Good job, keep it up!
Well done ! Your code is pretty clear !
But your solution is not perfectly responsive. Indeed on screen sizes between 1440px and 375px we must scroll horizontally to see the content. I grant you the goal was to design a responsive page for only two screen sizes, however I suggest you practice developing responsive pages for intermediate sizes as if it were a real-life project. This is good training.
I would also suggest using units like "em" or "rem" instead of "px", and especially "rem" for font-sizes.
I have no advise to say since your coding is more advance than mine.
The way you established your Custom Properties is interesting, I need to learn from that.
