د SEO لارښود ګام ۵: UX / د کاروونکي تجربه — څنګه د لیدونکو تجربه ستاسو د ویب پاڼې درجه بندي اغیزه کوي
د SEO لارښود ګام ۵: UX / د کاروونکي تجربه
دا د ۱۳ ګامه SEO لارښود پنځم ګام دی. د کاروونکي تجربه اوس د مستقیمې درجه بندي فکتور دی — Google اندازه کوي چې لیدونکي څنګه ستاسو سره تعامل کوي او هغه ویب پاڼې انعام ورکوي چې چټک، قابل لاسرسی، او خوښونکي تجربې وړاندې کوي.
د محتوا ستراتیژي (ګام ۳) ټاکي چې تاسو څه خپریدئ. د لینک جوړونه (ګام ۴) ستاسو واکمني ثابتوي. مګر که لیدونکي ستاسو په پاڼه کې راښکته شي او سمدلاسه د دې له امله چې دا ورو، په موبایل کې خراب، یا د لاسرسي وړ نه وي — هیڅ شی مهم نه دی. Google دا سیګنالونه تعقیبوي او د درجه بندي سمونې لپاره یې کاروي.
له ۲۰۲۱ کال راهیسې، د Google د پاڼې تجربې تازه معلوماتو UX ته د یو تایید شوي درجه بندي فکتور کړی دی. په ۲۰۲۴ کې، INP (Interaction to Next Paint) د Core Web Vital په توګه FID reemplazó کړ. په ۲۰۲۶ کې، دغه سیګنالونه لا هم زیات وزن لري ځکه چې Google د کاروونکي د رضایت میتریکس ته د دودیزو سیګنالونو پرځای زیات پام کوي.
UX د SEO لپاره څه پوښي
د SEO لپاره د UX اصلاح ۶ برخې لري:
- Core Web Vitals — د Google رسمي UX میتریکونه (LCP, INP, CLS)
- د موبایل اصلاح — د ځواب ویونکي طراحی، د تماس هدفونه، ویوپورټ
- د لاسرسي (WCAG) — ستاسو ویب پاڼه د ټولو لپاره کارول کیدونکي جوړول
- د پاڼې تجربې سیګنالونه — HTTPS، هیڅ منځپانګې، خوندي براوزینګ
- د نیویګیشن نمونې — د کاروونکو او کڕونکو سره مرسته کونکي پاڼې جوړښت
- تر لوړ خط لاندې اصلاح — کاروونکي څه ګوري پرته له دې چې سکرول وکړي
۱. Core Web Vitals (CWV)
Core Web Vitals د Google درې اندازه کیدونکي UX میتریکونه دي. دا په Chrome User Experience Report (CrUX) کې تعقیبیدل کیږي او مستقیم د درجې باندې تاثیر کوي.
درې میتریکونه:
| میتریک | اندازه ګیري | ښه | د ښه کولو اړتیا | خراب | |--------|----------|------|-------------------|------| | LCP (Largest Contentful Paint) | د بار کولو سرعت | < 2.5s | 2.5s - 4.0s | > 4.0s | | INP (Interaction to Next Paint) | ځواب ویونکي توب | < 200ms | 200ms - 500ms | > 500ms | | CLS (Cumulative Layout Shift) | بصری ثبات | < 0.1 | 0.1 - 0.25 | > 0.25 |
LCP — د لوی محتوا رنګ
LCP اندازه کوي چې ستاسو د پاڼې اصلي محتوا څومره ژر لیدل کیږي. "لوی محتوا" په عموم کې ستاسو د هيرو انځور، اصلي سرلیک، یا تر لوړ خط لاندې لوی بلاک دی.
عام LCP ستونزې او حلونه:
| ستونزه | اغیزه | حل | |---------|--------|-----| | د ناپاکه هيرو انځور | +2-5s | WebP شکل، سمه اندازه، fetchpriority="high" | | د رینډر کولو مسدودول CSS/JS | +1-3s | انتقالي مهم CSS، غیر مهم سمول | | د ورو سرور ځواب (TTFB) | +1-4s | CDN، سرور کaching، د سرحدي پراختیا | | د ویب فونټونه رینډر مسدودول | +0.5-2s | font-display: swap, مهم فونټونه مخکې بارول | | د دریمې ډلې سکریپټونه | +1-3s | د تحلیلي/چت ویدجټونه غیرمستقیم، د اعلانونو بېځایه بارول |
د LCP اصلاح لومړیتوب:
<!-- ۱. د LCP انځور مخکې بارول -->
<link rel="preload" as="image" href="/hero.webp" fetchpriority="high">
<!-- ۲. انتقالي مهم CSS (لومړۍ ۱۴KB) -->
<style>/* یوازې د تر لوړ خط لاندې سټایل */</style>
<!-- ۳. غیر مهم CSS غیرمستقیم کول -->
<link rel="stylesheet" href="/full.css" media="print" onload="this.media='all'">
<!-- ۴. هيرو انځور د واضح ابعادو سره -->
<img src="/hero.webp" width="1200" height="600"
fetchpriority="high" decoding="async"
alt="توصیفي متن">
چټک ګټه: خپل د کور پاڼه پر PageSpeed Insights چل کړئ. د LCP عنصر چې دا مشخصوي ته وګورئ. که دا یو انځور وي، WebP ته بدل کړئ، واضح عرض/ارتفاع ترتیب کړئ، او fetchpriority="high" اضافه کړئ. دا په خپله اکثره وخت LCP له ۱-۲ ثانیو پورې کموي.
INP — تعامل تر بل رنګ پورې
INP اندازه کوي چې خلک ستاسو پاڼه څومره ژر ځواب ورکوي کله چې د خلکو تعامل وکړي (کلیک، ټاپ، ټایپ). دا د پاڼې لیدنې پرمهال د تر ټولو بدترین تعامل په نښه کوي او د سکور په توګه یې کاروي.
عام INP ستونزې او حلونه:
| ستونزه | اغیزه | حل | |---------|--------|-----| | اوږدې JavaScript دندې | +200-1000ms | په کوچني دندې تقسیم کړئ، requestIdleCallback وکاروئ | | دخیل ایونټ هینډلرونه | +100-500ms | د بونوس کولو، throttle کول، requestAnimationFrame وکاروئ | | د ترتیب ټراش کول | +50-300ms | تبادله د DOM لوستلو/لیکل، will-change وکاروئ | | د دریمې ډلې سکریپټونه | +100-500ms | غیرمستقیم کړئ، د تعامل وروسته پورته کړئ، Web Workers وکاروئ | | سنکرونس API زنګونه | +200-2000ms | Async/await، د بارولو حالتونه، خوشبین UI |
د INP اصلاح تخنیکونه:
// خراب: د اصلي تار بندونکی
button.addEventListener('click', () => {
const data = heavyComputation(); // د 400ms لپاره بندوي
updateDOM(data);
});
// ښه: د اصلي تار ته تسلیم
button.addEventListener('click', async () => {
// سمدستي فعالیت څرګند کړئ
button.textContent = 'بارول...';
// درانه کار د ټوټو په شکل کې تسلیم کړئ
await scheduler.yield();
const data = heavyComputation();
await scheduler.yield();
updateDOM(data);
});
چټک ګټه: Chrome DevTools > د فعالیت ټب پرانیزئ. خپل ځای ته ننوتل وکړئ او "لوی دندې" (سرې مثلثونه) ته وګورئ. دا د اصلي تار بندوي. تر ټولو لویه اوږده دنده اکثره د دریمې ډلې سکریپټ وي — غیرمستقیم یې کړئ یا دې ته اجازه ورکړئ وروسته له لومړي تعامل بار شي.
CLS — د مجموعي ترتیب بدلول
CLS د بصري ثبات اندازه کوي — د پاڼې محتوا څومره د بارولو پرمهال حرکت کوي. هیڅ شی د کاروونکو په څیر نه دی توشېدای چې کلیک وکړي او پاڼه د دې سره ټکوي چې دوی بل څه کلیک وکړي.
عام CLS ستونزې او حلونه:
| ستونزه | CLS اغیزه | حل | |---------|-----------|-----| | انځورونه چې ابعاد نه لري | 0.1-0.5 | همیشه width او height معلومه کړئ | | تبلیغاتو ورو بارول | 0.1-0.3 | د min-height سره ځای محفوظ کړئ | | ویب فونټونه چې رفلور سبب کیږي | 0.05-0.2 | font-display: optional یا د ابعاد سم کسر | | د متحرک محتوا داخلول | 0.1-0.4 | ځای محفوظ کړئ، content-visibility وکاروئ | | د کوکي بنرونو د محتوا فشار | 0.05-0.2 | د ضمیمې ډیزاین (د فشار لاندې نه) |
د CLS مخنیوي چک لیست:
<!-- همیشه د میډیا لپاره ابعاد مشخص کړئ -->
<img src="photo.webp" width="800" height="600" alt="...">
<video width="1280" height="720"></video>
<iframe width="560" height="315"></iframe>
<!-- د متحرک محتوا لپاره ځای محفوظ کړئ -->
<div style="min-height: 250px;">
<!-- تبلیغ دلته بار شي پرته له دې چې فشار راوړي -->
</div>
<!-- د ځواب ویونکي میډیا لپاره د اړخ تناسب وکاروئ -->
<div style="aspect-ratio: 16/9;">
<img src="..." style="width: 100%; height: 100%; object-fit: cover;">
</div>
چټک ګټه: د خپل د ۱۰ غوره پاڼو باندې هر او ته واضح width او height ځانګړتیاوې اضافه کړئ. دا یواځې بدلون د تر ټولو عام CLS ستونزې کموي — انځورونه بارول او محتوا ښکته کول.
۲. د موبایل اصلاح
Google د موبایل-اول درجه بندي کاروي — ستاسو د موبایل تجربه ستاسو د درجو تجربه ده. که ستاسو ویب پاڼه په موبایل کې خراب وي، نو دا مهم ندي چې د ډیسکتاپ نسخه څومره سمه ده.
د موبایل اصلاح چک لیست:
| عنصر | غوښتنه | عام ناکامي | |---------|-------------|----------------| | د ویوپورټ میتا | width=device-width, initial-scale=1 | بشپړ موجود نه دی | | د تماس هدفونه | لږ ترلږه ۴۴x۴۴px | کوچني لینکونه، ټیټ تڼۍ | | د فونټ اندازه | د بدن متن لږ ترلږه ۱۶px | په موبایل کې ۱۲px نانډره | | د محتوا عرض | هیڅ افقي سکرو کول نشته | ثابت عرض عناصر | | د ټپ فضا | لږ ترلږه ۸px د هدفونو ترمنځ | نږدې لینکونه سره اړيکه لري | | ځواب ویونکي انځورونه | srcset د مناسب ابعادو سره | د ډیسکتاپ وړتیا لرونکي انځورونه پر موبایل |
د ځواب ویونکي ڈیزاین نمونې:
/* د موبایل-اول چلند */
.container {
padding: 16px;
font-size: 16px;
}
/* د ټچ لپاره دوستانه هدفونه */
.button, .link {
min-height: 44px;
min-width: 44px;
padding: 12px 16px;
}
/* ځواب ویونکی تایپوگرافی */
h1 { font-size: clamp(1.5rem, 4vw, 3rem); }
p { font-size: clamp(1rem, 2vw, 1.125rem); }
/* هیڅ افقي overflow نشته */
img, video, iframe {
max-width: 100%;
height: auto;
}
د موبایل SEO سیګنالونه چې Google چک کوي:
- متن پرته له زوم کولو لوستل کیدی شي
- لینکونه/تڼۍ ډیر نږدې نه وي
- محتوا د ویوپورٹ عرض ته ځي (هیڅ افقي سکرو نشته)
- هیڅ Flash یا د ملاتړ وړ ټیکنالوژۍ نشته
- منځپانګې ته د ننوتلو پر مهال منځپانګې نه پوښي
- پاڼه په 4G/3G اتصال باندې چټکه بار کیږي
چټک ګټه: خپل ځای پر خپل موبایل پرانیزئ. هڅه وکړئ هر تڼۍ او لینک کلیک کړئ. که تاسو په غلطي سره د ټارګیټونو ترمنځ کلیک وکړئ، یا اړتیا لرئ ترڅو متن لوستلو لپاره زوم کولو ته اړتیا ولرئ — دا ستاسو د لومړیتوب اصلاحات دي.
۳. د لاسرسي (WCAG)
د لاسرسي مسله یوازې اخلاقي نه ده — دا د SEO سیګنال دی. د Google الگوریتمونه هغه ویب پاڼو ته لومړیتوب ورکوي چې د هر چا لپاره کارول کیدونکي آسمان، کلیدي-یواځې نیویګیشن، یا بصری کمزوری کاروونکو سره وي. د WCAG (د ویب محتوا د لاسرسي لارښوونې) مطابقت د غوره درجې سره نسبت لري.
د لاسرسي لپاره مهم اړتیاوې:
| عنصر | غوښتنه | د SEO تاثیر | |---------|-------------|------------| | د انځورونو بدیل متن | د ټولو مهم انځورونو لپاره توصیفي متن | مستقیم (د انځور SEO + لاسرسي) | | د سرلیک ترتیب | H1 → H2 → H3 پرته له پخوانیو | مستقیم (د محتوا جوړښت) | | د رنګ تضاد | د عادي متن لپاره ۴.۵:۱، د لوړو متن لپاره ۳:۱ | غیر مستقیم (استعمال) | | د کیلي لوستلو نیویګیشن | ټول تفاعلي عناصر د Tab له لارې لاسرسی کیدی شي | غیر مستقیم (استعمال) | | ARIA لیبلونه | د اېکنونو، تڼیو لپاره لیبلونه چې متن نلري | غیر مستقیم (د سکرین لوستونکي UX) | | د فوکس نښې | د کیلي لوستلو نیویګیشن لپاره لیدل شوی فوکس حلقه | غیر مستقیم (استعمال) | | د فورم لیبلونه | هر انپوت باید یو تړلی ولري | غیر مستقیم (استعمال) | | د لینک متن | توصیفي (نه "دلته کلیک وکړئ") | مستقیم (د انکر متن SEO) |
د لاسرسي ازموینې پروسه:
- اتوماتیک سکین — د Lighthouse، axe-core، یا WAVE چل کړئ (شاوخوا ~۳۰-۵۰٪ مسلې نیسي)
- د کیلي ازموینه — یوازې د Tab، Enter، Escape له لارې خپل ټول ویب پاڼه نیویګیشن کړئ
- د سکرین لوستونکي ازموینه — د کلیدي پاڼو لپاره VoiceOver (Mac) یا NVDA (Windows) وکاروئ
- د رنګ تضاد — ټول متن د شالیدونو خلاف چیک کړئ (د DevTools رنګ چیکر وکاروئ)
- د زوم آزموینه — ۲۰۰٪ ته زوم وکړئ — ایا هر څه لا هم کار کوي؟
عام د لاسرسي حلونه:
<!-- انځورونه: توصیفي بدیل متن -->
<img src="chart.png" alt="د بار چارټ چې د جنورۍ څخه تر مارچ ۲۰۲۶ پورې په اورګانیک ترافیک کې ۴۰٪ زیاتوالی ښیي">
<!-- تڼۍ: واضح لیبلونه -->
<button aria-label="د نیویګیشن مینو بندول">
<svg>...</svg> <!-- تنها د آیکون تڼۍ د aria-label ته اړتیا لري -->
</button>
<!-- فورمونه: تړلی لیبلونه -->
<label for="email">د برېښنالیک پته</label>
<input type="email" id="email" name="email" required>
<!-- لینکونه: توصیفي متن -->
<a href="/guide">د بشپړ SEO لارښود ولولئ</a>
<!-- نه: <a href="/guide">دلته کلیک وکړئ</a> -->
<!-- د کیلي کاروونکو لپاره د نیویګیشن اووښتنه -->
<a href="#main-content" class="skip-link">اصلي محتوا ته لاړ شئ</a>
چټک ګټه: د خپل د کور پاڼه په Lighthouse کې چل کړئ د لاسرسي کټګورۍ سره. لومړی هر څه چې "ناکام" دي ترمیم کړئ — دا اکثره د بدیل متن نه شتون، د فورم لیبلونه نه شتون، او کم رنګ تضاد دي. دا حلونه اکثره ۳۰ دقیقې وخت نیسي او ستاسو نمره له ۲۰+ پوائنټونو څخه پورته کوي.
۴. د پاڼې تجربې سیګنالونه
د Core Web Vitals ترمنځ، Google څو نور د پاڼې تجربې سیګنالونه ارزوي چې د درجې باندې تاثیر لري.
د پاڼې تجربې عوامل:
| سیګنال | غوښتنه | چک | |--------|-------------|-------| | HTTPS | ټوله ویب پاڼه د HTTPS له لارې وړاندې کیږي | مخلوط محتوا دا معطلوي | | هیڅ مخنیویونکي منځپانګې نه | د راتګ پر مهال محتوا نه پوښي | pops پوپونه چې >۳۰٪ پوپ کړي دي په موبایل | | خوندي بروزرې | هیڅ ویرویس، فیشینګ، فریب محتویات نشته | د Google خوندي بروزرې حالت | | د موبایل دوستانه | د موبایل دوستانې ازموینې سره تیر | د Google موبایل دوستانه ازموینه | | هیڅ د فریب 광고 | تبلیغاتو چې محتوا سره ورته وي | د مچتلو بارونه |
د منځپانګې د لارښوونو شرایط (چی څه اجازه لري او څه تعقیب کیږي):
| اجازه شوي | تعقیب شوي | |---------|-----------| | د عمر د تصدیق (حقوقي اړتیا) | د پاڼې د ننوتلو پر مهال بشپړ سکرین پوپ | | د کوکي موافقه (حقوقي اړتیا) | د ایمیل لاګ ان چې د ټول محتویات پوښي | | د خپرونکو محتوا لپاره لاګ ان دیوالونه | د "زموږ اپلیکیشن ډاونلوډ کړئ" د محتوي خندا | | کوچني ترويجاتي بینرونه چې د سکرین تر ۳۰٪ څخه کم وي | د محتوا د لاسرسي څخه دمخه د شمیرنې ټایمرونه | | د کاروونکي سکرول/تفاعل وروسته | د کاروونکي ګمارلو مخکې |
HTTPS چک لیست:
- [ ] د SSL سند معتبر او توکی نه دی غزولی
- [ ] ټول پاڼې HTTP → HTTPS (301) ته لارښود کیږي
- [ ] هیڅ مخلوط محتوا (HTTP تشکیلات د HTTPS پاڼو باندې)
- [ ] HSTS سرلیک پرمخ ځینی (د سرونه شامل کړئ)
- [ ] داخلي لینکونه د HTTPS کاروي (نه HTTP)
- [ ] د نقشه کاروونکې HTTPS URLs کاروي
- [ ] د کینونیکال ټاګونه د HTTPS کاروي
چټک ګټه: د مخلوط محتوا لپاره چک وکړئ — په خپلو مهمو پاڼو کې د DevTools کنسول پرانیزئ. د هرې "مخلوط محتوی" خبرتیاوې د HTTPS پاڼې کې HTTP سرچینې باروي. دغه URLs تر HTTPS تازه کړئ. دا د پاڼې تجربې تر ټولو عام ستونزمن حالاتو څخه دی.
۵. د نیویګیشن نمونې
ښه نیویګیشن نه یوازې د کاروونکو بلکې د لټون انجنونو سره هم مرسته کوي. کاروونکي هغه څه چې اړتیا لري په چټکۍ سره پوهیږي. د Google کښچران ستاسو د ویب پاڼې جوړښت پوهیږي او PageRank په مؤثره توګه توزیع کوي.
د نیویګیشن غوره قوانینو:
| نمونه | ګټه | پلي کول | |---------|---------|----------------| | فلیټ جوړښت | پاڼې د کور څخه ۳ کلیکونو دننه | د هب پاڼې، د سینه پاڼې | | د سینې پاڼې | کاروونکو ته پوهیږي چې چېرته دي | سکیم مارک اپ + څرګند لاره | | منطقي URL جوړښت | وړاندوینې لارې | /category/subcategory/page | | د پاڼې فوتر | ثانوي پاڼې ته وده | قانوني، په اړه، اړیکه، نقشه | | داخلي لټون | کاروونکي خاص محتوا موندل | د وړاندیزونو سره د لټون صندوق | | اړوند محتوا | د بونس کموي، د ژوروالی زیاتوي | "اړوند مقالې" برخې |
خپل Ideally ډیزاین:
Homepage (۱ کلیک د هر څه مهمه)
├── /products/ (د کټګورۍ هب — ټول محصولات پیکه)
│ ├── /products/category-a/
│ │ ├── /products/category-a/product-1
│ │ └── /products/category-a/product-2
│ └── /products/category-b/
├── /blog/ (محتوا هب — ټول مقالې پیکه)
│ ├── /blog/topic-cluster-1/ (پیلر پاڼه)
│ │ ├── /blog/subtopic-1a
│ │ └── /blog/subtopic-1b
│ └── /blog/topic-cluster-2/
├── /tools/ (د ګټو پاڼې)
└── /about/ (د باور پاڼې)
د سینې پاڼې نیویګیشن:
<!-- د سینې پاڼې څرګنده -->
<nav aria-label="Breadcrumb">
<ol>
<li><a href="/">کور</a></li>
<li><a href="/blog/">بلاګ</a></li>
<li aria-current="page">د SEO لارښود ګام ۵</li>
</ol>
</nav>
<!-- سکیم مارک اپ (BreadcrumbList) -->
<script type="application/ld+json">
{
"@context": "https://schema.org",
"@type": "BreadcrumbList",
"itemListElement": [
{ "@type": "ListItem", "position": 1, "name": "کور", "item": "https://example.com/" },
{ "@type": "ListItem", "position": 2, "name": "بلاګ", "item": "https://example.com/blog/" },
{ "@type": "ListItem", "position": 3, "name": "د SEO لارښود ګام ۵" }
]
}
</script>
د نیویګیشن سره ریډ فلیګونه:
- پاڼې د کورپاڼې څخه ۴ کلیکونو څخه ډیر (ډیر ژور)
- هیڅ سینې پاڼې نشته (کاروونکي او Google سیاق له لاسه ورکوي)
- یوازې د JavaScript نیویګیشن (کښچران ممکن لینکونه له لاسه ورکړي)
- یتیم پاڼې (هیڅ داخلي لینکونه پکې نشته)
- د ۲۰۰+ لینکونو سره میګا مینو (د هر لینک ارزښت کموي)
چټک ګټه: د خپلو مهمو تبادلې پاڼو چک کړئ — د کورپاڼې څخه څو کلیکونه؟ که له ۳ زیات وي، د کورپاڼې یا د کټګورۍ د هبونو څخه مستقیم لینکونه اضافه کړئ. هر ژور کلیک د کاروونکو لیدنې او د کښچرو فریکوینسي کموي.
۶. تر لوړ خط لاندې اصلاح
څه چې کاروونکي د سکرول کولو دمخه ګوري ټاکي چې ایا دوی پاتې کیږي یا لاړ شي. د تر لوړ خط لاندې محتوا باید سمدستي ارزښت څرګند کړي او د دې لټون پوښتنې سره سمون ولري چې دوی هلته راوستلي.
د تر لوړ خط لاندې ضروري توکي:
| عنصر | ولې | عام ناکامي | |---------|-----|----------------| | واضح سرلیک (H1) | د پوښتنې سره تړاو تاییدوي | عمومی یا نشتوالی | | د ارزښت وړاندې کول | ولې باید پاتې شي؟ | د خط لاندې دلته پټ دی | | لومړنۍ CTA | دوی باید څه وکړي؟ | پټه یا ناڅرګنده | | هيرو انځور/میډیا | بصری ښکیلتیا | ورو بارول، د LCP ستونزې | | د اعتماد نښې | ولې باید تاسو ته باور ولري؟ | هیڅ لوگو، بیاکتنې، یا تصدیقونه نشته |
د تر لوړ خط لاندې لارښود نمونې:
دیسکتاپ (۱۴۴۰px ویوپورټ):
┌──────────────────────────────────────┐
│ نیویګیشن بار │
├──────────────────────────────────────┤
│ │
│ H1: واضح سرلیک چې د پوښتنې سره تړاو لري│
│ فرعي سرلیک: د ارزښت وړاندې کول │
│ │
│ [لومړنۍ CTA تڼۍ] │
│ │
│ د اعتماد نښې: لوگو، ارقام، نښانونه │
│ │
├──────────────────────────────────────┤
│ ↓ محتوا لاندې دوام لري │
└──────────────────────────────────────┘
موبایل (۳۷۵px ویوپورټ):
┌────────────────────┐
│ نیو (همبرګر) │
├────────────────────┤
│ │
│ H1: سرلیک │
│ (په موبایل کې لنډ)│
│ │
│ [CTA تڼۍ] │
│ (پوره عرض، ۴۴px+) │
│ │
│ د اعتماد نښه │
│ │
├────────────────────┤
│ ↓ د نورو لپاره سکرول │
└────────────────────┘
د تر لوړ خط لاندې مهم قوانین:
- H1 باید پرته له سکرول کولو لیدل کیدی شي (د لټون پوښتنې سره سمون لري)
- CTA باید پرته له سکرول کولو لیدل کیدی شي (د بونس کمول)
- په تر لوړ خط لاندې محتوا کې هیڅ ترتیب بدل نشته (CLS وژونکی)
- هيرو انځور باید چټک بار شي (دا اکثره د LCP عنصر وي)
- موبایل: په تر لوړ خط لاندې محتوا کموئ (د ویوپورټ د حوزې کموالي)
چټک ګټه: د خپل د کور پاڼه په موبایل کې (۳۷۵px عرض) سکرین شاټ واخلئ. ایا H1 لیدل کیږي؟ ایا CTA تڼۍ لیدل کیږي؟ ایا تاسو دوه ثانیې ته اړتیا لرئ ترڅو پوه شئ چې ویب پاڼه څه کوي؟ که کوم ځواب "هو" نه وي، نو تاسو د هغو لیدونکو له لاسه ورکولو کې یاست مخکې له دې چې سکرول وکړي.
د UX آډیټ چک لیست
د دې لپاره مخکې لاړ شئ د خپلو غوره پاڼو لپاره:
- [ ] LCP تر ۲.۵ ثانیو لاندې (د هيرو انځور اصلاح شوی، مهم CSS انتقالي دی)
- [ ] INP تر ۲۰۰ms لاندې (هیڅ اوږدې JavaScript دندې د تعامل مخه نه نیسي)
- [ ] CLS تر ۰.۱ لاندې (ټول انځورونه ابعاد لري، هیڅ ورو بارولو کې بدل نشته)
- [ ] د موبایل دوستانه (۴۴px د ټچ هدفونه، ۱۶px+ متن، هیڅ افقي سکرو نشته)
- [ ] د لاسرسي وړ (بدیل متن، د سرلیک ترتیب، د رنګ تضاد، د کیلي نوشت)
- [ ] HTTPS هر چیرته (هیڅ مخلوط محتوا، HSTS فعال دی)
- [ ] هیڅ مخنیویونکی منځپانګې نه (د موافقت پوښونه مناسب دي، د محتویاتي پوپونه دي نه)
- [ ] د سینې پاڼې شتون لري (د BreadcrumbList سکیم سره)
- [ ] د نیویګیشن عمق د هر مهمې پاڼې لپاره له ۴ کلیکونو کم
- [ ] تر لوړ خط لاندې اصلاح شوی (H1 لیدل کیږي، CTA لیدل کیږي، چټک LCP)
څنګه LANGR ستاسو UX سکین کوي
LANGR د UX اړونده سکین ماډلونه شاملوي:
- د Core Web Vitals ماډل — LCP، INP، CLS د Chrome User Experience Report (حقیقي کاروونکي ډاډ)
- د PageSpeed ماډل — د بشپړ Lighthouse فعالیت آډیت د موبایل او ډیسکتاپ نمرې سره
- د موبایل ماډل — د ویوپورټ تنظیمات، د ټچ هدف اندازه، د متن لوستلو وړتیا
- د لاسرسي ماډل — د WCAG مطابقت چکونه، د ARIA استعمال، د رنګ تضاد
- د ترتیب سکین ماډل — د موبایل او ډیسکتاپ ترتیبونو AI-powered ارزونه
- د پاڼې تجربې ماډل — د منځپانګې کشف، د HTTPS حالت، خوندي براوزنګ
دا ماډلونه هر یو سکین کې چلول کیږي، تاسو ته د دې بصیرت پراخ کتل په لټه کې ده چې د لیدونکو د تجربې په توګه څنګه کار کوي — او د غوره درجې لپاره دقیق څه شی د اصلاح کولو ځواب.
عام د UX غلطي (د تاثیر پر بنسټ)
۱. موبایل ته لاس نه ورکول — ۶۰٪+ د لټونونه موبایل دي؛ خراب موبایل = خراب درجې ۲. د اصلاح شوې انځورونه — د ورو LCP تر ټولو لویه لامل (او اکثره اسانه حل) ۳. هیڅ واضح انځور ابعاد نشته — د ترتیب بدلول CLS نمرې خرابوي ۴. د دریمې ډلې سکریپټونه — د چت ویدجټونه، تحلیلي، اعلانونه چې INP بندوي ۵. د لاسرسي بنسټیزونه کم وي — هغه بدیل متن نلري، د سرلیک ترتیب نشته، تضاد نلري ۶. د منځپانګې مخنیویونکي منځپانګې — بشپړ سکرین پوپونه مخکې له دې چې کارونکي محتوا وویني ۷. ژور ویب پاڼه جوړښت — مهم پاڼې د کورپاڼې څخه ۵+ کلیکونو کې دفن شوي ۸. په تر لوړ خط لاندې ارزښت نلري — کاروونکي نشي کولی وګوري چې ویب پاڼه څه کوي پرته له سکرول کولو
اوس څه؟
ګام ۶: مراقبت او درجه بندي — تاسو هغه څه نه شئ ښه کولی چې تاسو یې نه ارزیابي کوئ. د کلیدي معافیتونو ځایونه، د درجې نمرې، د بدلون راپورونه، او د سپریدو مراقبت.
دا لارښود د LANGR د ۱۳ ګامه SEO لړۍ یوه برخه ده. د وړیا آډیت چل کړئ تر څو وګورئ چې ستاسو ویب پاڼه د ټولو ۱۳ ډسپلینونو په سرتاسر کې کوم ځای لري.