SEO ଗାଇଡ୍ ପଦ୍ଧତି 5: UX / ବ୍ୟବହାରକାରୀ ଅଭିଜ୍ଞତା — ଆପଣଙ୍କ ସାଇଟ୍ କେମିତି ପରିଚାଲିତ ହୁଏ ତାହାରେ ବିଜିଟରମାନଙ୍କର ଅନୁଭବ କିପରି ପ୍ରଭାବ ପକାଏ
SEO ଗାଇଡ୍ ପଦ୍ଧତି 5: UX / ବ୍ୟବହାରକାରୀ ଅଭିଜ୍ଞତା
ଏହା ହେଉଛି 13-ପଦ୍ଧତି SEO ଗାଇଡ୍ ର 5ମ ପଦକ୍ଷେପ। ବ୍ୟବହାରକାରୀ ଅଭିଜ୍ଞତା ବର୍ତ୍ତମାନ ସିଦ୍ଧାସରୁ ପ୍ରାଥମିକ ର୍ୟାଙ୍କିଂ ଘଟକ ହୋଇଛି — ଗୁଗୁଲ୍ ଦେଖେ କିପରି ବିଜିଟରମାନେ ଆପଣଙ୍କ ସାଇଟ୍ ସହିତ ପ୍ରତିକ୍ରିୟା କରନ୍ତି ଏବଂ ତେବେ ତଥାଏଁ ସାଇଟ୍ ବହୁତ ଦ୍ରୁତ, ସାଧାରଣ, ଓ ସୁଖଦ ଅଭିଜ୍ଞତା ଦିଅନ୍ତି ଅନୁଗ୍ରହ କରେ।
ବିଷୟବସ୍ତୁ ନୀତି (ପଦ୍ଧତି 3) ନିର୍ଣ୍ଣୟ କରେ କି ଆପଣ କେଉଁଛି ପ୍ରକାଶ କରିବେ। ଲିଙ୍କବିଲ୍ଡିଂ (ପଦ୍ଧତି 4) ଆପଣଙ୍କର ପ୍ରଧାନତ୍ୱ ସାବିତ କରେ। କିନ୍ତୁ ଯଦି ବିଜିଟରମାନେ ବାହାର ହୋଇଥାନ୍ତି ଏବଂ ଏହା ବିଦ୍ୟାମାନରେ, ମୋବାଇଲରେ ଭଙ୍ଗା ଅଥବା ସାଧାରଣ ନୁହେଁ — ସେଥିରେ କିଛି ମାନ ନହିଁ। ଗୁଗୁଲ୍ ଅନୁବାହେ ଏହି ସଙ୍କେତଗୁଡିକୁ ଟ୍ରାକ୍ କରେ ଏବଂ ତାହାକୁ ସୁଦ୍ଧାର ଦେଇ ର୍ୟାଙ୍କିଂକୁ ବଦଳାଇଥାଏ।
2021ରୁ, ଗୁଗୁଲ୍ ର ପୃଷ୍ଠା ଅଭିଜ୍ଞତା ଅଭିକରଣକୁ UX ଏକ ସ୍ଥାୟୀ ର୍ୟାଙ୍କିଂ ଘଟକ ଭାବେ ସ୍ଥାପିତ କରିଛି। 2024ରେ, INP (Interaction to Next Paint) FIDକୁ କୋର୍ ୱେବ୍ ଭାଇଟାଲ୍ସ ଭାବେ ବଦଳାଇଛି। 2026ରେ, ଏହି ସଙ୍କେତଗୁଡିକୁ ଅଧିକ ବଜାୟ ଦିଆଯିବ ଯେପରିକର ବ୍ୟବହାରକାରୀ ସନ୍ତୋଷ ମାପକଗୁଡିକୁ ପ୍ରାଥମିକ ଅଗ୍ରଗତିରେ ରଖାଯିବ।
UX କି ପ୍ରତିଷ୍ଠା କରିଛି
UX ଅପ୍ଟିମାଇଜେସନ୍ ଏସିଓ ପାଇଁ 6 କ୍ଷେତ୍ରକୁ ସାମିଲ କରେ:
- କୋର୍ ୱେବ୍ ଭାଇଟାଲ୍ସ — ଗୁଗୁଲ୍ ଦ୍ୱାରା ନିର୍ଦ୍ଧାରିତ UX ସୂଚକାଙ୍କ (LCP, INP, CLS)
- ମୋବାଇଲ୍ ଅପ୍ଟିମାଇଜେସନ୍ — ପ୍ରତିସ୍ଥା ସୂତ୍ର, ସ୍ପର୍ଶ ପ୍ରଥମ ପେନ୍ଡିଂ, ଦୃଷ୍ୟକୋଣ
- ଆକ୍ସେସିବିଲିଟି (WCAG) — ଆପଣଙ୍କ ସାଇଟ୍ ସମସ୍ତଙ୍କ ପାଇଁ ବ୍ୟବହାର କରୁଛି
- ପୃଷ୍ଠା ଅଭିଜ୍ଞତା ସଙ୍କେତ — HTTPS, କୌଣସି ଅନ୍ତର୍ଗତ ସୂଚନା, ସୁରକ୍ଷିତ ବ୍ରାଉଜିଂ
- ନାଭିଗେସନ୍ ପ୍ୟାଟର୍ନ୍ସ — ବ୍ୟବହାରକାରୀ ଏବଂ କ୍ରଲର୍ସଙ୍କୁ ସାହାଯ୍ୟ କରୁଥିବା ସାଇଟ୍ ଗଠନ
- ଖୁଲା ଭାଗର ଅପ୍ଟିମାଇଜେସନ୍ — ବ୍ୟବହାରକାରୀ କଣ ଦେଖନ୍ତି କିମ୍ବା ଗୁଡିକୁ ବିନା ଗୋଟିକେ ସ୍କ୍ରଲିଂ ଦେଖିଥାନ୍ତି
1. କୋର୍ ୱେବ୍ ଭାଇଟାଲ୍ସ (CWV)
କୋର୍ ୱେବ୍ ଭାଇଟାଲ୍ସ ହେଉଛି ଗୁଗୁଲ୍ ଦ୍ୱାରା ନିର୍ଦ୍ଧାରିତ 3ଟି ପରିମାଣୀୟ 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 — Largest Contentful Paint
LCP ମାପେ କିପରି ଦ୍ରୁତ ବ୍ୟବହାରକାରୀଙ୍କର ପ୍ରଧାନ ବିଷୟବସ୍ତୁ ଦେଖାଯିବାରେ କି ଲମ୍ବା ଗ୍ରହଣ କରେ। "ଲାରଜସ୍ଟ କନ୍ଟେଣ୍ଟ" ସାଧାରଣତଃ ଆପଣଙ୍କର ସ୍ଥାୟୀ ଚିତ୍ର, ପ୍ରଧାନ ଶୀର୍ଷକ, କିମ୍ବା ଖୁଲା ଭାଗର ଅଧିକ ସେକ୍ସନ୍।
ସାମାନ୍ୟ LCP ସମସ୍ୟା ଓ ନିରାକରଣ:
| ସମସ୍ୟା | ପ୍ରଭାବ | ନିରାକରଣ | |---------|--------|----------| | ଅପ୍ଟିମାଇଜ୍ କରାଯାଇନଥିବା ହେରୋ ପ୍ରତିଛବି | +2-5s | WebP ଫର୍ମାଟ୍, ସଠିକ୍ ଆକାର, fetchpriority="high" | | ରେଣ୍ଡର୍-ବ୍ଲକିଂ CSS/JS | +1-3s | Inland କ୍ରିଟିକାଲ CSS, ନନ-କ୍ରିଟିକାଲ ବିଲମ୍ବ କରନ୍ତୁ | | ଧିର ଛିଦ୍ର ପ୍ରତିସ୍ପନ୍ଦନ (TTFB) | +1-4s | CDN, ସେର୍ଭର କ୍ୟାସିଂ, ଏଡ୍ଜ୍ ଡିପ୍ଲୋୟମେଣ୍ଟ | | ଓୟାବ୍ ଫୋଣ୍ଟସ୍ ପ୍ରତିଷ୍ଠା ରେଣ୍ଡର୍ କରିବାକୁ ବାନ୍ଧିଷ୍ଟ | +0.5-2s | font-display: swap, ପ୍ରାଥମିକ ଫୋଣ୍ଟସ୍ ପ୍ରିଲୋଡ୍ | | ତୃତୀୟ ପାକାରି ବିକଳ୍ପରେ ଲୋଡିଂ | +1-3s | ଆନାଲିଟିକ୍ସ/ଚାଟ୍ ଉଇଜେଟ୍ ବିଲମ୍ବ କରିବାକୁ, ଆଡ୍ସକୁ ଲେଜି ଲୋଡ୍ |
LCP ଅପ୍ଟିମାଇଜେସନ୍ ପ୍ରାଥମିକତା:
<!-- 1. LCP ଚିତ୍ର ପ୍ରିଲୋଡ୍ କରନ୍ତୁ -->
<link rel="preload" as="image" href="/hero.webp" fetchpriority="high">
<!-- 2. Inland କ୍ରିଟିକାଲ CSS (ପ୍ରଥମ 14KB) -->
<style>/* ଖୁଲା ଭାଗର ଶୈଳୀଗୁଡିକୁ */</style>
<!-- 3. ନନ-କ୍ରିଟିକାଲ CSS ବିଲମ୍ବ କରନ୍ତୁ -->
<link rel="stylesheet" href="/full.css" media="print" onload="this.media='all'">
<!-- 4. ସୂଚକ ଛବି ସହିତ ସ୍ପଷ୍ଟ ଆକାର -->
<img src="/hero.webp" width="1200" height="600"
fetchpriority="high" decoding="async"
alt="ବିବୃତ୍ତ ଅଲ୍ଟ୍ ଟେକ୍ସଟ୍">
ଶୀଘ୍ର ଲାଭ: ଆପଣଙ୍କର ହୋମପେଜ୍ ଉପରେ PageSpeed Insights ଚଲାନ୍ତୁ। LCP ତତ୍ଥ୍ୟ ସେଗୁଡିକୁ ଦେଖନ୍ତୁ ଯାହା ଆହାର କରିଛି। ଯଦି ଏହା ଜଣାପଡେ, WebPରେ ପରିବର୍ତ୍ତିତ କରନ୍ତୁ, ସଠିକ୍ ଚୌଡ଼ା/ଉଚ୍ଚତା ସେଟ୍ କରନ୍ତୁ, ଏବଂ fetchpriority="high" ଯୋଗ କରନ୍ତୁ। ଏହି ପଢିଲାରେ ଅତିରିକ୍ତ LCPକୁ 1-2 ସେକେଣ୍ଡଏଁ କମ୍ କରିବାକୁ ମାତ୍ର ସହାୟକ ହେବ।
INP — Interaction to Next Paint
INP ମାପେ ବ୍ୟବହାରକାରୀ ବାଜୁଲା କିପରି ସିଧା କିମ୍ବା ଫ୍ଳଲୁ କରେ (କ୍ଲିକ୍, ଟ୍ୟାପ୍, ଲେଖନ)। ବୃହତ ସମସ୍ୟାକୁ ଗଣନା କରେ ଏବଂ ତାହାକୁ ସ୍କୋର୍ କରିବାକୁ ଯୋଗୁ କରେ।
ସାମାନ୍ୟ INP ସମସ୍ୟା ଓ ନିରାକରଣ:
| ସମସ୍ୟା | ପ୍ରଭାବ | ନିରାକରଣ | |---------|--------|----------| | ଦୀର୍ଘ JavaScript କାର୍ଯ୍ୟ | +200-1000ms | ସ୍ମାଲ କାର୍ଯ୍ୟରେ ବିଭାଜିତ କରନ୍ତୁ, requestIdleCallback ବ୍ୟବହାର କରନ୍ତୁ | | ଓଜନଦାର ଘଟଣା ହାଣ୍ଡ୍ଲର୍ସ | +100-500ms | ଡିବାଉନ୍ସ, ଥ୍ରଟଲ୍, requestAnimationFrame ବ୍ୟବହାର କରନ୍ତୁ | | ଗତି ବିଚ୍ଛିନ୍ନ ହେବା | +50-300ms | DOM ପଢାଣ୍ଡା/ଲେଖା ପ୍ରକ୍ରିୟାଗୁଡିକୁ ବ୍ୟବହାର କରନ୍ତୁ, will-change ବ୍ୟବହାର କରନ୍ତୁ | | ତୃତୀୟ ପାକାର ସ୍କ୍ରିପ୍ଟ | +100-500ms | ବିଲମ୍ବ କରନ୍ତୁ, ବ୍ୟବହାରକାରୀର ପରେ ଲୋଡ୍ କରନ୍ତୁ, Web Workers ବ୍ୟବହାର କରନ୍ତୁ | | ସିଙ୍କ୍ ଏପିଆଇ କଲ୍ ଗତି | +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 > Performance ଟ୍ୟାବ୍ ଖୋଲନ୍ତୁ। ଆପଣଙ୍କ ସାଇଟକୁ କ୍ଲିକ୍ କରନ୍ତୁ ଏବଂ "ଦୀର୍ଘ କାର୍ଯ୍ୟ" (ଲାଲ କର୍ଦ୍ଧା) ଖୋଜନ୍ତୁ। ଏହା ମୁଖ୍ୟ ଥ୍ରେଡ୍ ବନ୍ଧ କରୁଛି। ସର୍ବାଧିକ ଦୀର୍ଘ କାର୍ଯ୍ୟ ସାମାନ୍ୟତଃ ଏକ ତୃତୀୟ ପାକାର ସ୍କ୍ରିପ୍ଟ ହୁଏ — ତାହାକୁ ବିଲମ୍ବ କରନ୍ତୁ କିମ୍ବା ପ୍ରଥମ ମିଳନରେ ଲୋଡ୍ କରନ୍ତୁ।
CLS — Cumulative Layout Shift
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>
ଶୀଘ୍ର ଲାଭ: ଆପଣଙ୍କର ଶୀର୍ଷ 10 ପୃଷ୍ଠାରେ ସମସ୍ତ ଏବଂ ଉପରେ ସ୍ପଷ୍ଟ width ଓ height ଗୁଡିକୁ ଯୋଗ କରନ୍ତୁ। ଏହି ଏକଳ ଚେଞ୍ଜ ସର୍ବମୁଖ୍ୟ CLS ସମସ୍ୟାକୁ ଦୂରୀକୃତ କରିଥାଏ — ଚିତ୍ରଗୁଡିକ ଲୋଡ୍ କରିବା ସମୟରେ କଣ ଚୀତା କରୀବାକୁ ଦକ୍ଷ କରେ।
2. ମୋବାଇଲ୍ ଅପ୍ଟିମାଇଜେସନ୍
ଗୁଗୁଲ୍ ମୋବାଇଲ୍-ଫର୍ଷ୍ଟ ଇଣ୍ଡେକ୍ସିଂ ବ୍ୟବହାର କରେ — ଆପଣଙ୍କ ସାଇଟ୍ ମୋବାଇଲ୍ ଅଭିଜ୍ଞତା ଅଟେ ଆପଣଙ୍କର ର୍ୟାଙ୍କିଂ ଅଭିଜ୍ଞତା। ଯଦି ଆପଣଙ୍କର ସାଇଟ୍ ମୋବାଇଲ୍ ଉପରେ ଭଙ୍ଗା ଅଟେ, ତେବେ ସେର ଡେସ୍କଟପ୍ ଅନ୍ୟେ ଅଟେ କେତେ ଗୁଣ ନୁହେଁ।
ମୋବାଇଲ୍ ଅପ୍ଟିମାଇଜେସନ୍ ଚେକ୍ଲିଷ୍ଟ:
| ତତ୍ତ୍ୱ | ଆବଶ୍ୟକତା | ସାମାନ୍ୟ ବିଫଳତା | |---------|-------------|----------------| | ଭ୍ୟୁପୋର୍ଟ୍ ମେଟା | width=device-width, initial-scale=1 | ସମ୍ପୂର୍ଣ ଭାବେ ଅନୁପସ୍ଥିତ | | ସ୍ପର୍ଶ ଲକ୍ଷ୍ୟ | କମ୍ ସିଫଳ 44x44px | ଛୋଟ ଲିଙ୍କ୍, ଭିନ୍ନ ବଟନ୍ | | ଫୋଣ୍ଟ୍ ସାଇଜ୍ | କମ୍ ସିଫଳ 16px ଶରୀର ଲେଖା | 12px ମୋବାଇଲ୍ ଉପରେ ପାଠ୍ୟ | | ସାମଗ୍ରୀ ଚୌଡ଼ା | କୌଣସି ଅଲୈଖିକ ଗତି | ଦୃଢ ଚୌଡ଼ା ସାଧନ | | ଟାପ୍ ଦୂରତା | 8px କମ୍ସିଫଳ ବିଚ୍ଛେଦ | ଆଲିଙ୍କ ଧକଳି | | ପ୍ରତିସ୍ଥାପନ ଚିତ୍ରଗୁଡିକ | 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); }
/* କୌଣସି ଅଲୈଖିକ ପ୍ରବାହ ଶେଷ କରନ୍ତୁ */
img, video, iframe {
max-width: 100%;
height: auto;
}
ମୋବାଇଲ୍ SEO ସଙ୍କେତଗୁଡିକୁ ଗୁଗୁଲ୍ ବିଚାରଣା:
- ଦେଖବାକୁ ଲେଖାକୁ ଜୁମ୍ କରିବା ବିନା ପଢିବା ହେଉଛି
- ଲିଙ୍କ୍/ବଟନ୍ ଅତି ନିକଟ ନୁହେଁ
- ସାମଗ୍ରୀ ଭ୍ୟୁପୋର୍ଟ୍ ଚୌଡ଼ାରେ ହେବାକୁ (କୌଣସି ଅଲୈଖିକ ଗତି)
- କୌଣସି ଫ୍ଲାସ୍ କିମ୍ବା ଅନୁପାୟୋଗାକୁ ଟେକନୋଲୋଜୀ
- ଲୋଡ୍ କରିବା ସମୟରେ ପ୍ରବେଶ ଉପରେ ବର୍ଧ ଦେଶରେ ସର୍ଷର ଅନ୍ତର୍ଗତ ହୋଇନି
- ପେଜ୍ 4G/3G ସଂକେତରେ ଦ୍ରୁତ ଲୋଡ୍ କରିବାକୁ
ଶୀଘ୍ର ଲାଭ: ଆପଣଙ୍କର ଫୋନ୍ ଉପରେ ଆପଣଙ୍କ ସାଇଟ୍ ଖୋଲନ୍ତୁ। ପ୍ରତିଟି ବଟନ୍ ଓ ଲିଙ୍କ୍ କ୍ଲିକି କରିବାକୁ ଚେଷ୍ଟା କରନ୍ତୁ। ଯଦି ଆପଣ ଖୁଦରେ ଏହା ଧକଳିବାକୁ ଚାହିଁ, କିମ୍ବା ଏହାକୁ ପଢିବାକୁ ପିଞ୍ଜ ସ୍ଠିତ କରିବେ — ସେଗୁଡିକୁ ଆପଣଙ୍କର ପ୍ରାଥମିକ ନିରାକରଣ।
3. ଆକ୍ସେସିବିଲିଟି (WCAG)
ଆକ୍ସେସିବିଲିଟି କେବଳ ନୀତି ବ୍ୟବହାରୀ କଲେ ନୁହେଁ — ଏହା ଏକ SEO ସଙ୍କେତ। ଗୁଗୁଲ୍ର ଏଲଗୋରିଥମ୍ଗୁଡିକ ସେହି ସାଇଟ୍ଗୁଡିକୁ ସମର୍ଥନ କରେ ଯେଉଁଥିରେ ସମସ୍ତଙ୍କ ପାଇଁ ବ୍ୟବହାର କରିବାକୁ ହୋଇପାରିବା ଦ୍ୱାରା, ଟୀକା କରେ, କିମ୍ବା ଦୃଷ୍ୟବାନଦେଖା ବ୍ୟବହାରେ କମ୍ ପଚେଇଁ। WCAG (ୱେବ୍ କଣ୍ଟେଣ୍ଟ ଆକ୍ସେସିବିଲିଟି ଗାଇଡ୍ଲାଇନ୍ସ) ସହିତ ସମ୍ପାଦନା କରିଯିବେ ଏହାର ର୍ୟାଙ୍କିଂ ସହିତ ସମ୍ପର୍କ ମେଳାଯିବ।
ମୌଳିକ ଆକ୍ସେସିବିଲିଟି ଆବଶ୍ୟକତା:
| ତତ୍ତ୍ୱ | ଆବଶ୍ୟକତା | SEO ପ୍ରଭାବ | |---------|-------------|------------| | ଚିତ୍ରଗୁଡିକ ପାଇଁ ଅଲ୍ଟ୍ ଟେକ୍ସଟ୍ | ସମସ୍ତ ମାନ୍ୟତା ଚିତ୍ରଗୁଡିକୁ ବ୍ୟବହାର କର | ପ୍ରତ୍ୟକ୍ଷ (ଚିତ୍ର SEO + ଆକ୍ସେସିବିଲିଟି) | | ଶୀର୍ଷକ ହିରାର୍କୀ | H1 → H2 → H3 ବ୍ୟବହାର କରିବେ | ପ୍ରତ୍ୟକ୍ଷ (ବିଷୟବସ୍ତୁ ସଂରଚନା) | | ରଙ୍ଗ ସଂବେଧନ | ସାଧାରଣ ଲେଖା ପାଇଁ 4.5:1, ବଡ଼ ଲେଖା ପାଇଁ 3:1 | ପ୍ରତ୍ୟକ୍ଷ (ବ୍ୟବହାରିତା) | | କୀବୋର୍ଡ୍ ନାଭିଗେସନ୍ | ସମସ୍ତ ପ୍ରତିକ୍ରିୟାତ୍ମକ ତତ୍ତ୍ୱଟିକୁ ଟ୍ୟାବ୍ ବ୍ୟବହାରକରୁଛି | ପ୍ରତ୍ୟକ୍ଷ (ବ୍ୟବହାରିତା) | | ARIA ଲେବଲ୍ | ବିନା ଲେଖା ପ୍କୁନୀ, ବଟନ୍ ପାଇଁ ଲେବେଲ୍ | ପ୍ରତ୍ୟକ୍ଷ (ସ୍କ୍ରିନ୍ ରିଡର୍ UX) | | ଫୋକସ୍ ସୂଚକ | କୀବୋର୍ଡ୍ ନାଭିଗେସନ୍ ସମୟରେ ସୋଲୁସନ୍ ଏକ ଦୃଶ୍ୟ ଫୋକସ୍ ହୋଇଥାଏ | ପ୍ରତ୍ୟକ୍ଷ (ବ୍ୟବହାରିତା) | | ଫର୍ମ୍ ଲେବଲ୍ | ପ୍ରତି ସଂରକ୍ଷଣୀରୁ ବିଭାଇ ସଂଯୋଗ ହେଉଛି | ପ୍ରତ୍ୟକ୍ଷ (ବ୍ୟବହାରିତା) | | ଲିଙ୍କ ଟେକ୍ସଟ୍ | ବିବୃତ୍ତ (ନାହିଁ "ଏହାକୁ କ୍ଲିକ୍ କରନ୍ତୁ") | ଆଧାର (ଏଙ୍କର୍ ଟେକ୍ସଟ୍ SEO) |
ଆକ୍ସେସିବିଲିଟି ପରୀକ୍ଷା ପ୍ରକ୍ରିୟା:
- ଆମ୍ଭାବ ସ୍କାନ୍ — Lighthouse, axe-core କିମ୍ବା WAVE ଚଳାନ୍ତୁ (30-50% ସମସ୍ୟା ଧରିବେ)
- କୀବୋର୍ଡ୍ ପରୀକ୍ଷା — କେବଳ ଟ୍ୟାବ୍, ଏଣ୍ଟର୍, ଏସ୍କେପ୍ ବ୍ୟବହାରକରା ସମସ୍ତ ସାଇଟ୍ ନାଭିଗେଟ୍ କରନ୍ତୁ
- ସ୍କ୍ରିନ୍ ରିଡର୍ ପରୀକ୍ଷା — ମାକରେ VoiceOver କିମ୍ବା Windowsରେ NVDA ବ୍ୟବହାର କରନ୍ତୁ
- ରଙ୍ଗ ସଂବେଧନ — ପଛଗତ ଭିନ୍ନ କରନ୍ତୁ (DevTools contrast checker ବ୍ୟବହାର କରନ୍ତୁ)
- ଜୁମ୍ ପରୀକ୍ଷା — 200% ଲୋଡ୍ କରନ୍ତୁ — କିଛି କାମ କରୁଛି କି?
ସାମାନ୍ୟ ଆକ୍ସେସିବିଲିଟି ନିରାକରଣ:
<!-- ଚିତ୍ରଗୁଡିକ: ବିବୃତ୍ତ ଅଲ୍ଟ୍ ଟେକ୍ସଟ୍ -->
<img src="chart.png" alt="ଜାନୁଆରୀରୁ ମାର୍ଚ୍ଚ 2026ରେ ଜାତୀୟ ପ୍ରବେଶ 40% ବୃଦ୍ଧି ଦେଖାଯାଇଛି">
<!-- ବଟନ୍: ସ୍ପଷ୍ଟ ଲେବଲ୍ -->
<button aria-label="ନାଭିଗେସନ୍ ମେନୁ ବନ୍ଦ କରିବା">
<svg>...</svg> <!-- ସୂଚକରେ ବଟନ୍ ARIA-ଲେବଲ୍ ଆବଶ୍ୟକ |
</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 କୁ ଆପଣଙ୍କର ହୋମପେଜ୍ ପ୍ରାୟୋଗ କରନ୍ତୁ ଏବଂ ଆକ୍ସେସିବିଲିଟି କେଟେଗୋରୀ ସ୍କୋର୍ କରନ୍ତୁ। ସେଗୁଡିକୁ ପ୍ରଥମେ "ବିଫଳ" ସ୍କୋର ହୋଇଥିବା ସମସ୍ତ ହେବେ — ସାଧାରଣତଃ ଅଲ୍ଟ୍ ଟେକ୍ସଟ୍, ଫର୍ମ୍ ଲେବଲ୍, ଏବଂ କମ୍ ସଂବେଧନରେ ଘଟନା ସାର ବିରୋଧ ହୋଇପାରିବ। ଏହି ନିରାକରଣ 30 ମିନିଟ୍ ଧରି ହୋଇଥିବା ବ୍ୟବହାରରେ ସହାୟକ ହୁଏ ଏବଂ ଆପଣଙ୍କର ସ୍କୋର୍ 20+ ମାପକ ବୃଦ୍ଧି କରିବ।
4. ପୃଷ୍ଠା ଅଭିଜ୍ଞତା ସଙ୍କେତ
କୋର୍ ୱେବ୍ ଭାଇଟାଲ୍ସ ଫଳିବା ସହିତ, ଗୁଗୁଲ୍ ଅନ୍ୟାନ୍ୟ ପୃଷ୍ଠା ଅଭିଜ୍ଞତା ସଙ୍କେତଗୁଡିକୁ ମାପେ ଯାହା ର୍ୟାଙ୍କିଂ ରେ ପ୍ରଭାବ ପକାଏ।
ପୃଷ୍ଠା ଅଭିଜ୍ଞତା ଘଟକ:
| ସଙ୍କେତ | ଆବଶ୍ୟକତା | ଚେକ୍ | |--------|-------------|-------| | HTTPS | ସମସ୍ତ ସାଇଟ୍ HTTPS ରେ ସର୍ବର୍ତ୍ତିତ | ମିଶ୍ର ସାମଗ୍ରୀ ଭଙ୍ଗ କରେ | | କୌଣସି ନିକାସ ଅନ୍ତର୍ଗତ | ସାମଗ୍ରୀ ରେ ପ୍ରବେଶ କରିବାକୁ ଆବଶ୍ୟକ | ପୃଷ୍ଠା ଅନ୍ତର୍ଗତ >30% | | ସୁରକ୍ଷିତ ବ୍ରାଉଜିଂ | କୌଣସି ମାଲୱେର୍, ଫିଷିଙ୍ଗ୍, ତିମ୍ ହିଁ ବିକ୍ରୟ କରନ୍ତୁ | ଗୁଗୁଲ୍ ସୁରକ୍ଷିତ ବ୍ରାଉଜିଂ ସ୍ଥିତି | | ମୋବାଇଲ୍-କ୍ରମରେ ଦୋଷ | ମୋବାଇଲ୍-କ୍ରମରେ ପରୀକ୍ଷା ଗତି କରାଯିବ | ଗୁଗୁଲ୍ ମୋବାଇଲ୍-କ୍ରମରେ ପରୀକ୍ଷା | | କୌଣସି ଧୋକା ସମଗ୍ରୀ | ବିଜ୍ଞାପନ ଗୁଡିକୁ ସାମଗ୍ରୀ କୁଗୁଡିକୁ ଦେଖାଯାଏ | ବିନା ଯୌଗୟା ପ୍ରତିଡି |
ଇଣ୍ଟରଷ୍ଟିଆଲ୍ ସୂତ୍ର (କଣ ଅନୁମୋଦିତ କରିବାକୁ ଓ କଣ ଶାଂତିପୂର୍ଣ୍ଣ):
| ଅନୁମୋଦିତ | ଦଣ୍ଡ | |---------|-----------| | ବୟସ ଯାଞ୍ଚ (ବିଧି ପ୍ରୟୋଜନୀୟ) | ପୃଷ୍ଠା ଯାଞ୍ଚ ବସାପାଇଁ | | କୁକୀ ଗ୍ରାହକ (ବିଧି ପ୍ରୟୋଜନୀୟ) | ସାମଗ୍ରୀରେ ଫୁଲ୍ ସ୍କ୍ରିନ୍ ପଉଦି | | ପେଡ଼ାଣ୍ଡ ବିନା ଖୋଲା ସାମଗ୍ରୀ | "ଆମ୍ଭାର ଆପ" ଜଣାଇବା | | 30% ବଡ଼ ଖବରଗୁଡିକୁ | ପୃଷ୍ଠାରେ କୌଣସି ସହାୟକ ସୂତ୍ରଗୁଡିକୁ ରିଭାଇନ୍ଡ କରାଯିବ |
HTTPS ଚେକ୍ଲିଷ୍ଟ:
- [ ] SSL ଶର୍ତ୍ତ ପ୍ରମାଣିକତା କ୍ଷୟ ହୋଇନି
- [ ] ସମସ୍ତ ପୃଷ୍ଠା HTTP→HTTPS (301) ଅଳପ ପ୍ରଦାନ |
- [ ] କୌଣସି ମିଶ୍ର ସାମଗ୍ରୀ (HTTP ଗତି ଏକ HTTPS ପୃଷ୍ଠାରେ)
- [ ] HSTS ହେଡର୍ ସକ୍ରିୟ (subDomains ସହିତ ବ୍ୟବହାର)
- [ ] ଆଭ୍ୟନ୍ତରୀୟ ଲିଙ୍କ୍ସ https ବ୍ୟବହାର କରନ୍ତୁ (HTTP ନୁହେଁ)
- [ ] ଟେକ୍ନୋଲୋଜୀଗୁଡିକ HTTPS URLs ବ୍ୟବହାର କରିଥାଏ
- [ ] କ୍ୟାନୋନିକା ଟ୍ୟାଗ୍ସ HTTPS ବ୍ୟବହାର କରନ୍ତୁ
ଶୀଘ୍ର ଲାଭ: ସୂତ୍ରଗୁଡିକୁ ମିଶ୍ର ସାମଗ୍ରୀ ପାଇଁ ଚେକ୍ କରନ୍ତୁ — ଦ୍ରୁତ || प୍ରଧାନ || [ଢ଼େଙ୍କ |𝑀/𝑀 || 𝒎𝒎𝒎𝒎𝒎𝒎𝒎𝒎𝒎𝒎𝒎𝒎𝒎|| Sāvithāmadh LābhāLMith Chauna parī TYātsā kyā MAa hlā Alāre Wior | 𝘦𝘭𝘦𝘪𝘵𝘦𝘭𝘢 || तथ्या ||
5. ସ୍ନାଳ ପ୍ୟାଟରନ୍ସ
ଭଲ ବ୍ୟବହାରକାରୀ ଓ ଖୋଜ ଇଞ୍ଞା କରେ। ବ୍ୟବହାରକାରୀ ସେମାନେ ଯାଇଛି ତାଙ୍କ ଆବଶ୍ୟକତା କ୍ଷେତ୍ରକୁ ପ୍ରାପ୍ତ କରିଥାଆନ୍ତି। ଗୁଗୁଲ୍ କ୍ରଲ୍ କରେ ସାଇଟର ଗଠନ ସମ୍ଜାଇଥାଏ ଏବଂ ପେଜ୍ରେସ୍ ସ୍ନାଳ୍ ବ୍ୟବହାର କରିଥାଏ।
ନାଭିଗେସନ୍ ଶ୍ରେଷ୍ଠ ପ୍ରଥାବଳୀ:
| ପ୍ୟାଟର୍ନ୍ | ଲାଭ | କାର୍କରୀ | |---------|---------|----------------| | ଫ୍ଲାଟ୍ ଅର୍ଥନୀତି | ପୃଷ୍ଠା ଘରପ୍ରଥମ ପାଖ ଅନ୍ତରେ 3 କ୍ଲିକ୍ରେ | ହବ୍ ପୃଷ୍ଠା, ବ୍ରେଡ୍ କ୍ରମାବଳୀ | | ବ୍ରେଡ୍ କ୍ରମାବଳୀ | ବ୍ୟବହାରକାରୀ ନିଜର ଥାରୁ ବୁଝିପାରେ | Schema markup + ଦୃଶ୍ୟ ପଥ | | ବ୍ୟବହାର ବ୍ୟବୋଧ୍ୟ | ପ୍ରତ୍ୟକ୍ଷ କ୍ରମ | /category/subcategory/page | | ଫୁଟର୍ ନାଭିଗେସନ୍ | ଦ୍ୱିତୀୟ ପୃଷ୍ଠା ସମ୍ଭାଳା | ନିୟମ, ବିଷୟ, ସମ୍ପର୍କ, ସାଇଟମାପ୍ | | ଆଭ୍ୟନ୍ତରୀୟ ସର୍ଚ୍ | ବ୍ୟବହାରକାରୀ ସଂଖ୍ୟା ବ୍ୟବହାର କରନ୍ତୁ | ସର୍ଚ୍ ବକ୍ସ ସହିତ ସୁଚନା | | ସମ୍ବନ୍ଧିତ ସମଗ୍ରୀ | ବାଉଉଟ୍ କମ କରେ, ଗହନତା ବୃଦ୍ଧି କରେ | "ସମ୍ବନ୍ଧିତ ପ୍ରବନ୍ଧ" ସେକ୍ସନ୍ଗୁଡିକୁ |
ରଶ୍ମା ➞ ସାଇଟ୍ ଗଠନ:
ମହାନିଆ (ସମସ୍ତ ମହତ୍ତ୍ୱପୂର୍ଣ୍ଣ ନିକଟ୍ ନିମିତ୍ତ ପ୍ରଥମ ʍlls領域とはなガ延長されるようです。
├── /products/ (ଗ୍ରହକ Hub — ସମସ୍ତ ପ୍ରଡକ୍ଟ୍ କୁ ଲିଙ୍କସ୍ କରନ୍ତୁ)
│ ├── /products/category-a/
│ │ ├── /products/category-a/product-1
│ │ └── /products/category-a/product-2
│ └── /products/category-b/
├── /blog/ (ବିଷୟୀୟ Hub — ସମସ୍ତ ପୋଷ୍ଟକୁ ଲିଙ୍କସ |
│ ├── /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 ଗାଇଡ୍ ପ୍ରକ୍ଷେପ 5</li>
</ol>
</nav>
<!-- Schema markup (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 ଗାଇଡ୍ ପ୍ରକ୍ଷେପ 5" }
]
}
</script>
ନାଭିଗେସନ୍ ରେଡ୍ ସଙ୍କେତ:
- ପୃଷ୍ଠା ଘୃତା କ୍ଲିକ୍ ସହ ଘଟିବାରେ (ପ୍ରାହିକ କ୍ଲିକ୍)
- ବ୍ରେଡ୍ କ୍ରମାବଳୀ ନଥିଲେ (ପ୍ରବେଶ ଓ ଗୁଗୁଲ୍ ବିହୁତାର କ୍ଷେତ୍ର୍)
- ଜାଭାସ୍କ୍ରିପ୍ଟ-ମାଟ୍ରିକ୍ ନାଭିଗେସନ୍ (କ୍ରଲର୍ ଲିଙ୍କ୍ ସର୍ବ କରୁନି)
- ଓର୍ଫନ୍ ପୃଷ୍ଠା (ସହ ବ୍ୟବହାରକରେ ସ୍ଥିତ କିଛି ଲିଙ୍କ୍ସ)
- 200+ ଲିଙ୍କ୍ଗୁଡିକୁ ଅଧିବୃତୁ (ପର ଲିଙ୍କ୍ ସେଟରେ ହାକ୍ କରେ)
ଶୀଘ୍ର ଲାଭ: ଆପଣଙ୍କର ଅତି ଗୁରୁତମ୍ ଉଦ୍ଦେଶ୍ୟ ଗୁଡିକୁ ଚେକ୍ କରନ୍ତୁ — କେତେ କ୍ଲିକ୍ ଘାମିରେ? ଯଦି 3 ଅଧିକ, ଆପଣଙ୍କର ମହାନିଆ କିମ୍ବା ବିଭାଗ ହବ୍ କରନ୍ତୁ। ପ୍ରତ୍ୟେକ କ୍ଲିକ୍ ଗୁରୁତ୍ୱ ଓ କ୍ରୋଲ୍ ଅନ୍ତରଗତ କ୍ଷେତ୍ରକୁ କମ୍ ବୃଧି।
6. ଖୁଲା ଭାଗର ଅପ୍ଟିମାଇଜେସନ୍
କି ବ୍ୟବହାରକାରୀ ବାହାର ଦେଖନ୍ତି ପୂର୍ବରୁ ଦେଖିବାକୁ କି ସାମଗ୍ରୀ ଆକର୍ଷଣ କରେ ସେଥିରେ ଆବଶ୍ୟକ transparent ଓ ଅହୁର ଥିବା ସାମଗ୍ରୀ।
ଖୁଲା ଭାଗର ବିନା ମୁଁ ଆବଶ୍ୟକତା:
| ତତ୍ତ୍ୱ | କାହିଁକି | ସାମାନ୍ୟ ବିଫଳତା | |---------|-----|----------------| | ସ୍ପଷ୍ଟ ଶୀର୍ଷକ (H1) | ପ୍ରଶ୍ନରେ ସମ୍ପର୍କ ସ୍ଥିତି କରିଥାଏ | ସାଧାରଣ କିମ୍ବା ଉପସ୍ଥିତ | | ମୂଳ୍ୟ ପ୍ରତିସ୍ଥିତ | ସେମାନଙ୍କୁ କେଉଁଛି ରହିବେ? | ଖୁଲା ଭାଗରେ ଦାବାକୁ ଖୋଜନ୍ତୁ | | ପ୍ରାଥମିକ CTA | ସେମାନଙ୍କୁ ପଚାରିବେ? | ଲୁଚି ବା ଅନଧାରଣ | | ହେରୋ ଚିତ୍ର/ମିଡିଆ | ଦୃଶ୍ୟ ଲଭ୍ୟତା | ସ୍ଥିର ଲୋଡିଂ, LCP ସମସ୍ୟାକୁ କମ୍ କରେ | | ଭରସା ସୂଚକ | ସେମାନେ କେମିତି ଭରସା କରିଛନ୍ତି? | କୌଣସି ଲୋଗୋ, ସମୀକ୍ଷା କିମ୍ବା ପଦକ୍ଷେପ |
ଖୁଲା ଭାଗର ଗଠନ ପ୍ୟାଟର୍ନ୍ସ:
ଡେସ୍କରଆ(1440px ୱିଦ୍ୟୁପୋର୍ଟ୍):
┌──────────────────────────────────────┐
│ ନାବିଗେସନ୍ ବାର │
├──────────────────────────────────────┤
│ │
│ H1: ସ୍ପଷ୍ଟ ଶୀର୍ଷକ ଯାହା ପ୍ରଶ୍ନରେ କାମଧାନ କରେ │
│ ସାରଂଶ: ମୂଲ୍ୟ ପ୍ରତିଷ୍ଠା │
│ │
│ [ପ୍ରାଥମିକ CTA ବଟନ୍] │
│ │
│ ଭରସା ସୂଚକ: ଲୋଗୋ, ସଂଖ୍ୟା, ବ୍ୟାଜ୍ଜବଗୁଡିକ │
│ │
├──────────────────────────────────────┤
│ ↓ ସାମଗ୍ରୀ ଖୁଲା ଭାଗରେ ଅଧିକ │
└──────────────────────────────────────┘
ମୋବାଇଲ୍ (375px ୱିଦ୍ୟୁପୋର୍ଟ୍):
┌────────────────────┐
│ ପ୍ରସ୍ତାବଗୁଡିକ (ହ୍ୟାମ୍ବୁର୍ଗର) │
├────────────────────┤
│ │
│ H1: ଅନ୍ଦ୍ର କର |
│ (ମୋବାଇଲ୍ ସ୍ଥିତିରେ ଶୀର୍ଷ) │
│ │
│ [CTA ବଟନ୍] │
│ (ପୂର୍ଣ୍ଣ-ଦୂରତା, 44px+)│
│ │
│ ଭରସା ସୂଚକ │
│ │
├────────────────────┤
│ ↓ ପ୍ରଧାନ କକ୍ଷ ଖୁଲା │
└────────────────────┘
ଖୁଲା ଭାଗର ମୌଳିକ ନିୟମ:
- H1 ସ୍କ୍ରୋଲିଂ ବିନା ଦେଖାଯିବାକୁ ସ୍ପଷ୍ଟ ହୋଇଥିବାକୁ ତଲୟିଥିବା ପ୍ରଶ୍ନ |
- CTA ସ୍କ୍ରୋଲିଂ ବିନା ଦେଖାକୁ ହୋଇଥିବାକୁ ସ୍ପଷ୍ଟ |
- ସ୍ଥାୟୀ ସ୍ଥାଣା ଖୁଲା ଭାଗର ସାମଗ୍ରୀ ରେକରେ (CLS କିଲ୍ଲର୍)
- ହେରୋ ଗ୍ରଖାତ କମ୍ ହକ୍ସ (ସ୍ଥାୟୀ LCP ତତ୍ଥ୍ୟ) |
- ମୋବାଇଲ୍: ଖୁଲା ଭାଗର ବିଷୟବସ୍ତୁ ଅହେତୁ (କମ୍ ୱିଦ୍ୟୁପୋର୍ଟ୍ ସ୍ଥିତି)
ଶୀଘ୍ର ଲାଭ: ଆପଣଙ୍କର ହୋମପେଜ୍ ଦେଖିବାକୁ ଷ୍ଟ୍ରିକ୍ଟ୍ କରନ୍ତୁ ଚିତ୍ର (375px ୱିଦ୍ୟୁପୋର୍ଟ୍). H1 ସ୍କ୍ରୋଲିଂ ବିନା ଦେଖିପାରିଛି? CTA ବଟନ୍ ଦେଖିବାକୁ ପତ୍ର ବୋଲି କରିଛନ୍ତି? ଦେଖବା ଯେ କିସମସ୍ତ ଦେଖିବେଇଥିବାକୁ 2 ସେକେଣ୍ଡ ସହିତ ବୁଝନ୍ତୁ? ଯଦି କୌଣସି "ନା ହଳ", ଆପଣ ସେଗୁଡିକୁ ରହିଛନ୍ତି।
UX ପରୀକ୍ଷା ପାଲିଚ୍ଛଦ
ଆପଣଙ୍କର ଶୀର୍ଷ ପୃଷ୍ଠାରେ ଆପଣଙ୍କରୁ ଯାଆଁଥିବା କରନ୍ତୁ:
- [ ] LCP 2.5 ସେକେଣ୍ଡୁ ଭିନା (ହେରୋ ପ୍ରତିଛବି ଅପ୍ଟିମାଇଜ୍, କ୍ରିଟିକାଲ CSS ଇନଲେଇନ୍)
- [ ] INP 200ms ଭିନା (କୌଣସି ଦୀର୍ଘ JavaScript କାର୍ଯ୍ୟ ବନ୍ଧ କର)
- [ ] CLS 0.1 ଭିନା (ସମସ୍ତ ଚିତ୍ରଗୁଡିକ ଆକାର ଆହୁରିରେ, କୌଣସି ବିଳମ୍ବିତ ସ୍ଥାୟୀ କରନ୍ତୁ)
- [ ] ମୋବାଇଲ୍ କୁ ସୁଉଚିତ୍ | 44px ଲକ୍ଷ୍ୟ ଅର୍ଥ ମିଳିଥାଏ, 16px ପଢନୀୟ, କୌଣସି ଅଲୟ ଗତି ହେଇନି
- [ ] ଆକ୍ସେସିବଲ (ଅଲ୍ଟ୍ ଟେକ୍ସଟ୍, ଶୀର୍ଷକ ହିରାର୍କୀ, ରଙ୍ଗ ସଂବେଧନ, କୀବୋର୍ଡ୍ ନାଭିଗେସନ୍)
- [ ] HTTPS ସମସ୍ତେ (କୌଣସି ମିଶ୍ର ସାମଗ୍ରୀ, HSTS ସକ୍ରିୟ)
- [ ] କୌଣସି ଥାନ୍ତେ ଇଣ୍ଟରସ୍ଟିଆଲ୍ (ସ୍ମୃତିକ୍କୁ ଅନୁମତି ଲେଭେଲ)
// position: relative;,
- [ ] ବ୍ରେଡ୍ କ୍ରମାବଳୀ ଦେଖିଥିବା (BreadcrumbList schema ସହିତ)
- [ ] ନାଭିଗେସନ୍ ଗଭୀରତା 4 କ୍ଲିକ୍ ଭିନା ଗମନ କର |
- [ ] ଖୁଲା ଭାଗର ଅପ୍ଟିମାଇଜେସନ୍ (H1 ଦେଖିଥାଏ, CTA ଦେଖିଥାଏ, ଦ୍ରୁତ LCP)
LANGR କିପରି ଆପଣଙ୍କର UX ସ୍କାନ୍ କରେ
LANGRର UX ସଙ୍ଗହ୍ର ଡିଗ୍ରୀ.modules |
- କୋର୍ ୱେବ୍ ଭାଇଟାଲ୍ସ ମଡ୍ୟୁଲ୍ — Chrome User Experience Report (ଝିଲ୍ରୁୟାସେ ବିକଳ୍ପ)
- PageSpeed ମଡ୍ୟୁଲ୍ — ଅନ୍ୟାନ୍ୟ Lighthouse ପରୀକ୍ଷା ସହିତ mobile ଓ desktop ସ୍କୋର୍
- ମୋବାଇଲ୍ ମଡ୍ୟୁଲ୍ — Viewport କନ୍ଫିଗରେସିଂ, ସ୍ପର୍ଶ ଟାର୍ଗେଟ୍ ସାଇଜିଂ, ପଢାଏବଂ କୌଣଏ ଦୃଷ୍ଟାବିହୀନ
- ଆକ୍ସେସିବିଲିଟି ମଡ୍ୟୁଲ୍ — WCAG ସାମର୍ଥ କମ୍ପାଲିଆ କରାନ୍ତୁ, ARIA ବ୍ୟବହାର କରେ, ରଙ୍ଗ ସଂବେଧନ |
- ଗଠନ ସ୍କାନ୍ ମଡ୍ୟୁଲ୍ — AI-ପାଇଁ ଟାଣ୍ୟଡ କରିଥାଏ |
- ପୃଷ୍ଠା ଅଭିଜ୍ଞତା ମଡ୍ୟୁଲ୍ — ଇଣ୍ଟରସ୍ଟିଆଲ୍ ଚିହ୍ନଟ କରାଯିବ, HTTPS ସ୍ଥିତ, ସୁରକ୍ଷିତ ବ୍ରାଉଜିଂ |
ଏ ମଡ୍ୟୁଲ୍ ମାଉରୁଣ ଚଳାନ୍ତୁ ଏବଂ API ପାଉଁଛି କିବାଦେବିନାମୁଲ,سماءكوساكندومتيح وسوقمق هل جوك।
ସାମାନ୍ୟ UX ଭୁଲି (ପ୍ରଭାବ ଅନୁଯାୟୀ)
- ମୋବାଇଲ୍କୁ ଅନ୍ଧକାରରୁ ଅଣଧାରଣେ — 60%+ ପ୍ରେରଣାର ଦେଖିଛି, ଭଙ୍ଗା ମୋବାଇଲ୍ = ଭଙ୍ଗା ର୍ୟାଙ୍କିଂ
- ଅପ୍ଟିମାଇଜ୍ କରାଯାଇନଥିବା ଚିତ୍ରଗୁଡିକ — ଧିର LCPର ମାନ୍ୟତା ସଦା ବିଶେଷ ତାଲିକା
- ସ୍ପଷ୍ଟ ରୂପରେ ଚିତ୍ର କଳାଚରାକରଣ — କଳାଚରା ହୁଏେလେ CLS ସୂଚକାଙ୍କର ଗୁଣଣ ।
- ତୃତୀୟ ପାକାର ସ୍କ୍ରିପ୍ଟ ବ୍ଲୋଟ୍ — Chat widgets, analytics, ଆଡ୍ସ INP ମିଳନ।
- ଆକ୍ସେସିବିଲିଟି ବନଡୁରି — ଅଲ୍ଟ୍ ଟେକ୍ସଟ୍, ଶୀର୍ଷକ ହିରାର୍କୀ, କମ୍ ସଂବେଧନରେ ଘଟନା (ଚୀହ୍ନା)
- ନିକାସ ବନ୍ଧ କରାଯାଇଛି — ବିକଳ୍ପାଣି ପୃଷ୍ଠାରେ ବାହାର କରଙ୍ଗୁଲି ମୂଳନା |
- ଗଭୀର ଜନସଂଖ୍ୟାକୁ — ଜନସଂଖ୍ୟାରେ ଅତି ବ୍ୟାଜ୍ୟ କ୍ଲିକ୍ ହେବେ ...
- ବ୍ୟାକ୍ତିଗତ ଖୁଲା ଗୁଣ — ଚେପ୍ଟି ସହିତ ପ୍ରଶ୍ନ କରନ୍ତୁ ଲେଖା।
ପରବର୍ତ୍ତୀ କଣ?
ପଦ୍ଧତି 6: ମନିଟରିंग୍ & ର୍ୟାଙ୍କିଂ — ଆପଣ ଯାହାକୁ ମାପିବେ ତାହା ଉନ୍ନତ କରିବେ ନାହିଁ। କୀୱାର୍ଡ ସ୍ଥିତି, ସ୍କୋର୍ ଟ୍ରାକିଂ, ପରିବର୍ତ୍ତନ ସୂଚନା, ଏବଂ ଅପ୍ଟିମାଇଜେସନ୍।
ଏହି ଗାଇଡ୍ LANGRର 13-ପଦ୍ଧତି SEO ଶ୍ରେଣୀର ଏକ ଅଂଶ। ଏକ ମାଗଣା ପରୀକ୍ଷା କରନ୍ତୁ ଦେଖିବାକୁ ଆପଣଙ୍କ ସାଇଟ୍ ସମସ୍ତ 13 ଶ୍ରେଣୀରେ କେଉଁଠି ସ୍ଥିତ।