Week 2 Outside of Class

Outside of class I read "Build a Basic Responsive Site with CSS." Here are my notes:

• It’s not about making sites for mobile devices, it’s about adapting layouts to viewport sizes
• It’s becoming increasingly important to understand that a website should not be specifically about either the desktop or the mobile device, but about building in such a way that its layout adapts to varying viewport sizes
• One of the main reasons media queries have become more popular is the fact that websites are unusable on devices they weren’t considered for during design and build phases
• Many sites using media queries strip out information, hiding certain aspects of the site that they deem less important
• So the user with a smaller device gets an easier to use website, but with stripped-down content.
• A responsive site doesn’t necessarily have to be targeted at mobile devices; if it’s built correctly it doesn’t have to be targeted to any particular device
• The key element of flexibility in responsive design is a fluid layout width
• When it comes to the CSS, setting a max-width is a good idea in order to stop the site scaling across enormous screens – and this won’t withhold the page from shrinking
• One main issue when switching from fixed widths to fluid is images
• The simple fix for this in your CSS. Just set your image’s width to 100%
• Just be sure your image’s max-width doesn’t exceed the max-width of its container – otherwise it may pop outside

MAIN NAVIGATION SWITCH

• The main reason that you may want to switch the navigation is because the scaling down could become unreadable and hard to click
• FlexBox provides a method of automatically resizing elements within their parent without having to calculate height and width values
• As well as dynamically changing an element’s size, FlexBox can also apply properties to a parent that control where any empty space is distributed

I also decided that I am going to work in a group with Megan and Nicole on the event website.