Restaurant Website Research

High Leveal Approach

Make a restaurant site that is device-agnostic and device-aware — it not only will it be accessible from any device, but it will tailor itself to the capabilities, limitations and contexts presented by each device. I will be redesigning the site for Lotsa Pasta. It is a local restaurant in a small town, and wants to emphasize that they are "Authentic Italian Food." I will be using a mobile-first approach: to design the site for a mobile screen first, and then creating a responsive version for the web. I want to go for a simple and straightforward that is easily usable.

Pages

Home Page

Menu Pages

About Us

Contact Info

Responsiveness

Need to know the breaking points and width limits of each browser size (mobile vs tablet vs laptop, etc). Should have a fluid grid system that is designed in percentages and ems rather than absolute numbers/pixels. Need to know how things stack. Some things will have to grow larger in proportion (for example: the text stays the same as images grow smaller - changing ratio of text to image so that the text is still readable and images can actually fit on the screen)

Also need to design for both portrait view and landscape views on mobile devices.

Make sure buttons are big enough to easily click on for mobile devices.

May have to edit down content to the essentials for mobile device since there is less room.

Examples of Responsive sites: