Nfol · 2013. február 16.

Válaszkész terv nézet

Elég ritkán nyomogatom a Firefox böngésző narancssárga menügombját, ezért az újdonság erejével hatott rám, amikor tegnap felfedeztem a fejlesztői eszközök között a Responsive Design View opciót (Ctrl+Shift+M), pedig már a 15-ös verzió óta ott van.

Ez az eszköz ugyanarra használható, mint a böngészőfüggetlen Responsinator és hasonszőrű konkurensei: a böngészőablak tartalmi részét (a viewportot) a megadott szélességűre és magasságúra méretezi át, amivel gyorsan és egyszerűen lehet tesztelni a kijelzőmérethez alkalmazkodó (reszponzív) dizájnunkat különböző felbontású mobiltelefon és táblagép, illetve a böngészőablakunk széleinek veszett húzgálása nélkül. Az előre beállított méretek mellett sajátot is megadhatunk és van lehetőség a portré/fektetett módok közötti váltásra is.

Az én saját módszerem az ilyen jellegű dizájnok tesztelésére egyébként abból áll, hogy ha töréspontok szerint változik az oldal megjelenése (tehát adott képernyőszélesség elérése esetén van valamilyen változás), akkor a töréseket különböző színekkel jelölöm, például a body elem kap egy jól látható, színes felső szegélyt, aminek változik a színe, ahogy a szélesség nő vagy csökken, így egyből látható, hogy melyik töréspontnál van baj.

Itt lehet puttyogtatni!