Responsive Design on the Web

   Responsive Design is a technique that web designers use to make a website look good not only on an ordinary computer screen but also on a tablet or a smartphone.  In my last blog post, I explained that the number of mobile users are increasing at a steady rate each year so as a web designer, it is important to make my site look appealing on a mobile device as well as a computer because more and more people around the world are beginning to use their smart phone to access the web.
 
   To make a website responsive, one must simply edit the CSS and insert media queries.  Media Queries are guidelines the website follows to tell how big to make certain parts of the site so if I am viewing a website with the resolution of 1024x768 the banner image will be one size but I'm looking at the same site on my mobile phone with the resolution of 468x360 the banner image will be much smaller and the picture itself may even be different.  The points where the CSS triggers these changes are called breakpoints
Lets take a look at an example of responsive design

 Here is a screenshot of website from the UK.  Goofy right?  Stuff and Nonsense is actually a site where you can send your own website in to them and they will help you make your site responsive.  Right now, the screen is at its biggest and what do we see?  The banner image expands through the page and covers up a lot of the screen.  The text in body and the menu bar are fairly large and spread out.


Now lets shrink the screen a little bit...

What happened?  Well, as the screen got smaller and squeezed the banner image so that it takes up more space on the page.  If you notice, the image changed as well.  Nothing else really changed with the text and the menu besides the fact that it just got smaller but proportion wise, nothing really changed .





And even smaller...

The biggest change happens when the screen is shrunk to its smallest.  The banner image changed once again and the menu bar disappeared.  This version is simpler and throws all of the important information at the viewer right away because most people that visit websites on their mobile phones want to quickly search for the info they need rather than look through the page.

Desktop vs. Mobile; Global Trends

   From the beginning of the school year in 2012 to the 12th of March in 2015 the number of mobile users increased from 20,379 users to 44,359 users.  That's an increase of 23,980 in just three years.  So what?  This shows the steady increase of people that are using their mobile phones to access the web than desktop computers and laptops.  

Interview- Stockton Grunwald

---

Informal Interview with Makenzie Votaw

---

Lego Day!

Reflection Coming Soon to theaters and IMAX

---

2014 Blood Drive

Reflection Coming Soon to theaters and IMAX

---

Internet Hoaxes

Internet Hoaxes

    This project was our first project that  used our web template to create a larger multipage website.

Process

     We started out with our template we had made earlier in the week.  This template is basically a shell containing all of the HTML and CSS needed to shape the website into what it needs to be.  All I have to do is change the colors for in the CSS and enter in the content as well as touch up the HTML if needed and the website is complete.  

Looking Ahead

     This project exposed a lot of weaknesses with my web designing but it also project my strengths as well.  Weakness wise, the coloration of the website isn't the best and I had trouble getting the links to behave the way I needed them to.  As for my strengths in this project, I felt that in general I have a basic understanding of HTML and I do know what i'm doing most of the time.

Conclusion

     In conclusion, this was a old project.  It used the template in which we built by ourselves and it added in all of the skills we had previously accumulated from the earlier projects and it created a fully functioning website.

---