- Handling Navigation
- Handling Images
- Handling Widgets
- Wrapping Up
Wrapping Up
We explored quite a bit in this chapter, from several navigation techniques using Media Queries, RESS, and JavaScript to making our images respond to both screen resolutions and connection speeds, as well as making the most out of our sidebar widgets.
Images proved to be a tough task to tackle, but we can now replace featured images automatically and post images with a shortcode. While images still remain a bit of a question mark as far as the best way to replace in-content images on a large scale due to some possible performance issues, what we looked at will at least help you and your users moving forward. Trying to fix all images at load time puts a lot of stress on the website that results in it being visibly slower. Hopefully we will see this improved upon in the near future.
Since this chapter focused primarily on layout elements, in the next chapter we will go back to WordPress’ roots and look at making elements of the blog portion of a site responsive. Specifically, we’ll look at comments, archives, and other developers’ plugins.
Questions
- What is the biggest pitfall of the “Do Nothing” navigation approach?
- When should RESS be employed in regard to navigation?
- What does picturefill.js do?
- How do you ensure content integrity as far as multicolumn layouts are concerned?
Answers
- It will take up a lot of vertical space, pushing the content down the page.
- RESS should be employed when we are hiding navigation/markup based on screen width.
- It replaces a single <img> with multiple image options, to be displayed based on screen width.
- Structure the columns so the main content is on top, followed by the sidebars.