Monday, September 28, 2015

Assignment 1

Learning Web Design Chapter 1-3 Summary


The first chapter of this book starts with a simple yet enlightening look at all the different facets that go into web design. I’ve never given it much thought, and so I just assumed that most sites were designed by one or two people working together. I never realized all the different roles that contribute to a well designed site. I appreciate the way the author addresses the individual who may be interested in web design as a solo developer and how she, the author, tells you the reader the bare basics you will need to get started.

Chapter two gets into some of the background knowledge that one should have if they are considering going into web design. For the most part a lot of this information was review, however, I didn’t know that the first part of a web address was the protocol. It’s also pretty cool to think about how quickly your request hits all the different servers before going to the site you want.

Chapter three gets addresses the fact that although there is only one web there are a multitude of ways in which we access that web and how we access the web will greatly affect the way we view sites. I found it very interesting that responsive web design serves up a single HTML to the viewer and then uses CSS to differentiate based upon screen size. That is actually really cool. Yep, I’m a nerd, those sort of things are cool to me.

Question 1: How does the site know what size screen you are accessing the web with?
Because client-side Javascript code has access to that kind of information.


Question 2: What does the code look like for responsive design?
Found this at http://whatsmyscreenresolution.com/ and pressed ctrl+u to view the page's (client-side) source code, and I got this:

<div class="col-md-4 col-md-offset-2 well"> <h3>jQuery code to get window resolution:</h3> <p class="codeSection"> ; (function () {<br /> &nbsp; &nbsp; &nbsp;$(window).width();<br /> &nbsp; &nbsp; &nbsp;$(window).height();<br /> })();<br /> </p> </div>

No comments:

Post a Comment