Hey. I’m doing FCC’s beta and i just finished the landing page. I skipped the testing suite because it felt limiting for this project, so i’ll just adapt or create another version whenever the live version comes along. Besides that, i have quite a few questions after finishing this project, it took me about 5 days and while i found most of what i tried to do, some things i’m stilll not very sure about.
What is the minimum width and aspect ratio that most websites support? After 568px it gets quite easy to support, but the difficulty below that is absurd. At 320x it’s almost the effort of making another site, specially when background images are involved.
In media queries i had to set everything to
!importantin order for the mobile-version of the website to work. Is this common practice?
Is it a problem if i don’t use “labels” in an input field? Instead use just placeholder text.
I had quite a bit of trouble in image sizing, how do people usually choose images for a responsive website? Is it one huge image or a bunch of images for each resolution? What i did was look for an aspect ratio that is common enough (16:9), then the images would trickle down properly. For thumbnails i had to manually resize them though, however i’m not sure if that’s common practice.
I tried really hard to fade-in the gallery images, but i couldn’t figure it out how to do it properly. Any suggestions on how to do it? All that i tried ended up messing with the buttons for the gallery, instead of just the background-image.
Besides that, i’d also like to know if there’s anything you’d change about the page, from design choices (fonts, colors, etc) to coding choices (code readability, efficiency, etc…)
Here is the codepen: http://codepen.io/Selhar/full/WRqZjr/
You can view the code here : http://codepen.io/Selhar/pen/WRqZjr/
(responsivity breaks when the length is weird like in the editor view, but i couldn’t find any other scenario where it broke, so i didn’t mind)
Thanks a lot, and sorry for asking so many questions.