Page 246 - DCAP109_GRAPHIC_TOOLS

Unit 10: Working of Web Designing

Notes

Task Try out other controls like checkboxes, radio buttons, etc. and create a student
registration form for a school.

Self Assessment

Fill in the blanks:

13. HTML …………………… are useful when we need to collect some data from the site
visitor.
14. …………………… input controls are created using an <input> element whose type attribute
has a value of text.
15. You can create clickable button in HTML using …………………… tag.

Case Study Responsive Web Design – Zee

ast week we launched the new Zee website – Zee is my company here in Brazil. We
did the site in a single page, presenting the company, our works and keeping the
Lfocus on content and in a simple design. I decided to write this case study because
the main challenge we faced was to develop a totally responsive site, and since lately this
is a strong web subject, I decided to show how was the creative process of the new Zee
layout.
I know this matter is all around the web, but a definition about responsive design always
come handy:
Responsive Web Design (RWD) essentially indicates that a web site is crafted to use CSS3
media queries, an extension of the @media rule, with fluid proportion-based grids (which
use percentages and EMs instead of pixels), to adapt the layout to the viewing environment,
and probably also use flexible images. As a result, users across a broad range of devices
and browsers will have access to a single source of content, laid out so as to be easy to read
and navigate with a minimum of resizing, panning, and scrolling. - Wikipedia

Summarizing: 1 code, 1 CSS and a fluid and optimized layout to all devices.
This is not a tutorial about developing a responsive project, is a case study. But there are a
lot of articles and books about this, so here are a few references:·

z Livro: Responsive Web Design, de Ethan Marcotte
z Build a responsive site in a week: designing responsively – .net magazine
z Responsive Web Design: What It Is and How To Use It – Smashing Magazine

z Responsive Web Design Techniques, Tools and Design Strategies – Smashing
Magazine
z A Primer on Responsive Design: From Content to Development – UX Magazine

Contd...

LOVELY PROFESSIONAL UNIVERSITY 239