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

Post a Comment

Popular posts from this blog

House Project

  In this project we used SketchUp to create a house from a floor plan. You first create a rectangle the size of the floorpan. Then you Make the roof. The hardest part was the patio because of all the spacing between the bars.
Post a Comment
Read more

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.
Post a Comment
Read more

About Me Reflection

1.  I enjoy seeing how code turns into a good looking site. I like hand coding some but prefer to use the Dreamweaver tools. 2. 3.  HTML/CSS Responsive Design Wireframe Web Animation (some) Wordpress (some) Bootstrap UI Javascript (some) PHP Database (some) 4. https://www.potatogoodness.com/potatoes/ https://www.apple.com/ 5. Dreamweaver Illustrator 6. Setting up a web server
Post a Comment
Read more