Responsive design

Reszponzív design (dizájn)

Egy weboldal kialakításának módja, hogy az illeszkedjen a kijelző méretéhez – azaz ne kelljen oldalra görgetni, ha túl kicsi felbontásban nézed meg az oldalt, például okostelefonról.

Egy időben a mobiltelefonok és a számítógépek számára külön weboldalt hoztak létre, de ma már inkább a reszponzív design a sztenderd. Mindkettőnek vannak előnyei és hátrányai, de annyiféle méretű és felbontású kijelző létezik már, hogy kétfajta méretezés egyszerűen nem elég.

Reszponzív vagy adaptív

Mélyen szakmailag szemlélve a kijelzőhöz alkalmazkodó nézeteknek is két változata van. Egyik a reszponzív, amely teljes mértékben alkalmazkodik a kijelző méretéhez – vagyis ha elkezded az egérrel átméretezni (például összehúzni) az ablakot, követni fogja azt, és úgy rendezi a tartalmat, hogy elférjen a megváltozott szélességű felületen. Pont mintha vízzel volna töltve.

Az adaptív felület ezzel szemben nem ilyen egyenletesen változik meg, hanem pontról pontra. Tehát keskenyebbre ugrik mondjuk 1000 pixel szélességnél, aztán ha 600 pixel szélesség alá megy, megint ugrik egy keskenyebb nézetre. Ennek az a hátránya, hogy bizonyos méreteknél kihasználatlan helyek maradnak.

A legtöbb weboldal a kettőt kombinálva használja, és ilyen a WebshopLady-hu is. Ha elkezded kisebbre méretezni az ablakot, akkor azt láthatod, hogy megpróbálja kitölteni teljesen a helyet, ugyanakkor vannak beleépítve olyan pontok, amelyeknél megváltozik az elrendezés – például 1000px alatti nézetben eltűnik a jobb oldali hasáb, és a tartalma a cikk alá kerül.