Home Page Icon
Home Page
Table of Contents for
Practical Responsive Typography
Close
Practical Responsive Typography
by Dario Calonaci
Practical Responsive Typography
Practical Responsive Typography
Table of Contents
Practical Responsive Typography
Credits
About the Author
About the Reviewer
www.PacktPub.com
eBooks, discount offers, and more
Why subscribe?
Preface
What this book covers
What you need for this book
Who this book is for
Conventions
Reader feedback
Customer support
Downloading the example code
Errata
Piracy
Questions
1. Web Typography
Developing your knowledge
Anatomy of the character
Typeface or font? A guide to the distinction
Typefaces classification
Serifs
Old Style or Humanist
Transitional Serifs
Modern Serifs
Slab Serifs
Sans Serifs
Grotesque Sans
Neo-Grotesque Sans
Humanist font
Geometric font
Script typefaces
Formal script
Casual script
Monospaced typefaces
Display typefaces
Expressing different moods
Serifs vs Sans
Scripts vs scripts
Display typefaces
Combining typefaces
Typography properties
Kerning
Tracking
Ligatures
Leading
Information hierarchy – giving order to your text
Alignments
Rag
Justification of text
Summary
2. Responsive Typography
Creating the page
Let's wander through CSS
Up to letter and text group!
Ligatures
Hierarchy
Example and exercise!
The intrinsic nature of type
Summary
3. Web Fonts and Services
The free services for font embedding
CSS @font-face
The local property
Bold and italic
Problems with @font-face
Font Squirrel and its generator
And now what?
Google web fonts
Time for a couple of paid services
Typekit
Cloud typography
Summary
4. Modern Scale
What is a font scale?
Creating a new scale
What is an em?
Why are ems important?
Defect in the em element
The CSS3 solution
What to expect from rems?
Time to get back to the scale
A more complex exercise
Vertical rhythm
A little note on ems and rems
Summary
5. Viewport and Size
The viewport concept
CSS3 custom units
Summary
6. Media Queries
How to write them
Media queries for responsive design
Summary
7. Sass and Typography
CSS pre-processors and Sass
Sass and LESS: A comparison
Installing Sass
Your small Sass tutorial
More Sass properties
Sass for responsive typography
Too many breakpoints
Adding line-height
Summary
8. Three Step Responsive
It actually takes more than three steps
A Sass powered one page website
Another solution using JRibbble
Sass stylizing our carousel
Modular typography scale with Sass
Sass Mixin for easy responsiveness
A Sass generated responsive grid
Summary
9. Future Responsive – Hinting
What is font hinting?
The four different hinting processes
Black and white rendering
Gray-scale rendering
ClearType rendering
DirectWrite rendering
Difficulties for type designers – and hinting's future
Another problem with pixel densities
My solution for hinting on the Web
Summary
10. Future Responsive – Drop Caps and Shapes
What drop caps are and how to use them
Drop cap with an image
Letter over an image
Creating a class with no image
Drop caps with pseudo-elements
Onto the future – Shaping your text
A shape tutorial
Defining a shape using an image
CSS shapes in responsive web design
In the future
Summary
Index
Search in book...
Toggle Font Controls
Playlists
Add To
Create new playlist
Name your new playlist
Playlist description (optional)
Cancel
Create playlist
Sign In
Email address
Password
Forgot Password?
Create account
Login
or
Continue with Facebook
Continue with Google
Sign Up
Full Name
Email address
Confirm Email Address
Password
Login
Create account
or
Continue with Facebook
Continue with Google
Prev
Previous Chapter
Table of Contents
Next
Next Chapter
Practical Responsive Typography
Practical Responsive Typography
Add Highlight
No Comment
..................Content has been hidden....................
You can't read the all page of ebook, please click
here
login for view all page.
Day Mode
Cloud Mode
Night Mode
Reset