A: On the benefits of Responsive Web Design:
1) Using responsive CSS techniques enables a designer to create web page layouts for devices of seemingly innumerable sizes and specifications. For example, media queries test devices for a device's width, resolution, height, orientation, and much more. Fluid grids can be implemented, which change layout elements of a page to suit the user. The eyes rejoice.
2) Learning about responsive web design doesn't have to cost a dime. There are oodles of resources on the web with all manner of helpful studies, tutorials and walks-through.
3) Devices and browsers can often be detected, while other design-relevant factors can be gleaned with some
cleverness. If done, the experience for the user can be improved through conditional comments. As a bonus for the system operators, much data can be gleaned about a user from a mere page hit.
4) In Ethan Marcotte's article, he assigns responsive web design the ideal of interactive
architecture to argue for an adaptive approach in which the user and inhabitant mutually influence each other, citing
architectural writers Michael Fox and Miles Kemp, who favor: "a multiple-loop
system in which one enters into a conversation; a continual and
constructive information exchange." But how? Marcotte asks rhetorically. It turns out we have answers, replete with numerous difficulties.
B: On the Difficulties:
1) Each of the myriad technologies comes with a learning curve. The tech is quickly changing; "our work is defined by its transience, often refined or replaced within a year or two." What technologies will stay relevant is unknown.
2) CSS media types let designers target specific classes of mobile devices, but they have numerous problems, some of them possible deal-breakers. Browsers and devices have "not fully embraced" media types, much to the difficulty of the designer. The bevy of acceptable types means that the browser/device often ignores entire classes.
3) Designs that rely on fluid grids and flexible still work only within the intended context, which has often been desktop-centric. The threshold Marcotte gives is 800x600, under which many designs fall apart. Widescreens can render poorly with these techniques, too. Building for more contexts takes more work.
4) Legacy browser support for media queries is hard, imperfect, and requires JavaScript in certain cases. There are plug-ins and libraries to help with this, but there are still many considerations and design choices to be made if legacy browser support is desired.
C: Here are the next four things I must study hard:
1) LESS CSS Tutorial: Slick Menu Nav Bar
2) WC3's Cascading Style Sheet docs
3) Getting Started With Twitter Bootstrap
4) Fluid Grids by Ethan Marcotte
D: I would like to read these next four tutorials (from among these thirty), but time will tell where my priorities are when I am done with the first four:
1) Responsive Resume by Jake Rocheleau
2) How to Turn Any Website into a Responsive Site by Rochester Oliveira
3) Responsive Web Design With CSS3 Media Querues by Ethan Marcotte
4) Fluid Images by Ethan Marcotte
Design has
always been something I've enjoyed, so I relish the opportunity to study
it in an academic setting. There is a blinding number of technologies
involved in the front-end. Even deciding on a
toolchain is a considerable undertaking; learning to use it well is harder altogether. I have never taken a class on design, although I have hacked away on
various sites and pages. Luckily, I am comfortable enough with
HTML and CSS to begin on their intermediate features. While there is a big set of disciplines
required to do great web design, uniting the disciplines will be a
function of time, attention and drive to learn.
No comments:
Post a Comment