logó WEBFEJLESZTÉS, WEBÁRUHÁZ KÉSZÍTÉS
Ingyenes elektronikus tananyag interaktív weboldalak készítéséhez.

Responsive webáruház

Programozott tananyag:


A responsive web design
A responsive web design (RDW) azt jelenti, hogy az weboldal tartalma mindig a rendelkezésre álló mérthez igazodó rugalmas elrendezésben jelenik meg.

Fix kétoszlopos szerkezet
A mobil böngészők, a fix szélességű weboldalakat rendszerint kicsinyítve jelenítik meg.

Folyékony kétoszlopos oldal
Folyékony oldalelrendezésnél az oszlopszélesség beállítására fix értékek helyett a befoglaló terület %-os értékét szokás megadni.

Hibrid kétoszlopos szerkezet
A tartalom div kitölti a rendelkezésre álló ablakot. A fix szélességű menü számára szükséges helyet a margó biztosítósítja.

Helyi menü elrejtése
Zavaró, ha kis felbontású képernyőn rendelkezésre álló ablak nagy részét a menü foglalja el. Megadjuk a lehetőséget a menüoszlop elrejtésére.

Inline-block használata
Responsive webáruház esetén gyakori feladat, hogy a megjelenített tartalmak információs blokkokba rendezve, egymást követő téglalap alakú területeken jelenítsük meg.

Úsztatott blokkok használata
Népszerű és gyakran használt megoldás. Az úsztatott (Float) blokkokat követő szöveggel kitölthető a fennmaradó terület.

Felbontásfüggő stílusok
A felhasználó által használt médiához és annak felbontásához jól illeszkedő stíluslap készítésében segít a médialekérdezés (query).

Médialekérdezés operátorai
A médialekérdezésnél (@media) használható operátorok bemutatása.

Média tulajdonságok
A médialekérdezéssel (@media) vizsgálható média tulajdonságok bemutatása.

Responsive táblázatok
HTML5-ben a táblázatok szerepe az adatok áttekinthető módon történő közzététele. Kis felbontásnál a szokásos táblázatos felépítés nem használható. Vagy mégis?


Ahogy a legtöbb honlap, ez a webhely is használ sütiket a weboldalain.