NEW ADDRESS AS OF OCTOBER 16, 2017
1627 K St NW, Suite 5034, Washington DC 20006
CSS for Multi-Screen Layouts (131)
Learn to build websites that automatically adapt their layouts to various screen sizes, orientations, and resolutions making your content look its best no matter the device: smart phone, tablet or desktop. In this hands–on class you will use CSS3, media queries, fluid grids, scaleable units, flexible images, fluid type, and more to build responsive layouts that work with myriad viewing devices.
Why is responsive design so hot right now? It saves time and lowers development cost while increasing website effectiveness.
click for infographic
As tablet and smartphone use rapidly
increases, we need to roll with the changes. Websites need to work with screens that are both larger and smaller and come in many different aspect ratios. We even need to instantly accommodate screens that flip between portrait and landscape views.
The old strategy was to create a separate “mobile” design for small screens. This is now both inadequate and impractical. The solution: flexible containers and content that rearranges and resizes to work with all screens.
“So much smarter than building new layouts for every new device that comes out!”
Responsive techniques are relevant to both hand–coded websites and to websites that use a CMS (Content Management System like Drupal or WordPress). These techniques apply to both websites and HTML–formatted email.
This class clearly and concisely presents the website layout methods you must know to create web pages that automatically adapt to many different screens. You will learn the design principles for planning and constructing responsive pages. Learn to use CSS techniques such as fluid grids, flexible images, and media queries. Learn to create tables and menus that function well on all devices. Learn how to make images and fonts responsive. Learn how to add capabilities to old browsers with add–ins like Modernizr.js and Respond.js. Speed work by simulating layouts on multiple screens. Hands–on exercises will give you practical demonstrations of responsive techniques.
Prerequisite: Ability to write HTML and CSS code. Specifically, how to use CSS selectors and DIVs/floats to create 2-column layouts.
If you need a refresher, we strongly recommend first taking these 2 half-day classes: CSS: Selectors and CSS: Layout.
Tweet about this class
this on Facebook |