You CAN embed videos responsively!

These days, all sites need to be responsive. A large percentage of visitors to websites now are coming on mobile devices or tablets, and we have to accommodate for them. This isn’t going to go away… if anything, more and more people will accessing the web via devices.

I’ll admit I may have been a tiny bit slow to start developing responsively. I was set in  my ways, had a system I liked, and developing a site that was responsive put a crimp in my style. Instead I’d use a nice mobile plugin, and all was right with the world. But I eventually did have to switch over, and even though it pushed me out of my comfort zone, I’m glad I did. Now I’m to the point that when I land on a website and it’s not responsive, I get really annoyed!

For the most part, I’m able to make everything work well for mobile devices when I’m working on a site, but the one thing that has continued to challenge me has been embedded content. Sometimes you can’t get around adding iframes or other embedded content, particularly videos, and I was struggling to make it all be responsive.

Then I found my new favorite website. A website I will now share with you. It’s called Embed Responsively.

You can go to this website, paste in your video URL, your iframe, or whatever embedded content you have and then hit the embed button.

And after you do that, it pops out your new embed code which renders your content in a responsive way. I was struggling with an embedded video. It wasn’t from a common source like YouTube or Vimeo, the client needed a video embedded from the Sports Illustrated website and that code was completely different and I couldn’t seem to make it responsive. In my Google searches, I stumbled upon Embed Responsively, and so I gave it a shot. And it worked beautifully. I was thrilled.

I love finding great resources and sharing them! No go forward and make your embedded content mobile friendly! No excuses now!