𝗗𝗲𝘀𝗶𝗴𝗻 𝗞𝗲𝘆𝗯𝗼𝗮𝗿𝗱 𝗡𝗮𝘃𝗶𝗴𝗮𝘁𝗶𝗼𝗻 𝗙𝗼𝗿 𝗗𝗮𝘁𝗮 𝗚𝗿𝗶𝗱𝘀

పవర్ యూజర్లు మౌస్ లేకుండానే పని చేయాలనుకుంటారు.

చక్కగా డిజైన్ చేయబడిన డేటా గ్రిడ్ ద్వారా వారు కేవలం కీబోర్డ్‌ను ఉపయోగించి నావిగేట్ చేయవచ్చు, ఎడిట్ చేయవచ్చు మరియు చర్యలు తీసుకోవచ్చు. ఈ యూజర్లు మౌస్ ఉపయోగించే వారి కంటే రెండు నుండి మూడు రెట్లు వేగంగా పని చేయగలరు.

ప్రతి చర్య కోసం మీ గ్రిడ్ క్లిక్ చేయాలని బలవంతం చేస్తే, పవర్ యూజర్లు మీ టూల్‌ను ఇష్టపడరు.

దీనికి పరిష్కారం చాలా సులభం. దీనికి సుమారు వంద లైన్ల కోడ్ మరియు తెలివైన డిజైన్ ఎంపికలు అవసరమవుతాయి.

ప్రొఫెషనల్ గ్రిడ్ కోసం ఈ నియమాలను పాటించండి:

• Tab: గ్రిడ్‌లోకి ప్రవేశించడానికి లేదా గ్రిడ్ నుండి బయటకు రావడానికి దీనిని ఉపయోగించండి. లోపల ఉన్నప్పుడు, Tab అనేది ఒక రో (row) లోని బటన్‌లు లేదా ఇన్‌పుట్‌ల మధ్య కదలాలి. సెల్స్ (cells) మధ్య కదలడానికి Tabని ఉపయోగించవద్దు.

• Arrow Keys: సెల్స్ మధ్య కదలడానికి వీటిని ఉపయోగించండి. అప్ (Up) మరియు డౌన్ (Down) కీలు రోల మధ్య కదులుతాయి. లెఫ్ట్ (Left) మరియు రైట్ (Right) కీలు కాలమ్స్ మధ్య కదులుతాయి.

• Enter: ఒక రో యొక్క ప్రధాన చర్యను (ఉదాహరణకు, డీటెయిల్ వ్యూను ఓపెన్ చేయడం వంటివి) ప్రారంభించడానికి దీనిని ఉపయోగించండి.

• Space: ఒక రోను సెలెక్ట్ చేయడానికి లేదా డీసెలెక్ట్ చేయడానికి దీనిని ఉపయోగించండి.

• Escape: ఎడిటింగ్‌ను రద్దు చేయడానికి లేదా మెనూని మూసివేయడానికి దీనిని ఉపయోగించండి.

• Home and End: ఒక రో యొక్క ప్రారంభానికి లేదా ముగింపుకు వెళ్లడానికి వీటిని ఉపయోగించండి.

సెల్స్ మధ్య కదలడానికి Tabని ఉపయోగించడం అనేది అతిపెద్ద తప్పు. పెద్ద గ్రిడ్‌లో, ఇది చాలా నెమ్మదిగా ఉంటుంది. ఒక గ్రిడ్‌లో 7 కాలమ్స్ మరియు 20 కనిపించే రోలు ఉంటే, ఒక స్క్రీన్‌ను పూర్తి చేయడానికి యూజర్ 140 సార్లు Tab నొక్కాల్సి ఉంటుంది. Arrow కీలు దీనిని పరిష్కరిస్తాయి. ఒక్కసారి నొక్కితే మీరు తదుపరి రోకి వెళ్లవచ్చు.

ఇన్‌లైన్ ఎడిటింగ్ కోసం, స్ప్రెడ్‌షీట్ ప్యాటర్న్‌ను అనుసరించండి:

  • సెల్‌ను ఎడిట్ చేయడం ప్రారంభించడానికి Enter నొక్కండి.
  • మార్పును సేవ్ చేయడానికి మళ్ళీ Enter నొక్కండి.
  • ఎడిటింగ్‌ను రద్దు చేయడానికి Escape నొక్కండి.
  • సేవ్ చేసి తదుపరి ఎడిట్ చేయదగిన సెల్‌కు వెళ్లడానికి Tab నొక్కండి.

యూజర్లు ఈ షార్ట్‌కట్‌లను సులభంగా కనుగొనడానికి, ఈ ప్యాటర్న్‌లను ఉపయోగించండి:

  • హెల్ప్ మెనూని ఓపెన్ చేయడానికి "?" షార్ట్‌కట్‌ను జోడించండి.
  • బటన్‌లపై టూల్‌టిప్స్ (tooltips) ద్వారా షార్ట్‌కట్‌లను చూపండి.
  • వన్-టైమ్ ఆన్‌బోర్డింగ్ టిప్‌ను ఉపయోగించండి.

మంచి కీబోర్డ్ నావిగేషన్ అనేది ఉత్పాదకతను పెంచే కీలక అంశం. యూజర్ వేగంలో భారీ పెరుగుదల కోసం ఇది ఒక చిన్న పెట్టుబడి మాత్రమే.

Source: https://dev.to/137foundry/how-to-design-keyboard-navigation-for-a-data-grid-so-power-users-stop-reaching-for-the-mouse-mh4