πŸͺŸ
Veb-sayt

Popup modal dizayn: foydalanuvchi e'tiborini tortish, bezor qilmasdan

04.04.2027
← Barcha maqolalar

Popup modal β€” bu sahifa ustida ochiluvchi alohida ekran. Foydalanuvchi e'tiborini darrov tortadi va aniq harakatga undash. To'g'ri qilingan popup konversiyani 200-400% oshirishi mumkin. Yomon esa β€” foydalanuvchini chiqarib yuborish va Google penalty xavfi. Popup dizayn nazokat va strategiyani talab qiladi.

Popup turlari va maqsadlar

Newsletter signup β€” eng tarqalgan. Email to'plash.

Lead magnet β€” \"Bepul PDF qo'llanmani yuklang\" evaziga email.

Discount/promo β€” \"10% chegirma, hozir yozing\".

Survey β€” foydalanuvchi fikrini olish.

Cookie consent β€” GDPR uchun.

Exit-intent β€” foydalanuvchi chiqib ketmoqchi bo'lganda taklif.

Popup trigger turlari

Time-based β€” sahifaga kelib 30-60 soniyadan keyin. Foydalanuvchi kontentdan ko'ra ulgurdi.

Scroll-based β€” foydalanuvchi 50%+ scroll qilganda. Sahifaga qiziqgani aniq.

Exit-intent β€” foydalanuvchi sahifani tark etmoqchi (mouse browser tab'ga harakat). Hech narsa yo'qotmaysiz.

Click-triggered β€” \"Bepul olish\" tugmasi bossagina popup.

On-page-load β€” sahifaga kelishi bilan. Eng yomon UX β€” Google penalty xavfi.

Google va popup jazo

Google \"intrusive interstitial\" jazolaydi. Mobile'da to'liq ekran popup avtomatik ranking pasayadi.

Yechimlar: 1. Mobile'da popup yo'q yoki kichik. 2. Banner-like (sahifa qismi). 3. On-page-load emas, time-based. 4. Cookie consent β€” \"reasonable\" o'lcham va shaffof.

Popup dizayn elementlari

Backdrop β€” popup ortida qora yarim-shaffof fon. Foydalanuvchi e'tiborini popup'ga qaratadi.

Container β€” popup'ning o'zi. Background oq, border-radius modern (10-15px), shadow.

Close button β€” yuqori o'ngda \"X\" belgi. Aniq ko'rinarli, bosish oson.

Headline β€” katta sarlavha, jozibali.

Body β€” qisqa tushuntirish.

CTA β€” yorqin tugma.

Optional: vizual element (rasm, illustration).

Headline yozish

Popup headline darhol qiymat ko'rsatish. Foydalanuvchi 3 soniyada qaror qiladi.

Yomon: \"Newsletter'imizga qo'shiling\". Generic.

Yaxshi: \"15-sahifali WordPress hosting qo'llanmani PDF formatda bepul oling\". Aniq qiymat.

CTA tugmasi

CTA matn aniq harakat. \"Yuborish\" emas, \"Bepul yuklab oling\".

Yorqin rang β€” sahifa va popup'ning ranglaridan ajralib turuvchi.

Katta o'lcham β€” bosish oson.

Close button

Close button kuchaytirilgan ko'rinishda. Foydalanuvchi yopolish imkonini bilishi shart.

Joylashish: yuqori o'ng burchak.

O'lcham: kamida 24x24px (tap target).

Backdrop click ham close qilishi mumkin (foydalanuvchi tashqaridan bosadi).

ESC tugmasi ham close qilishi shart (accessibility).

Mobile popup dizayni

Mobile'da popup alohida e'tibor β€” Google penalty xavfi.

Strategiya: kichik popup (yarim ekran), banner-like (sahifa qismi), yoki popup'siz mobile.

Close tugma katta β€” barmoq bilan oson bosish.

Single column layout, katta input fields, katta CTA.

Animation

Popup animation: fade-in (oddiy, 200-300ms), slide-down (yuqoridan), scale-in (kichikdan kattaga).

Tez bo'lishi shart β€” 200-300ms. Sekin animation foydalanuvchini bezor qiladi.

Smooth, lekin minimal. \"In-your-face\" animation yomon UX.

Frequency capping

Foydalanuvchi popup'ni yopgan bo'lsa β€” yana darhol ko'rsatish UX dushmani.

Strategiya: 7 kun popup ko'rsatmaslik (localStorage yoki cookie). Foydalanuvchi keyingi tashrifda yana ko'radi.

Subscribe bo'lgan foydalanuvchiga ham popup ko'rsatmaslik.

A/B test popup

Popup A/B test uchun yaxshi joy. Test elementlari: trigger turi va vaqti, headline, lead magnet, CTA tekst, dizayn.

OptinMonster, Sumo β€” popup A/B test platforma.

Tracking va analitika

Popup metrika: ko'rsatish soni, click rate, konversiya rate, close rate.

Yaxshi popup: click rate 5-10%, konversiya rate 3-5%.

Past natija β€” dizayn yoki taklif yaxshilash.

Accessibility

Popup accessibility: focus trap (Tab ichida qoladi), ESC bilan close, screen reader announcements (\"Popup opened\").

aria-modal=\"true\", role=\"dialog\". Screen reader foydalanuvchi bilishi shart.

Common popup xato

1. Darhol ko'rsatish (sahifa kelishi bilan). Eng yomon UX va Google penalty.

2. Generic headline. Hech narsa demaydi.

3. Close tugma yashirilgan yoki kichik. Foydalanuvchi qiynalib yopadi.

4. Frequency capping yo'q. Har sahifada popup.

5. Mobile'da to'liq ekran. Google penalty.

6. Animation sekin. Foydalanuvchini bezor qiladi.

Popup yaxshi misollar

Backlinko (SEO blog): exit-intent popup, \"Get my free SEO checklist\". Aniq qiymat va bepul.

Shopify stores: scroll-based, \"Get 10% off your first order\". Discount + urgency.

SaaS sites: time-based, \"Want to see how X works? Watch our 2-minute demo\". Soft pitch.

Sayt.uz popup strategiyasi

Sayt.uz da popup kam ishlatiladi β€” UX va Google ehtiyot.

Cookie consent β€” sahifa pastida ingichka banner (kontent qismini to'smaydi).

Bosh sahifada 60 soniyada once-only \"Bepul hosting qo'llanma\" lead magnet popup. Frequency capping 14 kun.

Mobile'da popup yo'q β€” Google penalty va UX uchun.

A/B test: \"Bepul qo'llanma\" vs \"15% chegirma\". PDF qo'llanma 32% yaxshi konversiya beradi. Discount short-term kuchli, lekin email sifati past edi.

Natija: popup orqali oyiga 200-400 subscriber. Bosh signup kanal β€” inline blog post oxirida.

O'xshash maqolalar

🌾 Qishloq xo'jaligi va agrobiznes sayti: mahsulotlar katalogi va B2B sotuv ❀️ Xayriya fondi sayti: shaffof xayriya yig'ish va donator ishonchi πŸŽ‰ Toyxona va banket zali sayti: tadbir tashkil qilish va onlayn bron qilish πŸš™ Avtoulov ijarasi sayti: avtomobil katalog, narx kalkulyatori va onlayn bron
🌐 Til
πŸ‡ΊπŸ‡Ώ O'zbek βœ“ πŸ‡ΊπŸ‡Ώ ЎзбСк πŸ‡·πŸ‡Ί Русский πŸ‡¬πŸ‡§ English