Skip to main content

Responsive Web Design

You may have heard of responsive web design but not know what it is, the idea of responsive web design is that the site should conform to the needs of the user. In modern society this means making the site able to be resized without losing any functionality. The reason this has become important recently is because more and more people are using the web on their phone and if you want your site to be used you have to make it function on a small phone screen. How web designers accomplish this is by using media queries  to say that if the screen is a certain size then chance the site to look a certain way. The places where the site changes do to the size of screen is called a breakpoint.

Example site: ONW Ravens

 This is the site normally with a navigation bar at the top and a sidebar on the right
 Once it  gets smaller the navigation bar turns into a drop menu and some of the links change places but the sidebar is still there
Once it gets really small the logo is centered and the side bar is gone.

Comments

Popular posts from this blog

New Index Page

Index page link:  http://eravensonline.net/students/823cw21/ In this project we revamped our index page. We integrated things we learned from recent projects. This includes color schemes, depth, and Google web fonts. I used the background to create a good looking color scheme. I used shadows and CSS ribbons to add depth to the site. I chose two google web fonts to add, one for the headings and one for the text.

Smitty's Lawn and Garden website redesign

For this site I redesigned www.smittyslg.com to be a mobile first site. This was a very interesting redesign because it forced me to follow the same content of the old site while having me design it in a way that works on mobile. I can't say that I like doing mobile first but I know it's importance and I should get used to it.

Don't Make Me Think chapter 1

 This makes you think because you can't tell if the logo is or is not a link. Also the titles look like links but are not obvious.  This makes you think because the Bing logo does not look like a link but it is. Also the icons are not standard so you have to think what they are. The red heading looks kind of like a link but it is not clear. The black text does not look like links but it is.