All solutions

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...

What are you most proud of, and what would you do differently next time?

I'd think about using grid next time for the layout...

What challenges did you encounter, and how did you overcome them?

Just working with the background images and positioning, researched and learned more about background images etc.

What specific areas of your project would you like help with?

Any feedback always welcome, thanks...

What are you most proud of, and what would you do differently next time?

Mobile first design...

Next time I would probably experiment and try grid areas.

Maybe I’d include more breakpoints in the media queries as it goes straight from mobile to desktop and back. I never thought much about changing the design for tablet size, although the mobile will show and work ok.

What challenges did you encounter, and how did you overcome them?

I enjoyed getting to grips with grid and found it tricky on the as desktop layout at times but enjoyed the learning process.

What specific areas of your project would you like help with?

Any feedback and suggested improvements always welcome, thanks...

What are you most proud of, and what would you do differently next time?

I tried to match to design as close as I could....

What challenges did you encounter, and how did you overcome them?

I normally use felxbox for positioning but plan to use grid more. I made a grid with three columns and as there were 4 cards it automatically added a row which I didn't want. As a solution I wrapped the middle two cards in a div which seemed to solve the problem as it pushed the two middle cards into the middle column and got rid of the row.

What specific areas of your project would you like help with?

Any feedback / constructive criticism always welcome...

What are you most proud of, and what would you do differently next time?

I tried to get it as close to the design as I could, it's not 100% the same but fairly close I think...

Next time I'd probably spend more time trying figure out how the picture and source tags worked and use them in the code.

What challenges did you encounter, and how did you overcome them?

I found changing the images from mobile to desktop more challenging than I thought it would be. I found various ways this can be done, setting the images as a background images and changing with CSS but realised it's not really a good practice if the image is considered part of the content.

Also discovered the picture tag, source tag and the srcset attribute which can be used to select images based on screen width and more, but apparently not all browsers support this and also read about browser cache issues and not loading the alternative image/s when needed?

In the end I went for putting both images in the html and using display:none; on the desktop image when in mobile size and then toggling them when needed within the media query.

Seems to work but not sure if this was the best solution?

What specific areas of your project would you like help with?

Any feedback, pointers and suggested improvements are welcome... Thanks.