Learning Zurb Foundation

Construct cross-platform and responsive web pages with the most advanced mobile-first frontend framework available.

Learning Zurb Foundation

Learning
Kevin Horek

1 customer reviews
Construct cross-platform and responsive web pages with the most advanced mobile-first frontend framework available.
$26.99
$44.99
RRP $26.99
RRP $44.99
eBook
Print + eBook

Instantly access this course right now and get the skills you need in 2016

With unlimited access to a constantly growing library of over 3,500 courses, a subscription to Mapt gives you everything you need to get that next promotion or to land that dream job. Cancel anytime.

+ Collection
Free Sample

Book Details

ISBN 139781782164265
Paperback210 pages

Book Description

Responsive web design is the next big thing in web design right now. It allows you to control and adapt to the user experience across a variety of devices, screens, and resolutions. Foundation is one of the most well-known responsive frameworks available, and allows you to speed up the prototyping, designing, and theming of your web project; as well as allowing you to create your own custom themes to suit your needs. It makes your life easier by giving you a grid, elements, and JavaScript functions that are responsive and easily customized to work with any web or mobile project that arises.

This book starts off with teaching you the basics, and gradually moves on to cover the most advanced parts of this amazing framework. You will learn how to use Foundation to prototype, design, and theme your projects as well as discover how to use the framework with any programming language or content management system.

Table of Contents

Chapter 1: Time to Prototype
Rough wireframing and prototypying
Introducing the framework
Going over the base theme
Referring to the Foundation documentation
Migrating to a newer version of Foundation
Summary
Chapter 2: The Foundation Grid
The Foundation grid basics
Centering columns in the grid
Offsetting the grid
The block grid
Nesting the grid
Setting element position based on screen size
Modifying the base theme and building a demo site
Summary
Chapter 3: Navigation
The simple top navigation bar
Navigation tweaks
Pagination
Let's navigate together
Summary
Chapter 4: Elements
Typography
Lists
Blockquote
V-cards
Buttons
Panels
Pricing tables
Tables
Video
Progress bars
Keystrokes
Label
Summary
Chapter 5: JavaScript
Magellan sticky navigation
Off-canvas navigation
Interchange responsive content
Orbit slider
Clearing
Forms
Form validation
Reveal
Joyride
Accordion
Tabs
Summary
Chapter 6: Testing
Testing IE 6-11
Supporting unsupported versions of IE
Multiple device testing
Summary
Chapter 7: Sass and Foundation
Introducing Sass
Installing Foundation with Sass
Going over the default settings file
Covering the variables
Going over the files
The index file
How do my files get converted?
What is Grunt?
Why is the setup so complicated?
Let's review the JS files
Summary
Chapter 8: Mixins
What are mixins?
Using a mixin within Sass and Foundation
Mixin libraries and other useful mixins
Summary
Chapter 9: Designing Responsive Ideas
Using Foundation for in-browser designs
Building a quick prototype
Reviewing the prototype
Customizing the prototype
Foundation theme
Creating Foundation grids in Photoshop
Summary
Chapter 10: Foundation with Other Tools
Finding a starter theme
Using Foundation with other frameworks
Ideas on how to play nice with developers
Summary
Where to go from here

What You Will Learn

  • Discover how to wireframe and prototype quickly with a one-page website
  • Explore how the Foundation grid works
  • Learn how to use and apply themes to the JavaScript libraries
  • Utilize well-known best practices for testing websites cross-platform and on devices
  • Use Sass to write CSS faster
  • Work with designers and/or developers to communicate how your project should function and flow
  • Learn about the grid, elements, JavaScripts, and how to customize the framework
  • How to use Foundation with web apps and content management systems

Authors

Table of Contents

Chapter 1: Time to Prototype
Rough wireframing and prototypying
Introducing the framework
Going over the base theme
Referring to the Foundation documentation
Migrating to a newer version of Foundation
Summary
Chapter 2: The Foundation Grid
The Foundation grid basics
Centering columns in the grid
Offsetting the grid
The block grid
Nesting the grid
Setting element position based on screen size
Modifying the base theme and building a demo site
Summary
Chapter 3: Navigation
The simple top navigation bar
Navigation tweaks
Pagination
Let's navigate together
Summary
Chapter 4: Elements
Typography
Lists
Blockquote
V-cards
Buttons
Panels
Pricing tables
Tables
Video
Progress bars
Keystrokes
Label
Summary
Chapter 5: JavaScript
Magellan sticky navigation
Off-canvas navigation
Interchange responsive content
Orbit slider
Clearing
Forms
Form validation
Reveal
Joyride
Accordion
Tabs
Summary
Chapter 6: Testing
Testing IE 6-11
Supporting unsupported versions of IE
Multiple device testing
Summary
Chapter 7: Sass and Foundation
Introducing Sass
Installing Foundation with Sass
Going over the default settings file
Covering the variables
Going over the files
The index file
How do my files get converted?
What is Grunt?
Why is the setup so complicated?
Let's review the JS files
Summary
Chapter 8: Mixins
What are mixins?
Using a mixin within Sass and Foundation
Mixin libraries and other useful mixins
Summary
Chapter 9: Designing Responsive Ideas
Using Foundation for in-browser designs
Building a quick prototype
Reviewing the prototype
Customizing the prototype
Foundation theme
Creating Foundation grids in Photoshop
Summary
Chapter 10: Foundation with Other Tools
Finding a starter theme
Using Foundation with other frameworks
Ideas on how to play nice with developers
Summary
Where to go from here

Book Details

ISBN 139781782164265
Paperback210 pages
Read More
From 1 reviews

Read More Reviews