{"id":24008,"date":"2026-01-28T07:00:03","date_gmt":"2026-01-28T07:00:03","guid":{"rendered":"https:\/\/www.shoprenter.hu\/blog\/?p=24008"},"modified":"2026-03-11T11:37:35","modified_gmt":"2026-03-11T11:37:35","slug":"igy-szuletett-meg-a-vilagitascenter-akadalymentes-webshopja","status":"publish","type":"post","link":"https:\/\/www.shoprenter.hu\/blog\/igy-szuletett-meg-a-vilagitascenter-akadalymentes-webshopja","title":{"rendered":"Amikor a f\u00e9ny mindenkihez el\u00e9r &#8211; \u00cdgy sz\u00fcletett meg a Vil\u00e1g\u00edt\u00e1sCenter akad\u00e1lymentes webshopja"},"content":{"rendered":"\n<p>A Vil\u00e1g\u00edt\u00e1scenter.hu m\u00f6g\u00f6tt egy t\u00f6bb \u00e9vtizedes m\u00falttal rendelkez\u0151 hazai villamoss\u00e1gi v\u00e1llalkoz\u00e1s \u00e1ll: az Orb\u00e1n Elektric Kft., akik 1993 \u00f3ta foglalkoznak villanyszerel\u00e9si anyagok \u00e9s kapcsol\u00f3d\u00f3 term\u00e9kek kereskedelm\u00e9vel, \u00e9s a n\u00f6vekv\u0151 ig\u00e9nyekre reag\u00e1lva a web\u00e1ruh\u00e1zat is egyre tudatosabban fejlesztik.<\/p>\n\n\n\n<p>A k\u00f6z\u00f6s projekt\u00fcnk kiindul\u00f3pontja nagyon k\u00e9zzelfoghat\u00f3 volt: a megl\u00e9v\u0151 design technikailag \u00e9s megjelen\u00e9sben is elavult, a c\u00e9l pedig egy gyorsabb, stabilabb, SEO-szempontb\u00f3l is \u00e1tl\u00e1that\u00f3bb fel\u00fclet l\u00e9trehoz\u00e1sa, ami jobb felhaszn\u00e1l\u00f3i \u00e9lm\u00e9nyt, magasabb konverzi\u00f3t \u00e9s \u00f6sszess\u00e9g\u00e9ben egy modernebb boltot ad. Mindezt \u00fagy, hogy k\u00f6zben megmarad a m\u00e1r megszokott sz\u00ednvil\u00e1g, \u00e9s a v\u00e9geredm\u00e9ny pr\u00e9mium \u00e9rzetet sugall, m\u00e9gis \u201cel\u00e9rhet\u0151\u201d m\u00f3don.<\/p>\n\n\n\n<p><strong>Ami m\u00e9g k\u00fcl\u00f6nlegess\u00e9 teszi a meg\u00fajul\u00e1st, hogy a web\u00e1ruh\u00e1z megjelen\u00e9se nemcsak egy redesign-on esett \u00e1t, hanem akad\u00e1lymentes is lett.&nbsp;<\/strong><\/p>\n\n\n\n<p>Ez t\u00f6bb mint egy \u201csz\u00e9p gesztus\u201d a r\u00e9sz\u00fckr\u0151l. Tudatos d\u00f6nt\u00e9s volt, hiszen egy <a href=\"https:\/\/support.shoprenter.hu\/hc\/hu\/articles\/27938176637597-Mit-kell-tudnom-az-akad%C3%A1lymentes%C3%ADt%C3%A9sr%C5%91l\" target=\"_blank\" rel=\"noreferrer noopener\">akad\u00e1lymentes\u00edtett web\u00e1ruh\u00e1z<\/a> hozz\u00e1j\u00e1rul ahhoz, hogy nagyobb felhaszn\u00e1l\u00f3i r\u00e9teget \u00e9rjen el.<\/p>\n\n\n\n<p>Bemutatjuk a meg\u00fajul\u00e1s t\u00f6rt\u00e9net\u00e9t, mik\u00f6zben kiemel\u00fcnk n\u00e9h\u00e1ny olyan megold\u00e1st is, amelyek kifejezetten egyediv\u00e9 teszik a web\u00e1ruh\u00e1z \u00faj fel\u00fclet\u00e9t &#8211; nemcsak l\u00e1tv\u00e1nyban, hanem m\u0171k\u00f6d\u00e9sben is.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">El\u0151tte &#8211; Ut\u00e1na<\/h2>\n\n\n\n<p>A <a href=\"https:\/\/www.vilagitascenter.hu\/\" target=\"_blank\" rel=\"noreferrer noopener\">vilagitascenter.hu<\/a>-nak kor\u00e1bban is egyedi design-ja volt a Tokyo design t\u00e9m\u00e1ra \u00e9p\u00edtve. Ugyanakkor ez m\u00e1r t\u00f6bb mint hat \u00e9ves t\u00e9ma \u00e9s mint tudjuk, a mai felgyorsult vil\u00e1gban ennyi id\u0151 nem kev\u00e9s. Meg\u00e9rett m\u00e1r a web\u00e1ruh\u00e1z a design friss\u00edt\u00e9sre.<\/p>\n\n\n\n<p>\u00cdgy n\u00e9zett ki a web\u00e1ruh\u00e1z a meg\u00fajul\u00e1s el\u0151tt:<\/p>\n\n\n\n<style>\n.scrollbox {\n    max-height: 500px;\n    overflow-y: auto;\n    border: 1px solid #e6e6e6;\n    border-radius: 10px;\n    box-shadow: 0 4px 12px rgba(0,0,0,0.08);\n}\n\n.scrollbox::-webkit-scrollbar {\n    width: 6px;\n}\n.scrollbox::-webkit-scrollbar-track {\n    background: #f1f1f1;\n    border-radius: 10px;\n}\n.scrollbox::-webkit-scrollbar-thumb {\n    background: #bfbfbf;\n    border-radius: 10px;\n}\n.scrollbox::-webkit-scrollbar-thumb:hover {\n    background: #a0a0a0;\n}\n\n.design-nav {\n    text-align: center;\n}\n.design-nav button {\n    background: #444;\n    color: white;\n    padding: 6px 14px;\n    border: none;\n    border-radius: 6px;\n    cursor: pointer;\n    margin: 0 6px 15px 6px;\n    font-size: 15px;\n}\n.design-nav button:hover {\n    background: #000;\n}\n\n.design-page {\n    display: none;\n}\n.design-page.active {\n    display: block;\n}\n<\/style>\n\n<!-- \ud83d\udd12 SAJ\u00c1T KONTAINER -->\n<div class=\"design-viewer\">\n\n    <!-- Navig\u00e1ci\u00f3 -->\n    <div class=\"design-nav\">\n        <button onclick=\"showPage(this, 2)\">Kateg\u00f3ria oldal<\/button>\n        <button onclick=\"showPage(this, 3)\">Term\u00e9k oldal<\/button>\n    <\/div>\n\n    <!-- KATEG\u00d3RIA OLDAL -->\n    <div class=\"design-page active\" data-page=\"2\">\n        <div class=\"scrollbox\">\n            <img decoding=\"async\" src=\"https:\/\/www.shoprenter.hu\/blog\/wp-content\/uploads\/2026\/01\/kategoria-old-scaled.webp\" style=\"width:100%; display:block;\">\n        <\/div>\n    <\/div>\n\n    <!-- TERM\u00c9K OLDAL -->\n    <div class=\"design-page\" data-page=\"3\">\n        <div class=\"scrollbox\">\n            <img decoding=\"async\" src=\"https:\/\/www.shoprenter.hu\/blog\/wp-content\/uploads\/2026\/01\/termek-old-scaled.webp\" style=\"width:100%; display:block;\">\n        <\/div>\n    <\/div>\n\n<\/div>\n\n<script>\nfunction showPage(button, pageNum) {\n    const viewer = button.closest('.design-viewer');\n    viewer.querySelectorAll('.design-page').forEach(p => p.classList.remove('active'));\n    viewer.querySelector(`.design-page[data-page=\"${pageNum}\"]`).classList.add('active');\n}\n<\/script>\n\n\n\n<p><\/p>\n\n\n\n<p>A tervez\u00e9s a megszokott menetben t\u00f6rt\u00e9nt: megtervezt\u00fck a web\u00e1ruh\u00e1z fel\u00e9p\u00edt\u00e9s\u00e9t dr\u00f3tv\u00e1zakkal, majd ezekre l\u00e1tv\u00e1nyterveket k\u00e9sz\u00edtett\u00fcnk.<\/p>\n\n\n\n<p>Az \u00faj design kialak\u00edt\u00e1s\u00e1n\u00e1l a leg\u00fajabb <a href=\"https:\/\/register.shoprenter.hu\/hamburg-tema\" target=\"_blank\" rel=\"noreferrer noopener\">Hamburg t\u00e9m\u00e1ra<\/a> \u00e9p\u00edtkezt\u00fcnk, ugyanakkor jelent\u0151sen elt\u00e9rt\u00fcnk a \u201csablont\u00f3l\u201d \u00e9s sz\u00e1mos \u00fajdons\u00e1g, plusz funkci\u00f3val is felturb\u00f3ztuk.<\/p>\n\n\n\n<p>K\u00f6nnyebbs\u00e9get jelentett a csapatnak, hogy a Hamburg m\u00e1r \u00fagy lett kialak\u00edtva, hogy megfelel az akad\u00e1lymentes szab\u00e1lyoknak, \u00edgy nagyobb figyelmet tudtunk szentelni a megjelen\u00e9snek \u00e9s az egyedi funkci\u00f3k kialak\u00edt\u00e1s\u00e1nak.<\/p>\n\n\n\n<p>A meg\u00fajult megjelen\u00e9st \u00e1ttekintheted, ha ell\u00e1togatsz a web\u00e1ruh\u00e1z oldal\u00e1ra vagy \u00e1tg\u00f6rgeted a lenti ablakokban a grafikai terveket:<\/p>\n\n\n\n<style>\n.scrollbox {\n    max-height: 500px;\n    overflow-y: auto;\n    border: 1px solid #e6e6e6;\n    border-radius: 10px;\n    box-shadow: 0 4px 12px rgba(0,0,0,0.08);\n}\n\n.scrollbox::-webkit-scrollbar {\n    width: 6px;\n}\n.scrollbox::-webkit-scrollbar-track {\n    background: #f1f1f1;\n    border-radius: 10px;\n}\n.scrollbox::-webkit-scrollbar-thumb {\n    background: #bfbfbf;\n    border-radius: 10px;\n}\n.scrollbox::-webkit-scrollbar-thumb:hover {\n    background: #a0a0a0;\n}\n\n.design-nav {\n    text-align: center;\n}\n.design-nav button {\n    background: #444;\n    color: white;\n    padding: 6px 14px;\n    border: none;\n    border-radius: 6px;\n    cursor: pointer;\n    margin: 0 6px 15px 6px;\n    font-size: 15px;\n}\n.design-nav button:hover {\n    background: #000;\n}\n\n.design-page {\n    display: none;\n}\n.design-page.active {\n    display: block;\n}\n<\/style>\n\n<!-- \ud83d\udd12 SAJ\u00c1T KONTAINER -->\n<div class=\"design-viewer\">\n\n    <!-- Navig\u00e1ci\u00f3 -->\n    <div class=\"design-nav\">\n        <button onclick=\"showPage(this, 1)\">F\u0151oldal<\/button>\n        <button onclick=\"showPage(this, 2)\">Kateg\u00f3ria oldal<\/button>\n        <button onclick=\"showPage(this, 3)\">Term\u00e9k oldal<\/button>\n    <\/div>\n\n    <!-- F\u0150OLDAL -->\n    <div class=\"design-page active\" data-page=\"1\">\n        <div class=\"scrollbox\">\n            <img decoding=\"async\" src=\"https:\/\/www.shoprenter.hu\/blog\/wp-content\/uploads\/2026\/01\/fooldal-new-1-scaled.webp\" style=\"width:100%; display:block;\">\n            <img decoding=\"async\" src=\"https:\/\/www.shoprenter.hu\/blog\/wp-content\/uploads\/2026\/01\/fooldal-new-2-scaled.webp\" style=\"width:100%; display:block;\">\n            <img decoding=\"async\" src=\"https:\/\/www.shoprenter.hu\/blog\/wp-content\/uploads\/2026\/01\/fooldal-new-3-scaled.webp\" style=\"width:100%; display:block;\">\n        <\/div>\n    <\/div>\n\n    <!-- KATEG\u00d3RIA -->\n    <div class=\"design-page\" data-page=\"2\">\n        <div class=\"scrollbox\">\n            <img decoding=\"async\" src=\"https:\/\/www.shoprenter.hu\/blog\/wp-content\/uploads\/2026\/01\/kategoria-new-1-scaled.webp\" style=\"width:100%; display:block;\">\n            <img decoding=\"async\" src=\"https:\/\/www.shoprenter.hu\/blog\/wp-content\/uploads\/2026\/01\/kategoria-new-2-scaled.webp\" style=\"width:100%; display:block;\">\n        <\/div>\n    <\/div>\n\n    <!-- TERM\u00c9K -->\n    <div class=\"design-page\" data-page=\"3\">\n        <div class=\"scrollbox\">\n            <img decoding=\"async\" src=\"https:\/\/www.shoprenter.hu\/blog\/wp-content\/uploads\/2026\/01\/vilagitasc-termek1.webp\" style=\"width:100%; display:block;\">\n            <img decoding=\"async\" src=\"https:\/\/www.shoprenter.hu\/blog\/wp-content\/uploads\/2026\/01\/vilagitasc-termek2.webp\" style=\"width:100%; display:block;\">\n        <\/div>\n    <\/div>\n\n<\/div>\n\n<script>\nfunction showPage(button, pageNum) {\n    const viewer = button.closest('.design-viewer');\n    viewer.querySelectorAll('.design-page').forEach(p => p.classList.remove('active'));\n    viewer.querySelector(`.design-page[data-page=\"${pageNum}\"]`).classList.add('active');\n}\n<\/script>\n\n\n\n<p><\/p>\n\n\n\n<p>A cikk tov\u00e1bbi r\u00e9sz\u00e9ben kit\u00e9r\u00fcnk p\u00e1r olyan megold\u00e1sra, amelyek a Vil\u00e1g\u00edt\u00e1sCenter web\u00e1ruh\u00e1zat igaz\u00e1n egyediv\u00e9 var\u00e1zsolj\u00e1k:<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Sz\u00e9les kivitel<\/h2>\n\n\n\n<p>A Hamburg t\u00e9ma 1380 pixel sz\u00e9les elrendez\u00e9s\u00e9t 1690 pixel sz\u00e9lesre n\u00f6velt\u00fck, \u00edgy jobban kihaszn\u00e1ltuk a nagyobb kijelz\u0151k (laptop, desktop) ny\u00fajtotta lehet\u0151s\u00e9geket. Ennek k\u00f6sz\u00f6nhet\u0151en t\u00f6bb term\u00e9k \u00e9s inform\u00e1ci\u00f3 f\u00e9r el egy k\u00e9perny\u0151n, k\u00e9nyelmesebb a b\u00f6ng\u00e9sz\u00e9s (kevesebb g\u00f6rget\u00e9s), \u00e9s a term\u00e9klist\u00e1k, sz\u0171r\u0151k, kiemel\u00e9sek is \u00e1tl\u00e1that\u00f3bban rendezhet\u0151k.<\/p>\n\n\n\n<p>A sz\u00e9lesebb elrendez\u00e9sn\u00e9l k\u00fcl\u00f6n figyelt\u00fcnk arra, hogy ne hossz\u00fa, nehezen k\u00f6vethet\u0151 sorok j\u00f6jjenek l\u00e9tre. Az olvashat\u00f3s\u00e1g \u00e9rdek\u00e9ben a sz\u00f6veges blokkok tov\u00e1bbra is kontroll\u00e1lt sort\u00f6r\u00e9ssel, j\u00f3l tagoltan jelennek meg, \u00edgy a tartalom k\u00f6nnyen befogadhat\u00f3 marad.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Ikonok a men\u00fcben<\/h2>\n\n\n\n<p>A men\u00fcben a f\u0151kateg\u00f3ri\u00e1k mell\u00e9 egy\u00e9rtelm\u0171, k\u00f6nnyen felismerhet\u0151 ikonokat (m\u00e1s sz\u00f3val piktogramokat) helyezt\u00fcnk, hogy a l\u00e1togat\u00f3 m\u00e1r els\u0151 pillant\u00e1sra gyorsabban be tudja azonos\u00edtani, melyik men\u00fcpont hov\u00e1 vezet. Ez k\u00fcl\u00f6n\u00f6sen hasznos egy nagy v\u00e1laszt\u00e9k\u00fa, sok kateg\u00f3ri\u00e1val dolgoz\u00f3 webshopn\u00e1l, mint amilyen a Vil\u00e1g\u00edt\u00e1sCenter is, hiszen seg\u00edtik, hogy hamarabb jusson el a felhaszn\u00e1l\u00f3 a relev\u00e1ns term\u00e9kekhez.<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"945\" height=\"742\" src=\"https:\/\/www.shoprenter.hu\/blog\/wp-content\/uploads\/2026\/01\/ikonok-a-menuben.webp\" alt=\"piktogramok a men\u00fcben\" class=\"wp-image-24010\" srcset=\"https:\/\/www.shoprenter.hu\/blog\/wp-content\/uploads\/2026\/01\/ikonok-a-menuben.webp 945w, https:\/\/www.shoprenter.hu\/blog\/wp-content\/uploads\/2026\/01\/ikonok-a-menuben-768x603.webp 768w\" sizes=\"(max-width: 945px) 100vw, 945px\" \/><\/figure><\/div>\n\n\n<p><\/p>\n\n\n\n<p>Akad\u00e1lymentess\u00e9gi szempontb\u00f3l fontos, hogy az ikonok nem helyettes\u00edtik a sz\u00f6veget, csak t\u00e1mogatj\u00e1k azt. Minden men\u00fcpont tov\u00e1bbra is j\u00f3l olvashat\u00f3 felirattal szerepel, az ikonok pedig megfelel\u0151en kezelhet\u0151k, \u00edgy a fel\u00fclet k\u00e9perny\u0151olvas\u00f3val \u00e9s billenty\u0171zettel is \u00e9rtelmezhet\u0151 marad.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Kiemelt inform\u00e1ci\u00f3k a term\u00e9kaj\u00e1nl\u00f3 modulokn\u00e1l<\/h2>\n\n\n\n<p>A f\u0151oldali term\u00e9kaj\u00e1nl\u00f3k (\u201eKedvenceid m\u00e9g kedvez\u0151bben\u201d \u00e9s az \u201e\u00dajdons\u00e1gaink\u201d) mell\u00e9 be\u00e9p\u00edtett\u00fcnk egy k\u00fcl\u00f6n\u00e1ll\u00f3, fix bannert. Ilyet ritk\u00e1n l\u00e1tni sablonos megold\u00e1sokn\u00e1l. Most kifejezetten az volt a c\u00e9l, hogy a term\u00e9kek mellett megjelenjen egy k\u00e9pi fel\u00fclet, ami megt\u00f6ri az oldal monotonit\u00e1s\u00e1t \u00e9s fenntartja a l\u00e1togat\u00f3 figyelm\u00e9t.<\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"1660\" height=\"760\" src=\"https:\/\/www.shoprenter.hu\/blog\/wp-content\/uploads\/2026\/01\/kiemelt-infok-1.webp\" alt=\"kiemelt inform\u00e1ci\u00f3k\" class=\"wp-image-24012\" srcset=\"https:\/\/www.shoprenter.hu\/blog\/wp-content\/uploads\/2026\/01\/kiemelt-infok-1.webp 1660w, https:\/\/www.shoprenter.hu\/blog\/wp-content\/uploads\/2026\/01\/kiemelt-infok-1-1024x469.webp 1024w, https:\/\/www.shoprenter.hu\/blog\/wp-content\/uploads\/2026\/01\/kiemelt-infok-1-768x352.webp 768w, https:\/\/www.shoprenter.hu\/blog\/wp-content\/uploads\/2026\/01\/kiemelt-infok-1-1536x703.webp 1536w\" sizes=\"(max-width: 1660px) 100vw, 1660px\" \/><\/figure>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"1660\" height=\"760\" src=\"https:\/\/www.shoprenter.hu\/blog\/wp-content\/uploads\/2026\/01\/kiemelt-infok-2.webp\" alt=\"kiemelt inform\u00e1ci\u00f3k\" class=\"wp-image-24013\" srcset=\"https:\/\/www.shoprenter.hu\/blog\/wp-content\/uploads\/2026\/01\/kiemelt-infok-2.webp 1660w, https:\/\/www.shoprenter.hu\/blog\/wp-content\/uploads\/2026\/01\/kiemelt-infok-2-1024x469.webp 1024w, https:\/\/www.shoprenter.hu\/blog\/wp-content\/uploads\/2026\/01\/kiemelt-infok-2-768x352.webp 768w, https:\/\/www.shoprenter.hu\/blog\/wp-content\/uploads\/2026\/01\/kiemelt-infok-2-1536x703.webp 1536w\" sizes=\"(max-width: 1660px) 100vw, 1660px\" \/><\/figure><\/div>\n\n\n<p><\/p>\n\n\n\n<p>A megold\u00e1s teljesen egyedileg ker\u00fclt be\u00e9p\u00edt\u00e9sre, \u00e9s k\u00fcl\u00f6n modul logik\u00e1val kezelhet\u0151, \u00edgy gyorsan cser\u00e9lhet\u0151 a tartalma an\u00e9lk\u00fcl, hogy a term\u00e9kaj\u00e1nl\u00f3 m\u0171k\u00f6d\u00e9s\u00e9hez hozz\u00e1 kellene ny\u00falni. Ezek a kiemelt inform\u00e1ci\u00f3k mobilon is jobban \u00e9rv\u00e9nyes\u00fclnek.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Kateg\u00f3ria oldal egyedis\u00e9gei<\/h2>\n\n\n\n<p>A kateg\u00f3ria oldalakon t\u00f6bb hasznos funkci\u00f3 is helyet kapott a meg\u00fajult fel\u00fcleten, amelyeknek c\u00e9lja a k\u00f6nnyebb navig\u00e1ci\u00f3 \u00e9s \u00e1ttekinthet\u0151s\u00e9g.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Sz\u0171r\u0151panel elrejthet\u0151s\u00e9ge<\/h3>\n\n\n\n<p>Az \u00fcgyf\u00e9l k\u00e9r\u00e9s\u00e9re a kateg\u00f3riaoldalon a sz\u0171r\u0151t nem \u201ck\u00f6telez\u0151 elemk\u00e9nt\u201d kezelt\u00fck, hanem egy mozdulattal \u00f6ssze lehet csukni, hasonl\u00f3 logik\u00e1val, mint a f\u0151men\u00fct. Ez k\u00fcl\u00f6n\u00f6sen azoknak hasznos, akiket a bal oldali sz\u0171r\u0151s\u00e1v gyakran zavar b\u00f6ng\u00e9sz\u00e9s k\u00f6zben, vagy egyszer\u0171en csak a term\u00e9keket szeretn\u00e9k gyorsan \u00e1tfutni.<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"800\" height=\"393\" src=\"https:\/\/www.shoprenter.hu\/blog\/wp-content\/uploads\/2026\/01\/kategoria-szuro.gif\" alt=\"\" class=\"wp-image-24014\"\/><\/figure><\/div>\n\n\n<p><\/p>\n\n\n\n<p><strong>Hogyan m\u0171k\u00f6dik:<\/strong><br>Nyitott \u00e1llapotban a sz\u0171r\u0151 egy klasszikus oldals\u00e1vk\u00e9nt viselkedik, teh\u00e1t megszokott \u00e9s k\u00f6nnyen \u00e9rtelmezhet\u0151. Viszont, ha a felhaszn\u00e1l\u00f3 bez\u00e1rja, akkor a term\u00e9klista sz\u00e9lesebb fel\u00fcletet kap.<\/p>\n\n\n\n<p>Tov\u00e1bbi el\u0151nye, hogy a sz\u0171r\u0151 elrejthet\u0151s\u00e9ge cs\u00f6kkenti a vizu\u00e1lis terhel\u00e9st, \u00e9s f\u00f3kusz\u00e1ltabb b\u00f6ng\u00e9sz\u00e9st tesz lehet\u0151v\u00e9. Emellett fontos, hogy a \u201ctoggle funkci\u00f3\u201d j\u00f3l azonos\u00edthat\u00f3, egy\u00e9rtelm\u0171 \u00e1llapotot jelez (nyitva\/z\u00e1rva), \u00e9s billenty\u0171zettel is biztons\u00e1gosan kezelhet\u0151.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Fixen megjelen\u0151 kos\u00e1r modul<\/h3>\n\n\n\n<p>A term\u00e9klista oldalakon a kos\u00e1r fixen megjelenik a jobb oldalon, \u00edgy a v\u00e1s\u00e1rl\u00f3k folyamatosan nyomon k\u00f6vethetik, mit raktak bele. A term\u00e9kek darabsz\u00e1m\u00e1t a felhaszn\u00e1l\u00f3k k\u00f6zvetlen\u00fcl itt is n\u00f6velhetik vagy cs\u00f6kkenthetik, nem kell ehhez k\u00fcl\u00f6n a kos\u00e1r oldalra l\u00e9pni\u00fck. Ez\u00e1ltal kevesebb kattint\u00e1ssal \u00e9s kevesebb oldal bet\u00f6lt\u00e9ssel j\u00e1r egy v\u00e1s\u00e1rl\u00e1s.<\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"1830\" height=\"882\" src=\"https:\/\/www.shoprenter.hu\/blog\/wp-content\/uploads\/2026\/01\/fix-kosar.webp\" alt=\"r\u00f6gz\u00edtett kos\u00e1r\" class=\"wp-image-24015\" srcset=\"https:\/\/www.shoprenter.hu\/blog\/wp-content\/uploads\/2026\/01\/fix-kosar.webp 1830w, https:\/\/www.shoprenter.hu\/blog\/wp-content\/uploads\/2026\/01\/fix-kosar-1024x494.webp 1024w, https:\/\/www.shoprenter.hu\/blog\/wp-content\/uploads\/2026\/01\/fix-kosar-768x370.webp 768w, https:\/\/www.shoprenter.hu\/blog\/wp-content\/uploads\/2026\/01\/fix-kosar-1536x740.webp 1536w\" sizes=\"(max-width: 1830px) 100vw, 1830px\" \/><\/figure>\n\n\n\n<p><\/p>\n\n\n\n<p>Az, hogy a darabsz\u00e1m helyben \u00e1ll\u00edthat\u00f3, cs\u00f6kkenti a f\u00f6l\u00f6sleges navig\u00e1ci\u00f3t \u00e9s a kontextusv\u00e1lt\u00e1st, ami k\u00fcl\u00f6n\u00f6sen hasznos lehet kognit\u00edv terhel\u00e9s vagy figyelmi neh\u00e9zs\u00e9g eset\u00e9n.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">TOP term\u00e9kek<\/h3>\n\n\n\n<p>A kateg\u00f3riaoldalak tetej\u00e9n (m\u00e9g a term\u00e9klista felett) kiemelj\u00fck a top 3 term\u00e9ket, hogy a l\u00e1togat\u00f3k gyorsan kapjanak egy kapaszkod\u00f3t a v\u00e1laszt\u00e1shoz. Egy nagy k\u00edn\u00e1latn\u00e1l a legnehezebb l\u00e9p\u00e9s sokszor az, hogy \u201chol kezdjem?\u201d. Ez a blokk pontosan ebben seg\u00edt: cs\u00f6kkenti a d\u00f6nt\u00e9si terhet, \u00e9s gyorsabb\u00e1 teszi a term\u00e9kfelfedez\u00e9st.<\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"1200\" height=\"782\" src=\"https:\/\/www.shoprenter.hu\/blog\/wp-content\/uploads\/2026\/01\/top-termekek.webp\" alt=\"top term\u00e9kek a kateg\u00f3ria oldalon\" class=\"wp-image-24016\" srcset=\"https:\/\/www.shoprenter.hu\/blog\/wp-content\/uploads\/2026\/01\/top-termekek.webp 1200w, https:\/\/www.shoprenter.hu\/blog\/wp-content\/uploads\/2026\/01\/top-termekek-1024x667.webp 1024w, https:\/\/www.shoprenter.hu\/blog\/wp-content\/uploads\/2026\/01\/top-termekek-768x500.webp 768w\" sizes=\"(max-width: 1200px) 100vw, 1200px\" \/><\/figure>\n\n\n\n<p><\/p>\n\n\n\n<p>\u00dczleti szempontb\u00f3l ez egy finom, m\u00e9gis hat\u00e9kony terel\u00e9s, mert f\u00f3kuszt ad a kateg\u00f3ri\u00e1nak, \u00e9s seg\u00edt abban, hogy a felhaszn\u00e1l\u00f3 ne vesszen el a list\u00e1ban, hanem hamarabb eljusson a kos\u00e1rba t\u00e9telig. K\u00fcl\u00f6n\u00f6sen mobilon \u00e9s els\u0151 l\u00e1togat\u00e1sn\u00e1l m\u0171k\u00f6dik j\u00f3l, amikor a gyors t\u00e1j\u00e9koz\u00f3d\u00e1s a legfontosabb.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Term\u00e9koldal egyedis\u00e9gei<\/h2>\n\n\n\n<p>A term\u00e9koldalon \u00fagy \u00e9p\u00edtett\u00fck fel a legfels\u0151 szekci\u00f3t, hogy a v\u00e1s\u00e1rl\u00e1si d\u00f6nt\u00e9shez sz\u00fcks\u00e9ges fontos inform\u00e1ci\u00f3k azonnal, hajt\u00e1s felett legyenek el\u00e9rhet\u0151k. A nagy \u00e9s r\u00e9szletgazdag term\u00e9kk\u00e9pek mellett a jobb oldali blokkban ott van minden, ami a d\u00f6nt\u00e9st gyors\u00edtja: rakt\u00e1r\u00e1llapot, v\u00e1rhat\u00f3 sz\u00e1ll\u00edt\u00e1si id\u0151, legkedvez\u0151bb sz\u00e1ll\u00edt\u00e1si d\u00edj, h\u0171s\u00e9gpont \u00e9rt\u00e9k, v\u00e1s\u00e1rl\u00f3i \u00e9rt\u00e9kel\u00e9s, akci\u00f3s \u00e1r \u00e9s az akci\u00f3 id\u0151tartama, stb.<\/p>\n\n\n\n<p>Emellett a \u201eszakmai\u201d adatok sem vesznek el: a gy\u00e1rt\u00f3, cikksz\u00e1m \u00e9s gy\u00e1rt\u00f3i cikksz\u00e1m is ugyanitt szerepel. Ez k\u00fcl\u00f6n\u00f6sen egy vil\u00e1g\u00edt\u00e1stechnikai webshopn\u00e1l \u00e9rt\u00e9k, ahol sokan konkr\u00e9t param\u00e9terek alapj\u00e1n keresnek, \u00e9s fontos, hogy egy\u00e9rtelm\u0171en azonos\u00edthat\u00f3 legyen a term\u00e9k.<\/p>\n\n\n\n<figure class=\"wp-block-image size-full is-resized\"><img loading=\"lazy\" decoding=\"async\" width=\"1787\" height=\"914\" src=\"https:\/\/www.shoprenter.hu\/blog\/wp-content\/uploads\/2026\/01\/termek-section-1.webp\" alt=\"term\u00e9koldal hajt\u00e1s feletti r\u00e9sz\" class=\"wp-image-24017\" style=\"width:1208px;height:auto\" srcset=\"https:\/\/www.shoprenter.hu\/blog\/wp-content\/uploads\/2026\/01\/termek-section-1.webp 1787w, https:\/\/www.shoprenter.hu\/blog\/wp-content\/uploads\/2026\/01\/termek-section-1-1024x524.webp 1024w, https:\/\/www.shoprenter.hu\/blog\/wp-content\/uploads\/2026\/01\/termek-section-1-768x393.webp 768w, https:\/\/www.shoprenter.hu\/blog\/wp-content\/uploads\/2026\/01\/termek-section-1-1536x786.webp 1536w\" sizes=\"(max-width: 1787px) 100vw, 1787px\" \/><\/figure>\n\n\n\n<p><\/p>\n\n\n\n<p>Az eredm\u00e9ny egy nagyon \u00e1tl\u00e1that\u00f3, informat\u00edv term\u00e9koldal, ahol a felhaszn\u00e1l\u00f3nak nem kell vad\u00e1sznia a r\u00e9szletekre vagy ide-oda g\u00f6rgetnie: gyorsabban \u00f6ssze\u00e1ll a k\u00e9p, kevesebb a bizonytalans\u00e1g.<\/p>\n\n\n\n<p>A term\u00e9koldalon lentebb g\u00f6rgetve sem egy megszokott l\u00e1tv\u00e1ny v\u00e1rja a felhaszn\u00e1l\u00f3t: a k\u00e9pi \u00e9s inform\u00e1ci\u00f3s blokkokat \u00fagy rendezt\u00fck el, hogy azok k\u00f6nnyen em\u00e9szthet\u0151ek legyenek.<\/p>\n\n\n\n<p>A term\u00e9kk\u00e9p alatt r\u00f6gt\u00f6n megjelennek a web\u00e1ruh\u00e1z \u00e1ltal k\u00edn\u00e1lt sz\u00e1ll\u00edt\u00e1si opci\u00f3k, \u00edgy a v\u00e1s\u00e1rl\u00f3nak m\u00e1r itt egy\u00e9rtelm\u0171, hogy mik\u00e9nt juthat majd el hozz\u00e1 a term\u00e9k.<\/p>\n\n\n\n<p>Ez alatt, a bal oldali szekci\u00f3ban kaptak helyet a hosszabb sz\u00f6veges tartalmak:<\/p>\n\n\n\n<ul>\n<li>Term\u00e9k param\u00e9terei&nbsp;<\/li>\n\n\n\n<li>Hossz\u00fa le\u00edr\u00e1s<\/li>\n\n\n\n<li>V\u00e9lem\u00e9nyek<\/li>\n\n\n\n<li>Vide\u00f3k<\/li>\n\n\n\n<li>stb.<\/li>\n<\/ul>\n\n\n\n<p>Mindegyik lenyithat\u00f3 \u00e9s visszacsukhat\u00f3. \u00cdgy aki gyorsan csak a l\u00e9nyegre k\u00edv\u00e1ncsi, nem kap t\u00fal sok inform\u00e1ci\u00f3t egyszerre, aki pedig r\u00e9szletesen d\u00f6nt, egy kattint\u00e1ssal el\u00e9ri a b\u0151vebb le\u00edr\u00e1sokat.<\/p>\n\n\n\n<p>A lenyithat\u00f3 elemek mellett, a jobb oldalon egy egyedileg be\u00e9p\u00edtett \u201cTov\u00e1bbi aj\u00e1nlatok\u201d modul fut: lapozhat\u00f3, t\u00f6bb soros term\u00e9kcsemp\u00e9kkel, kifejezetten arra optimaliz\u00e1lva, hogy b\u00f6ng\u00e9sz\u00e9s k\u00f6zben is adjon relev\u00e1ns alternat\u00edv\u00e1kat \u00e9s kieg\u00e9sz\u00edt\u0151 \u00f6tleteket, an\u00e9lk\u00fcl, hogy elvinn\u00e9 a f\u00f3kuszt a f\u0151 term\u00e9kr\u0151l.<\/p>\n\n\n\n<figure class=\"wp-block-image size-full is-resized\"><img loading=\"lazy\" decoding=\"async\" width=\"1787\" height=\"1538\" src=\"https:\/\/www.shoprenter.hu\/blog\/wp-content\/uploads\/2026\/01\/termek-section-2.webp\" alt=\"term\u00e9koldal r\u00e9szletek\" class=\"wp-image-24018\" style=\"width:1208px;height:auto\" srcset=\"https:\/\/www.shoprenter.hu\/blog\/wp-content\/uploads\/2026\/01\/termek-section-2.webp 1787w, https:\/\/www.shoprenter.hu\/blog\/wp-content\/uploads\/2026\/01\/termek-section-2-1024x881.webp 1024w, https:\/\/www.shoprenter.hu\/blog\/wp-content\/uploads\/2026\/01\/termek-section-2-768x661.webp 768w, https:\/\/www.shoprenter.hu\/blog\/wp-content\/uploads\/2026\/01\/termek-section-2-1536x1322.webp 1536w\" sizes=\"(max-width: 1787px) 100vw, 1787px\" \/><\/figure>\n\n\n\n<h2 class=\"wp-block-heading\">Mit\u0151l akad\u00e1lymentes egy webshop design?<\/h2>\n\n\n\n<p>Az akad\u00e1lymentes design azt jelenti, hogy a web\u00e1ruh\u00e1zat min\u00e9l t\u00f6bben, min\u00e9l kevesebb akad\u00e1llyal tudj\u00e1k haszn\u00e1lni. Akkor is, ha valaki gyeng\u00e9bben l\u00e1t, csak billenty\u0171zettel tud navig\u00e1lni, k\u00e9perny\u0151olvas\u00f3t haszn\u00e1l, vagy \u00e9pp mobilon, rossz f\u00e9nyviszonyok k\u00f6z\u00f6tt b\u00f6ng\u00e9szik. A c\u00e9l nem \u201cextra funkci\u00f3k\u201d hozz\u00e1ad\u00e1sa, hanem egy \u00e9rthet\u0151bb, biztosabban haszn\u00e1lhat\u00f3 fel\u00fclet.<\/p>\n\n\n\n<p>Gyakorlatban ez olyan alapokon m\u00falik, mint a j\u00f3 kontrasztok \u00e9s olvashat\u00f3s\u00e1g, a logikus fel\u00e9p\u00edt\u00e9s \u00e9s k\u00f6vetkezetes komponensek, a j\u00f3l l\u00e1that\u00f3 f\u00f3kusz\u00e1llapotok, valamint az, hogy a gombok, \u0171rlapok, men\u00fck \u00e9s visszajelz\u00e9sek (hib\u00e1k, siker\u00fczenetek) egy\u00e9rtelm\u0171en \u00e9rtelmezhet\u0151k legyenek.<\/p>\n\n\n\n<p>Ugyanilyen fontos, hogy a webshop billenty\u0171zettel is v\u00e9gigj\u00e1rhat\u00f3 legyen, \u00e9s a tartalom technikailag is \u00fagy \u00e9p\u00fclj\u00f6n fel, hogy a seg\u00e9deszk\u00f6z\u00f6k (p\u00e9ld\u00e1ul k\u00e9perny\u0151olvas\u00f3k) helyesen tudj\u00e1k \u00e9rtelmezni. Ha egy oldal akad\u00e1lymentes, kevesebb a bizonytalans\u00e1g, kevesebb a hib\u00e1z\u00e1si lehet\u0151s\u00e9g \u00e9s kevesebb lemorzsol\u00f3d\u00e1s is.<\/p>\n\n\n\n<p>Ha k\u00edv\u00e1ncsi vagy, milyen szempontok ment\u00e9n \u00e9rdemes v\u00e9gigellen\u0151rizni egy webshopot, hogy megfelel-e az akad\u00e1lymentes szab\u00e1lyoknak, \u00f6sszeraktunk egy checklistet, ami seg\u00edthet ebben. <a href=\"https:\/\/landing.shoprenter.hu\/akadalymentes-webaruhaz\/\" target=\"_blank\" rel=\"noreferrer noopener\">Ingyenesen let\u00f6ltheted ezen az oldalon.<\/a><\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Akad\u00e1lymentes webshop ak\u00e1r 1 napon bel\u00fcl<\/h2>\n\n\n\n<p>Nem akarsz az ellen\u0151rz\u0151 list\u00e1val b\u00edbel\u0151dni, ink\u00e1bb gyors megold\u00e1st keresel? Akkor a <a href=\"https:\/\/register.shoprenter.hu\/hamburg-tema\" target=\"_blank\" rel=\"noreferrer noopener\">Hamburg t\u00e9ma<\/a> haszn\u00e1lat\u00e1t javasoljuk sz\u00e1modra, ak\u00e1r \u00e1talak\u00edt\u00e1sokkal, mint ahogyan a Vil\u00e1g\u00edt\u00e1sCenter eset\u00e9ben is t\u00f6rt\u00e9nt.<\/p>\n\n\n\n<p>Ez a t\u00e9ma m\u00e1r az EU-s akad\u00e1lymentess\u00e9gi elv\u00e1r\u00e1sok szerint \u00e9p\u00fclt fel, billenty\u0171zet-navig\u00e1ci\u00f3val, k\u00e9perny\u0151olvas\u00f3-kompatibilit\u00e1ssal \u00e9s optimaliz\u00e1lt strukt\u00far\u00e1val.<\/p>\n\n\n\n<p><strong>V\u00e1lts Hamburgra, hogy a web\u00e1ruh\u00e1zad k\u00e9szen \u00e1lljon arra, hogy minden v\u00e1s\u00e1rl\u00f3 k\u00f6nnyen eligazodjon az oldaladon! <a href=\"https:\/\/www.shoprenter.hu\/fejleszto-berles\" target=\"_blank\" rel=\"noreferrer noopener\">Seg\u00edts\u00e9g\u00fcnkkel ak\u00e1r 1 napon bel\u00fcl meg\u00fajulhat a web\u00e1ruh\u00e1zad!<\/a><\/strong><\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter size-full\"><a href=\"https:\/\/www.shoprenter.hu\/fejleszto-berles\" target=\"_blank\" rel=\"noreferrer noopener\"><img loading=\"lazy\" decoding=\"async\" width=\"839\" height=\"200\" src=\"https:\/\/www.shoprenter.hu\/blog\/wp-content\/uploads\/2025\/11\/temavaltas-hamburg.png\" alt=\"\" class=\"wp-image-23480\" srcset=\"https:\/\/www.shoprenter.hu\/blog\/wp-content\/uploads\/2025\/11\/temavaltas-hamburg.png 839w, https:\/\/www.shoprenter.hu\/blog\/wp-content\/uploads\/2025\/11\/temavaltas-hamburg-768x183.png 768w\" sizes=\"(max-width: 839px) 100vw, 839px\" \/><\/a><\/figure><\/div>\n\n\n<style>\n.sr-author {\n  display: flex;\n  gap: 16px;\n  background-color: #F1F1F1;\n  padding: 20px;\n  border-radius: 12px;\n}\n\n.sr-author-img img {\n  width: 100px;\n  height: 100px;\n  border-radius: 50%;\n  object-fit: cover;\n}\n\n.sr-author-desc {\n  font-size: 15px;\n  line-height: 1.5;\n}\n<\/style>\n\n<h3>A szerz\u0151r\u0151l:<\/h3>\n<div class=\"sr-author\">\n<div class=\"sr-author-img\"><img decoding=\"async\" src=\"https:\/\/www.shoprenter.hu\/blog\/wp-content\/uploads\/2022\/09\/64893035_2521851461171901_2293678253082148864_n.jpg\" alt=\"Engi Laura\"><\/div>\n<div class=\"sr-author-desc\"><span class=\"sr-author-name\">Engi Laura<\/span><br><span class=\"sr-author-pos\">Online marketer &#8211; <\/span><a href=\"https:\/\/www.shoprenter.hu\/\" target=\"_blank\" rel=\"noopener noreferrer\"> Shoprenter<\/a><br>Laura a Shoprenter marketing csapat\u00e1nak tagja. Az online marketing \u00e9s az e-kereskedelemi trendek m\u00e1r 2016 \u00f3ta szerves r\u00e9sz\u00e9t k\u00e9pezik a mindennapjainak. C\u00e9lja, hogy \u00e1tadja az \u00e9vek sor\u00e1n megszerzett tud\u00e1s\u00e1t \u00e9s tapasztalatait a fejl\u0151dni \u00e9s n\u00f6vekedni v\u00e1gy\u00f3 e-keresked\u0151knek.\n<\/div>\n<\/div>\n","protected":false},"excerpt":{"rendered":"<p>A Vil\u00e1g\u00edt\u00e1scenter.hu m\u00f6g\u00f6tt egy t\u00f6bb \u00e9vtizedes m\u00falttal rendelkez\u0151 hazai villamoss\u00e1gi v\u00e1llalkoz\u00e1s \u00e1ll: az Orb\u00e1n &#8230;<\/p>\n<p class=\"read-more-link\"><a class=\"btn btn-outline-primary btn-xs understrap-read-more-link\" href=\"https:\/\/www.shoprenter.hu\/blog\/igy-szuletett-meg-a-vilagitascenter-akadalymentes-webshopja\">Elolvasom<\/a><\/p>\n","protected":false},"author":68,"featured_media":24039,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[18,19,17],"tags":[],"_links":{"self":[{"href":"https:\/\/www.shoprenter.hu\/blog\/wp-json\/wp\/v2\/posts\/24008"}],"collection":[{"href":"https:\/\/www.shoprenter.hu\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.shoprenter.hu\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.shoprenter.hu\/blog\/wp-json\/wp\/v2\/users\/68"}],"replies":[{"embeddable":true,"href":"https:\/\/www.shoprenter.hu\/blog\/wp-json\/wp\/v2\/comments?post=24008"}],"version-history":[{"count":16,"href":"https:\/\/www.shoprenter.hu\/blog\/wp-json\/wp\/v2\/posts\/24008\/revisions"}],"predecessor-version":[{"id":24215,"href":"https:\/\/www.shoprenter.hu\/blog\/wp-json\/wp\/v2\/posts\/24008\/revisions\/24215"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.shoprenter.hu\/blog\/wp-json\/wp\/v2\/media\/24039"}],"wp:attachment":[{"href":"https:\/\/www.shoprenter.hu\/blog\/wp-json\/wp\/v2\/media?parent=24008"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.shoprenter.hu\/blog\/wp-json\/wp\/v2\/categories?post=24008"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.shoprenter.hu\/blog\/wp-json\/wp\/v2\/tags?post=24008"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}