Greetings
Here's another responsive project of mine that I wish to showcase. This project was for a small airplane insurance company that unfortunately never went live due to things outside of my control. But rather than letting it rot in a desktop folder, I decided to adapt it to show off what I created.
The goal was simple - create a responsive website that could be used on mobile devices by the company's clients. Their clients use this insurance company's website to view documents relating to their particular insurance plans, so mobile design was important. There was also some talk about redesigning a company logo, so please pardon the "Plain-Jane" placeholder above.
This mock-up was approved, and so I created what you see here. I found it appropriate to simplify the website design to eliminate some of the redundant information on the company's existing website. Simple designs have their place, and it's important to eliminate unnecessary elements on a website to ensure the viewers get the information that they need quickly.
Try changing the size of your browser window. You'll note a few things as you do so. The logo and company name text in the header scales according to the available space. The text in the navigation bar will also change size and position while maintaining its legibility. The text in this main content area adjusts fluidly, and the fluffy cloud decorations will change their position and size as space becomes restrictive. The footer text even changes size as the browser window gets narrow.
This template webpage currently uses only one image file: That's right, a
single 2.84 KB .PNG file. Those cute little clouds aren't images - they're generated using CSS3. That
brings this webpage's size to a measly 7.84 KB, ensuring quick loading times for all viewers. Pretty
spiffy, eh?