શું તમારી પાસે " પ્રતિભાવ વેબસાઇટ " છે? આ મુલાકાતીના ઉપકરણ અને સ્ક્રીનના કદના આધારે બદલાયેલ એક લેઆઉટ સાથેની એક સાઇટ છે. રિસ્પોન્સિવ વેબ ડિઝાઇન હવે એક ઉદ્યોગ શ્રેષ્ઠ પ્રથા છે તે Google દ્વારા ભલામણ કરવામાં આવે છે અને સમગ્ર વેબ પર લાખો સાઇટ્સ પર જોવા મળે છે. જો કે, એવી વેબસાઇટ ધરાવતી મોટા તફાવત છે કે જે અલગ અલગ સ્ક્રીન માપો પર "બંધબેસે છે" અને એવી સાઈટ છે જે સાચી પ્રતિભાવ આપે છે.
હું નિયમિત રૂપે કંપનીઓને તેમની વેબસાઇટ ફરીથી ડિઝાઇન કરતું જોઉં છું અને તેમની નવી મોબાઇલ મૈત્રીપૂર્ણ ડિઝાઇનના ગુણને સમર્થન આપતી એક અખબારી પ્રકાશનને બહાર કાઢું છું. જ્યારે હું તે સાઇટ્સની મુલાકાત લેતો હોઉં ત્યારે જે ઘણી વાર હું શોધી કાઢું છું તે એક એવું લેઆઉટ છે જે ખરેખર અલગ સ્ક્રિનો પર ફિટ અને બદલાય છે, પરંતુ જ્યાં સુધી તેઓ પ્રતિભાવનો વિચાર લે ત્યાં સુધી આ પૂરતું નથી એક સાચી પ્રતિભાવ વેબસાઇટ નાની અથવા મોટી સ્ક્રીનને ફિટ કરવા માટે માત્ર સ્કેલ કરતાં વધુ કરે છે. આ સાઇટ્સ પર, તમે નીચેના મહત્વપૂર્ણ લક્ષણો પણ મેળવશો.
1. ઑપ્ટિમાઇઝ કામગીરી
કોઈ પણ વ્યક્તિ વેબસાઇટ લોડ થવાની રાહ જોવી પસંદ કરે છે, અને જ્યારે કોઈ વ્યક્તિ મોબાઇલ ઉપકરણનો ઉપયોગ કરે છે જે આદર્શ કરતાં ઓછું હોઈ શકે છે, ત્યારે સાઇટ ઝડપથી લોડ થવાની જરૂર છે તે વધુ મહત્વપૂર્ણ છે.
તો તમે કેવી રીતે તમારી સાઇટનું પ્રદર્શન ઑપ્ટિમાઇઝ કરી શકશો? જો તમે ફરીથી ડિઝાઇનના ભાગ રૂપે નવી સાઇટથી શરૂ કરી રહ્યા હો, તો તમારે તે પ્રોજેક્ટના ભાગ રૂપે પ્રભાવ બજેટ બનાવવાનું એક બિંદુ બનાવવું જોઈએ. જો તમે હાલની સાઇટ સાથે કામ કરી રહ્યા છો અને શરૂઆતથી શરૂ ન કરી રહ્યા હોવ, તો પ્રથમ સ્થાન એ છે કે તમે ક્યાંથી ઊભા છો તે જોવા માટે તમારી સાઇટની કામગીરી ચકાસવાનો છે.
એકવાર તમારી સાઇટ પર એકવાર બેઝલાઇન હોય કે જ્યાં તમારી સાઇટ પ્રદર્શન-મુજબ રહે છે, તમે ડાઉનલોડ ગતિને વધારવા માટે જરૂરી સુધારણા કરવાનું શરૂ કરી શકો છો. કદાચ તમારી સાઇટની છબીઓ સાથે શરૂ થવાનું એક સરસ સ્થળ છે. લોડ કરતી સાઇટ્સને ધીમુ થતી વખતે ખૂબ મોટી છબીઓ એ # 1 ગુનેગાર છે, તેથી વેબ ડિલિવરી માટે તમારી છબીઓને ઑપ્ટિમાઇઝ કરવું ખરેખર તમારી સાઇટને પ્રભાવ દૃષ્ટિબિંદુથી મદદ કરી શકે છે.
વાસ્તવિકતા એ છે કે સુધારેલ વેબસાઇટ પ્રદર્શન અને ઝડપી ડાઉનલોડ ઝડપે લાભ છે જે બધા મુલાકાતીઓ કદર કરશે. બધા પછી, કોઈએ ક્યારેય એવી ફરિયાદ કરી છે કે કોઈ સાઇટ "ખૂબ ઝડપથી" લોડ કરે છે, પરંતુ જો કોઈ સાઇટ લોડ થવામાં ખૂબ જ વધારે સમય લાગી શકે છે, તો તે સંપૂર્ણપણે લોકોને દૂર કરશે કે પછી તે તેમની પ્રતિક્રિયાત્મક રીતે "બંધબેસે છે" કે નહીં.
2. સ્માર્ટ સામગ્રી હાયરાર્કી
જ્યારે કોઈ મોટી સ્ક્રીન પર વેબસાઇટ પ્રદર્શિત થાય છે, ત્યારે તમે ઉપલબ્ધ વિવિધ સ્ક્રીન રીઅલ એસ્ટેટને કારણે વિવિધ પ્રકારની સામગ્રીને બહાર મૂકવા સક્ષમ છો. તમે વારંવાર સ્ક્રીન પર મહત્વપૂર્ણ સંદેશા અને છબીઓ, સમાચાર અપડેટ્સ, ઇવેન્ટ માહિતી અને સાઇટ સંશોધકને ફિટ કરી શકો છો આ મુલાકાતીને સમગ્ર પૃષ્ઠની સામગ્રીને સરળતાથી અને ઝડપથી સ્કેન કરવા અને તેના માટે શું મહત્વનું છે તે નક્કી કરવાની મંજૂરી આપે છે.
આ દૃશ્ય ખૂબ નાટ્યાત્મક રીતે બદલાય છે જ્યારે તમે તે સાઇટ ડિઝાઇન લો છો અને તેને નાના સ્ક્રીન ઉપકરણો માટે રૂપાંતરિત કરો, જેમ કે સેલ ફોન. અચાનક તમે સ્ક્રીન રીઅલ એસ્ટેટના અપૂર્ણાંક સાથે કામ કરતા હોવ છો જે પહેલાં હતા. આનો અર્થ એ થાય કે તમારે તે નક્કી કરવાની જરૂર છે કે સાઇટ પર શું પ્રથમ દેખાશે, તેનાથી શું અનુસરવામાં આવશે, વગેરે. એક જ સમયે જોવામાં આવતી વસ્તુઓની જગ્યાએ, તમારી પાસે માત્ર એક અથવા બે વસ્તુઓ બતાવવાની જગ્યા હોય છે (જેમાંથી એક સંભવિત નેવિગેશન છે). આનો અર્થ એ થાય છે કે પદાનુક્રમના નિર્ણયો કરવાની જરૂર છે. કમનસીબે, ઘણીવાર તે નક્કી કરે છે કે સ્ક્રીન પર પ્રથમ શું આવે છે, અને પછી બીજા, વગેરે. તે પૃષ્ઠ છે જે પૃષ્ઠને કોડેડ કરવામાં આવે છે. તે સહેલું છે, જ્યારે કોઈ પ્રતિસાદી સાઇટ બનાવી રહી હોય, જે સ્ક્રીન પર પ્રથમ કોડમાં પ્રથમ છે તે બતાવવા માટે, કોડમાં બીજી આઇટમ અને ત્યારબાદ આગળ. કમનસીબે, એક ઉપકરણ પર શું સૌથી વધુ મહત્વનું હોઈ શકે છે તે અન્ય પર જટિલ ન પણ હોઈ શકે. સાચી પ્રતિભાવશીલ સાઇટ સમજે છે કે વિભિન્ન પરિસ્થિતિઓના આધારે સામગ્રીની વંશવેલોમાં ફેરફાર થવો જોઈએ અને તે શું દર્શાવે છે તે વિશે સ્માર્ટ હોવું જોઈએ.
HTML કોડમાં સામગ્રી વિસ્તારોની ચોક્કસ ક્રમમાં દ્વારા હેમસ્ટ્રૂંગ થવાને બદલે, CSS લેઆઉટ લીટીઓ, ફલેક્સબોક્સ અને વધુ સહિત CSS લેઆઉટ તકનીકોમાં સુધારાઓ, વેબ ડિઝાઇનર્સ અને વિકાસકર્તાઓને વધુ વિકલ્પોની મંજૂરી આપે છે જ્યારે તે સમજણપૂર્વક સામગ્રી મૂકવા માટે આવે છે ડિવાઇસ લેન્ડસ્કેપ અને અમારી સાઇટના વપરાશકર્તાઓની જરૂરિયાતો આ નવી લેઆઉટ તકનીકોનો લાભ લઈને વધુ મહત્વપૂર્ણ બનશે, વિકસાવવાનું ચાલુ રહે છે.
3. એકાઉન્ટ્સમાં ડિવાઇસનાં સ્ટ્રેન્થ અને નબળાઈઓનો અનુભવ કરતા અનુભવો
ઉપકરણોના વિષય પર રહેવું - દરેક વ્યક્તિ કે જે તમારી સાઇટની મુલાકાત લેવા માટે ઉપયોગમાં લઈ શકે છે તે બન્ને શક્તિ અને નબળાઈઓ છે જે તે પ્લેટફોર્મથી અંતર્ગત છે. એક મહાન પ્રતિભાવ સાઇટ જુદી જુદી ઉપકરણોની ક્ષમતાઓ અને મર્યાદાઓને સમજે છે અને તેનો ઉપયોગ કસ્ટમાઇઝ્ડ અનુભવો બનાવવા માટે કરે છે જે મુલાકાતી તે જ સમયે જે ઉપકરણનો ઉપયોગ કરી શકે છે તે શ્રેષ્ઠ છે.
ઉદાહરણ તરીકે, સેલ ફોનમાં ઘણી લાક્ષણિકતાઓ શામેલ છે જે પરંપરાગત ડેસ્કટૉપ કમ્પ્યુટરમાં ન મળે. જીપીએસ મોબાઇલ-સેન્ટ્રીક ફીચરનું એક ઉદાહરણ છે (હા, તમે ડેસ્કટોપ પર સામાન્ય સ્થાન માહિતી પણ મેળવી શકો છો, પરંતુ ઉપકરણ જીપીએસ વધુ સચોટ છે). તમારી સાઇટ જીપીએસ માહિતીનો ઉપયોગ કરવા માટે વ્યક્તિને ખૂબ જ વિગતવાર અને વિશિષ્ટ પગલું-થી-પગલું દિશાનિર્દેશની માહિતી અથવા ખાસ ઓફર કરે છે જ્યાં તે ક્ષણ પર છે તેના આધારે સ્માર્ટ રીતે મોકલવા માટે ઉપયોગ કરી શકે છે.
વ્યવહારમાં આ મુખ્ય એક અન્ય ઉદાહરણ એક એવી સાઇટ હશે જે સમજી શકે કે તમે કેવા પ્રકારની સ્ક્રીન ડિસ્પ્લેનો ઉપયોગ કરી રહ્યા છો અને તે છબીઓને શ્રેષ્ઠ રીતે અનુરૂપ છે તે છબીઓ મોકલે છે. જો તમારી પાસે ઉચ્ચ પિક્સેલ ગીચતાવાળી સ્ક્રીન છે, તો તમે તે સ્ક્રીન પર ઉચ્ચ ગુણવત્તાની છબીઓ મોકલવાનું નક્કી કરી શકો છો. આ જ છબીઓ ઓછી સક્ષમ સ્ક્રીન પર નિર્ભર રહેશે, જો કે, અને વધારાની ગુણવત્તા ખોવાઈ જશે જ્યારે કોઈ વાસ્તવિક કારણોસર વધારાની ફાઇલ કદ ડાઉનલોડ થશે નહીં.
ખરેખર મહાન પ્રતિભાગી સાઇટ્સ સમગ્ર વપરાશકર્તા અનુભવને ધ્યાનમાં લે છે અને તેના સ્ક્રીનના ઉપકરણ પ્રકાર અથવા કદના આધારે, પરંતુ હાર્ડવેરનાં અન્ય મહત્વપૂર્ણ પાસાંઓ પર આધારિત છે તે અનુભવને અનુરૂપ બનાવવા માટે કામ કરે છે.
4. સંદર્ભ સાથે સામગ્રી
શરૂઆતમાં, પ્રતિસાદ વેબ ડિઝાઇનને તેના નામનું સ્થાન મળ્યું છે, કારણ કે સાઇટનાં સ્ક્રીનના લેઆઉટને અલગ અલગ સ્ક્રીન માપોનો જવાબ આપવામાં આવ્યો છે, પરંતુ તમે માત્ર સ્ક્રીન માપ કરતાં વધુ પ્રતિસાદ આપી શકો છો. ડિવાઇસની શક્તિ અને નબળાઈઓના ઉપયોગના અગાઉના ઉદાહરણને બનાવતા, તમે તે વેબસાઇટનો અનુભવ ખરેખર કસ્ટમાઇઝ કરવા માટે, તેટલા સમય અને ડેટાનો ઉપયોગ કરી શકો છો.
મોટી ટ્રેડ શો ઇવેન્ટ માટે વેબસાઇટની કલ્પના કરો. એક પ્રતિસાદી વેબસાઇટ વિવિધ સ્ક્રીનો સાથે સ્કેલ કરવા માટે સાઇટના પૃષ્ઠોનું લેઆઉટ બદલશે, જ્યારે તમે પ્રદર્શિત કરવા માટે કઈ સામગ્રી સૌથી મહત્વપૂર્ણ છે તે નક્કી કરવા માટે તમે તારીખનો ઉપયોગ પણ કરી શકો છો. જો ઇવેન્ટ પહેલાં સમયનો સમય હોય, તો તમે કદાચ નોંધણીની માહિતીને મુખ્યત્વે પ્રદર્શિત કરવા માગો છો. જો, તેમ છતાં, આ ઘટના ખરેખર તે સમયે થઈ રહી છે, નોંધણી સૌથી મહત્વપૂર્ણ સામગ્રી ન હોઈ શકે. તેના બદલે, તમે નક્કી કરી શકો છો કે ઇવેન્ટ્સનો દિવસનો શેડ્યૂલ વધુ જટિલ છે કારણ કે તે તે વપરાશકર્તાની તાત્કાલિક જરૂરિયાતો માટે વધુ સુસંગત છે.
આગળ એક પગથિયાં લઈને, તમે વેપારના શોમાં તેઓ ક્યાં છે તે નિર્ધારિત કરવા માટે ઉપકરણના જીપીએસમાં ટેપ કરી શકો છો. તમે તેમને તેમના સ્થાનના આધારે ઇન્ટ્રેક્ટિવ કન્ટેન્ટ આપી શકો છો, પ્રારંભ કરવા માટે તેમને નજીકના બૂથ અથવા સત્રો બતાવી શકો છો.
5. ઍક્સેસિબિલિટી
અંતિમ ઉદાહરણ માટે અમે જોશો કે કેવી રીતે કોઈ સાઇટ મુલાકાતીની જરૂરિયાતોને સાચી રીતે પ્રતિસાદ આપી શકે છે તે વેબસાઇટની સુલભતા વિશે વિચારવું છે. અપંગતા ધરાવતા લોકો સહિત વેબસાઇટો શક્ય તેટલા લોકો દ્વારા ઉપયોગમાં લેવા માટે સક્ષમ હોવા જોઈએ. તમારી વેબસાઇટ કોઈ વ્યક્તિ દ્વારા ઉપયોગમાં લેવા માટે સક્ષમ હોવી જોઈએ જેને તેની સામગ્રી ઍક્સેસ કરવા માટે સ્ક્રીન રીડર અથવા અન્ય સહાયિત સૉફ્ટવેરની આવશ્યકતા છે. આ રીતે, તમારી સાઇટ તેમની જરૂરિયાતોનો જવાબ આપી રહી છે કારણ કે તમે ખાતરી કરી છે કે અનુભવ, જ્યારે અક્ષમ મુલાકાતીઓ માટે અલગ છે, હજુ પણ યોગ્ય છે.
જેટલું શક્ય તેટલું ડેટા પોઈન્ટનો પ્રતિસાદ કરીને, અને માત્ર સ્ક્રીન માપ નહીં, વેબસાઇટ "મોબાઈલ મૈત્રીપૂર્ણ" કરતાં વધુ હોઈ શકે છે. તે શબ્દના દરેક અર્થમાં સાચી પ્રતિભાવ અનુભવ બની શકે છે.