Reframe.js Notes

rfp-robotRFP ROBOT: Website Request for Proposal Generator

The time has come for a new website (or website redesign), which means you need to write a website request for proposal or web RFP. A Google search produces a few examples, but they vary wildly and don’t seem to speak really to your goals for developing or redesigning a new website. You need to write a website RFP that will clearly articulate your needs and generate responses from the best website designers and developers out there. But how?

Have no fear, RFP Robot is here. He will walk you through a step-by-step process to help you work through the details of your project and create a PDF formatted website design RFP that will provide the information vendors need to write an accurate bid. RFP Robot will tell you what info you should include, point out pitfalls, and give examples.


FitVids.js is still a perfectly workable mini plugin for making videos (or anything) responsive. You need it, or something like it, for sites that have things like YouTube or Vimeo videos, Instagram embeds, or really anything that’s not responsive in the aspect-ratio sense. <img>/<video> resize their width/height in an aspect ratio friendly way, <iframe>/<canvas>/<object> do not.
Reframe.js is kind of a modernized version of FitVids.

It’s bower and npm friendly.
You can require it.
It doesn’t need jQuery.

While they largely do the same thing, there are some slight differences:

FitVids injects the CSS it needs while Reframe expects you to add it to your stylesheet.
You call FitVids on a container to search for elements in. You give Reframe selectors directly. You can customize what gets found and filter with either.

When we tweeted it, there were several responses along the lines of:
Why would you use this when you can just use the padding hack?
Indeed, these both use the padding hack, or “intrinsic ratios”. Wrap a container element around the thing, make it height: 0; padding-top: 56.25%; position: relative; then absolutely position the element within to cover it entirely. But doing it that way means:

You have to place the wrapper element in your content yourself.
Everything you embed better be 16:9.

Using either of these libraries means:

The wrapper gets injected for you.
What you embed gets measured and the correct aspect ratio applied.

Both are valuable. I don’t wanna hand-write div wrappers on stuff, I just wanna copy and paste embed code. And not all things are 16:9.

Reframe.js Notes is a post from CSS-Tricks
Source: CssTricks

Posted on September 22, 2016 in code, css, drupal design,, Drupal Developer, drupal developer austin, Drupal Development, Drupal Support, drupal theme developer,, drupal upgrade, drupal web desingers, drupal web development company,, Drupal Website Developer, drupal website developmetn cost, Expert Drupal Development, jquery, plugin, The, Video, Vimeo, Web Design Services, YouTube

Share the Story

Back to Top