Gör inbäddningar responsiva. Se till att det alltid passar webbläsarens storlek.

Teknik

Motor

Samhälle

Spel

Popkultur

Fritid

Tjock

Tester

Dagens fråga

Tipsa!

Skaffa Feber+

Hetaste

Senaste

Gör inbäddningar responsiva

Se till att det alltid passar webbläsarens storlek

Att bädda in (embed) saker från andra sajter på sin blogg eller hemsida är smidigt och något som vi bland annat använder mycket här på Feber när det gäller filmer från YouTube, Vimeo och liknande.

Problemet med detta när vi nu för tiden kolla på webbsidor på enheter med så många olika storlekar är att embed-koder från tredjeparts-sajter som till exempel YouTube inte erbjuder något responsivt alternativ för att bädda in deras material. Detta gör att något som till exempel ser bra ut på datorns webbläsare kan se helt förvrängt ut på mobilen webbläsare.

Detta går nu att fixa med tjänsten "Embed Responsively" som kan generera responsiv embed-kod för bland annat YouTube, Vimeo, Instagram och Google Maps. Det enda man behöver göra är att skriva in urlen (adressen) till önskat material och sedan genereras en responsiv embed-kod för detta.

Att inte YouTube och de andra redan erbjuder detta känns lite konstigt då bland annat Spotify och Twitters embed-koder är responsiva. Men jag antar att det handlar om en tidsfråga innan alla kan erbjuda responsiva embed-koder.

Nedan ser ni två exempel på inbäddningar från Instagram där det nedre exemplet är en responsiv inbäddning via Embed Responsively medan det övre exemplet använder Instagrams egen embed-kod. Sitter ni på en mobil så ser ni antagligen skillnaden direkt men om ni sitter på en dator så testa att förminska webbläsar-fönstret så ser ni vad skillnaden mellan responsiv och icke-responsiv kod kan göra.

embedresponsively.com

Webb, Övrigt,

embed, inbäddningar, responsiv, kodning, webbutveckling

Via TheNextWeb

40.0°