𝗔 𝗣𝗿𝗮𝗰𝘁𝗶𝗰𝗮𝗹 𝗖𝗿𝗼𝘀𝘀-𝗕𝗿𝗼𝘄𝘀𝗲𝗿 𝗧𝗲𝘀𝘁𝗶𝗻𝗴 𝗖𝗵𝗲𝗰𝗸𝗹𝗶𝘀𝘁
એક લેઆઉટ એક બ્રાઉઝરમાં પરફેક્ટ દેખાઈ શકે છે અને બીજામાં બગડી શકે છે. સાંકડી સ્ક્રીન ધરાવતો સસ્તો એન્ડ્રોઇડ ફોન અથવા 125% ઝૂમ સાથેનું જૂનું લેપટોપ તમારા ડિઝાઇનને બગાડી શકે છે.
ટેસ્ટિંગને માત્ર એક અસ્પષ્ટ અંતિમ તબક્કા તરીકે ન જુઓ. તેને એક ચોક્કસ ચેકલિસ્ટ તરીકે ગણો.
ઉચ્ચ-જોખમ ધરાવતા ક્ષેત્રો પર ધ્યાન કેન્દ્રિત કરો:
- ફોર્મ્સ અને ઇનપુટ્સ (Forms and inputs)
- નેવિગેશન મેનૂ (Navigation menus)
- લેઆઉટ શિફ્ટ (Layout shifts)
- ફોન્ટ લોડિંગ (Font loading)
- JavaScript ઇન્ટરેક્શન (JavaScript interactions)
દરેક બ્રાઉઝરને ટેસ્ટ કરવાનો પ્રયાસ કરવાનું બંધ કરો. તેનાથી સમય બગડે છે. તેના બદલે એક લિન મેટ્રિક્સ (lean matrix) નો ઉપયોગ કરો:
- ડેસ્કટોપ પર એક Chromium બ્રાઉઝર
- એક Safari એન્વાયરમેન્ટ
- એક Firefox એન્વાયરમેન્ટ
- એક Android ફોન
- એક iPhone
લોકો ખરેખર તમારા ઉત્પાદનનો ઉપયોગ કેવી રીતે કરે છે તેના આધારે તમારા ટેસ્ટિંગનું આયોજન કરો. પેજ દરેક જગ્યાએ એકસરખું દેખાવું જરૂરી નથી. તે ઉપયોગી (usable), વાંચી શકાય તેવું (readable) અને સ્થિર (stable) હોવું જોઈએ.
તમારા ચેકલિસ્ટમાં આ હોવું જોઈએ:
- બ્રાઉઝર અને OS
- વ્યૂપોર્ટ વિડ્થ (Viewport width)
- ઝૂમ લેવલ
- ચોક્કસ યુઝર ફ્લો (user flows)
યાદી ટૂંકી રાખો. જો ટેસ્ટિંગમાં અડધો દિવસ લાગે, તો તમારી ટીમ તેને છોડી દેશે. એક સારા સર્વેક્ષણ (sweep) માં એક કલાકથી ઓછો સમય લાગવો જોઈએ.
સ્ટ્રક્ચરથી શરૂઆત કરો. તમારા હોમપેજ, કન્ટેન્ટ પેજ અને ફોર્મ્સ તપાસો. તમારી વિન્ડોને ડેસ્કટોપથી મોબાઈલ વિડ્થમાં રિસાઈઝ કરો. ઝૂમ ઇન કરો. આ સમસ્યાઓ પર ધ્યાન આપો:
- વિચિત્ર રીતે વળતા (wrap) બટનો
- કપાઈ જતા હેડિંગ્સ
- હોરિઝોન્ટલ સ્ક્રોલિંગ (Horizontal scrolling)
- કન્ટેન્ટને ઢાંકી દેતા સ્ટીકી હેડર્સ (Sticky headers)
- મહત્વપૂર્ણ કંટ્રોલ્સને છુપાવતા મોડલ્સ (Modals)
હવે, ઇન્ટરેક્શન ટેસ્ટ કરો. બ્રાઉઝર્સ ફોર્મ્સને અલગ રીતે હેન્ડલ કરે છે. ટેક્સ્ટ ઇનપુટ્સ, પાસવર્ડ મેનેજર્સ, ડેટ પીકર્સ અને ફાઇલ અપલોડ્સ ટેસ્ટ કરો. ઓટોફિલ (autofill) તમારા લેઆઉટને કેવી રીતે અસર કરે છે તે તપાસો.
ટેબ્સ, એકોર્ડિયન અને સર્ચ સજેશન્સ જેવા JavaScript-હેવી ઘટકોનું ટેસ્ટિંગ કરો. પેજ કન્સોલમાં કોઈ ભૂલ ન બતાવે તેમ હોવા છતાં તેમાં બટન બગડેલું હોઈ શકે છે.
અંતે, તમારી સાઇટનું સ્ટ્રેસ ટેસ્ટિંગ કરો:
- તમારી નેટવર્ક સ્પીડ ઘટાડો (Throttle)
- તમારું કેશ (cache) ડિસેબલ કરો
- ઇનપુટ ફીલ્ડ્સમાં ખૂબ લાંબો ટેક્સ્ટ વાપરો
- ઓવરફ્લો તપાસવા માટે સામાન્ય કરતાં વધુ આઇટમ્સ લોડ કરો
શ્રેષ્ઠ ચેકલિસ્ટ કંટાળાજનક હોય છે. તે પાસ અથવા ફેઈલની એક સરળ યાદી હોવી જોઈએ. જ્યારે પણ તમે રિલીઝ કરો ત્યારે તેનો ઉપયોગ કરો. જ્યારે કોઈ બગ પ્રોડક્શનમાં પહોંચી જાય, ત્યારે તે ચોક્કસ નિષ્ફળતાને તમારા ચેકલિસ્ટમાં ઉમેરો.
ચેકલિસ્ટ ત્યારે જ ઉપયોગી છે જો તે તમારી ટીમ જે ભૂલી ગઈ હોય તેને યાદ અપાવે.
સ્ત્રોત: https://dev.to/graceholloway_/a-practical-cross-browser-testing-checklist-1p6a