O'Reilly logo

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

RESS Essentials

Book Description

If you’re involved in Responsive Web Design, then you’ll find this book on the fundamental features and techniques of RESS a very useful tool. It’s the ideal introduction to a revolutionary new methodology.

  • Easy-to-follow tutorials on implementing RESS application patterns
  • Information flow diagrams which will help you understand various RESS architectures with ease
  • Perform browser feature detection and store this information on server side

In Detail

RESS is a new methodology in the world of web design and development. It attempts to solve the problems that accompany the RWD (responsive web design) approach to web design. RESS is still in its infancy, but it is growing at an exponential rate.

RESS Essentials shows you how to make server-side applications smarter and more aware of a visitor's environment limitations (device, screen size, and browser). This allows you to create faster and more reliable websites. Through this book, you will build a solid base of knowledge on RESS-related technologies, while the step-by-step tutorials will help you to create your own RESS system.

This book is an introduction to RESS alchemy and gives you an incentive to build your own RESS lab. It will give you a broad overview of the multiple techniques used to code responsive websites in responsible ways. Beginning with an overview of RWD, you will learn the steps involved in setting up RWD for client-side development. You will then learn how to scale images using client- and server-side technology. By the end of this book, you will have learned about the implementation of RESS application patterns, browser feature detection, and various RESS architectures. RESS Essentials will also teach you how to use jQuery with some RWD design patterns and how to employ REST API for RWD pages.

Table of Contents

  1. RESS Essentials
    1. Table of Contents
    2. RESS Essentials
    3. Credits
    4. About the Authors
    5. About the Reviewers
    6. www.PacktPub.com
      1. Support files, eBooks, discount offers and more
      2. Why Subscribe?
      3. Free Access for Packt account holders
    7. Preface
      1. What this book covers
      2. What you need for this book
      3. Who this book is for
      4. Conventions
      5. Reader feedback
      6. Customer support
        1. Downloading the example code
        2. Errata
        3. Piracy
        4. Questions
    8. 1. Why Does RWD Change the Internet?
      1. The RESS idea
      2. Controversies
        1. "Separate mobile websites are a good thing"
        2. "RWD is too difficult"
        3. "RWD means degrading design"
      3. RWD benefits
        1. Freedom for designers
        2. Invest less, reach out to a larger audience
      4. Users
      5. Developers
        1. RWD evolution and experiments
      6. Summary
    9. 2. Sample RWD Setup for Client-Side Development
      1. Bootstrap custom compilation setup
        1. Testing the Bootstrap grid system
      2. Integrating Gridpak
        1. Implementing responsive design
      3. Summary
    10. 3. Server Side Setup – Device Detection Libraries
      1. The AGPL licensed "OnSite" version of the WURFL library
      2. The WURFL Cloud version
      3. YABFDL – Detector
      4. Summary
    11. 4. Sample RESS Page
      1. WURFL plus screen size detection
      2. Dave Olsen's Detector
      3. Pure JavaScript screen size test
        1. Utility functions
      4. Dave Olsen's Detector plus WURFL
      5. Summary
    12. 5. Responsive Images Client- and Server-Side Approaches
      1. Scaling responsive images is not linear
      2. Plain CSS and Media queries – a solution with limited browser support
      3. The <picture> tag proposition
      4. Picturefill that mimics the <picture> tag behavior with HTML5 and JS
      5. Automated creation of responsive images
      6. Server Side – using one of our example RESS systems
      7. Summary
    13. 6. Performance
      1. Optimizing website towards screen size or bandwidth?
      2. Optimizing images
        1. Optimizing image dimensions
        2. Optimizing image compression
        3. Optimizing the file format
        4. Avoiding the use of images
        5. Reducing the number of images
      3. Media queries optimization
      4. Testing
      5. Summary
    14. 7. Extending with jQuery
      1. Twitter Bootstrap components and plugins
      2. Responsive tables
      3. Converting a table to an accordion element with jQuery
      4. Masonry
      5. Summary
    15. 8. Employing a REST API for RWD
      1. REST API
        1. Slim PHP framework and integrating the RESS module
        2. Defining API with the Slim framework
      2. Gateway file and path setup
      3. Implementing routes
      4. Adding photos
      5. What is it good for?
      6. Summary
    16. Index