Instructions
Use the following jpg images: maternity_desktop.jpg maternity_mobile.jpg
as comps for the desktop and mobile layouts.
Included in the folder are some hi-res photos of the models and the hero photo for desktop and mobile.
- Create a responsive 1 page website with this layout. You may cut the images any way you like. The circle photos can be cut from the comp.
- Please use the desktop comp layout for desktop and tablet layout. Mobile comp for the mobile phone layout.
- you can assume that the web page maximum size is 1300 pixels across and for wider browser sizes you can just center the whole page.
- For smaller sized browser windows, you may scale the images down to fit the page
- for very small tablets sizes, you can just use the mobile layout (I leave it up to you which break points you want)
- It must look good on most popular browsers (Chrome, Firefox, Safari (mac only), IE 11 and above iPad and iPhone). Assume the latest version for now.
- There's no javascript functionality
- don't worry too much about image quality, I wasn't able to provide truly high quality photos that will look good on iPhone and iPad.
- For fonts, use Helvetica or Arial and try to match it as best as possible. I'm not too worried about font accuracy.
I'm really looking for responsive layout and page performance as well as cross browser compatibility. It should match the comps as much as possible.