Responsive web design
રિસ્પોન્સિવ વેબ ડિઝાઇન (આરડબલ્યુડી) અથવા રિસ્પોન્સિવ ડિઝાઇન એ વેબ ડિઝાઇન માટેનો એક અભિગમ છે જેનો હેતુ વેબ પૃષ્ઠોને વિવિધ ઉપકરણો અને વિંડો અથવા સ્ક્રીન કદ પર ઓછામાં ઓછા થી મહત્તમ પ્રદર્શન કદ સુધી સારી રીતે પ્રસ્તુત કરવાનો છે જેથી ઉપયોગીતા અને સંતોષની ખાતરી કરી શકાય. પ્રતિક્રિયાશીલ ડિઝાઇન પ્રવાહી પ્રમાણ-આધારિત ગ્રીડ, લવચીક છબીઓ અને CSS3 મીડિયા ક્વેરીઝ જેવી તકનીકોનો ઉપયોગ કરીને વેબ-પૃષ્ઠ લેઆઉટને જોવાના વાતાવરણમાં અનુકૂળ બનાવે છે, જે @media નિયમનું વિસ્તરણ છે, નીચેની રીતેઃ પ્રવાહી ગ્રીડ ખ્યાલ પૃષ્ઠ તત્વના કદને પિક્સેલ્સ અથવા બિંદુઓ જેવા સંપૂર્ણ એકમોને બદલે ટકાવારી જેવા સંબંધિત એકમોમાં હોવાનું કહે છે. લવચીક છબીઓ પણ સંબંધિત એકમોમાં માપવામાં આવે છે, જેથી તેમને તેમના સમાવિષ્ટ તત્વની બહાર પ્રદર્શિત થવાથી અટકાવી શકાય. મીડિયા ક્વેરીઝ પૃષ્ઠને જે ઉપકરણ પર સાઇટ પ્રદર્શિત થઈ રહી છે તેની લાક્ષણિકતાઓના આધારે વિવિધ CSS શૈલીના નિયમોનો ઉપયોગ કરવાની મંજૂરી આપે છે, દા. ત. રેન્ડરિંગ સપાટીની પહોળાઈ (બ્રાઉઝર વિંડોની પહોળાઈ અથવા ભૌતિક પ્રદર્શન કદ). રિસ્પોન્સિવ લેઆઉટ આપમેળે કોઈપણ ઉપકરણ સ્ક્રીનના કદને સમાયોજિત કરે છે અને સ્વીકારે છે, પછી ભલે તે ડેસ્કટોપ, લેપટોપ, ટેબ્લેટ અથવા મોબાઇલ ફોન હોય. પ્રતિસાદાત્મક વેબ ડિઝાઇન વધુ મહત્વપૂર્ણ બની હતી કારણ કે મોબાઇલ ઉપકરણોના વપરાશકર્તાઓ વેબસાઇટના મોટાભાગના મુલાકાતીઓ માટે જવાબદાર હતા. દાખલા તરીકે, 2015 માં, ગૂગલે મોબાઇલગેડનની જાહેરાત કરી હતી અને મોબાઇલ ઉપકરણ પરથી શોધ કરતી વખતે મોબાઇલ-મૈત્રીપૂર્ણ સાઇટ્સના પૃષ્ઠ ક્રમાંકનને વધારવાનું શરૂ કર્યું હતું. રિસ્પોન્સિવ વેબ ડિઝાઇન એ યુઝર ઇન્ટરફેસ પ્લાસ્ટિસિટીનું ઉદાહરણ છે. પડકારો અને અન્ય અભિગમો લ્યુક વ્રોબ્લેવસ્કીએ કેટલાક આરડબલ્યુડી અને મોબાઇલ ડિઝાઇન પડકારોનો સારાંશ આપ્યો છે અને મલ્ટી-ડિવાઇસ લેઆઉટ પેટર્નની સૂચિ બનાવી છે. તેમણે સૂચવ્યું હતું કે, સરળ એચડબલ્યુડી અભિગમની સરખામણીમાં, ઉપકરણ અનુભવ અથવા આરઇએસએસ (સર્વર-સાઇડ ઘટકો સાથે પ્રતિભાવશીલ વેબ ડિઝાઇન) અભિગમો વપરાશકર્તાને અનુભવ પ્રદાન કરી શકે છે જે મોબાઇલ ઉપકરણો માટે વધુ સારી રીતે અનુકૂળ છે. Sass જેવી સ્ટાઇલશીટ ભાષાઓનું સર્વર-સાઇડ CSS જનરેટર અમલીકરણ આવા અભિગમનો ભાગ હોઈ શકે છે. ગૂગલે અન્ય અભિગમો કરતાં સ્માર્ટફોન વેબસાઇટ્સ માટે પ્રતિભાવશીલ ડિઝાઇનની ભલામણ કરી છે. ઘણા પ્રકાશકોએ પ્રતિભાવશીલ ડિઝાઇનનો અમલ કર્યો હોવા છતાં, આરડબ્લ્યુડીને અપનાવવા માટેનો એક પડકાર એ હતો કે કેટલીક બેનર જાહેરાતો અને વીડિયો પ્રવાહી ન હતા. જો કે, સર્ચ એડવર્ટાઇઝિંગ અને (બેનર) ડિસ્પ્લે એડવર્ટાઇઝિંગ ચોક્કસ ઉપકરણ પ્લેટફોર્મ લક્ષ્યાંક અને ડેસ્કટોપ, સ્માર્ટફોન અને મૂળભૂત મોબાઇલ ઉપકરણો માટે વિવિધ જાહેરાત કદના બંધારણોને ટેકો આપવા માટે આવી હતી. વિવિધ પ્લેટફોર્મ્સ માટે વિવિધ ઉતરાણ પૃષ્ઠ URL નો ઉપયોગ કરવામાં આવ્યો છે, અથવા એજેક્સનો ઉપયોગ પૃષ્ઠ પર વિવિધ જાહેરાત પ્રકારો પ્રદર્શિત કરવા માટે કરવામાં આવ્યો છે. સી. એસ. એસ. કોષ્ટકો સંકર સ્થિર અને પ્રવાહી લેઆઉટને મંજૂરી આપે છે. મોબાઇલ સાઇટ વેલિડેટર્સ અને મોબાઇલ ઇમ્યુલેટર્સથી લઈને એડોબ એજ ઇન્સ્પેક્ટ જેવા એક સાથે પરીક્ષણ સાધનો સુધીની આરડબલ્યુડી ડિઝાઇનને માન્ય કરવા અને પરીક્ષણ કરવાની ઘણી રીતો છે. ક્રોમ, ફાયરફોક્સ અને સફારી બ્રાઉઝર્સ અને ડેવલપર ટૂલ્સે તૃતીય પક્ષોની જેમ રિસ્પોન્સિવ ડિઝાઇન વ્યૂપોર્ટ રિસાઇઝિંગ ટૂલ્સ ઓફર કર્યા છે. એચટીએમએલ + ના ડબલ્યુ3સી સ્પષ્ટીકરણમાં જણાવવામાં આવ્યું છે કે વેબસાઇટ્સને વપરાશકર્તાની પસંદગીઓ અનુસાર પ્રસ્તુત કરવી પડશે. જોકે વેબ પેજ લેઆઉટના કસ્ટમાઇઝેશનનો અભાવ હતો. ઘણા વેબ વિકાસકર્તાઓએ લેઆઉટને કસ્ટમાઇઝ કરવા અને તે જ સમયે તેમની વેબસાઇટ્સ પર કેટલીક મૂળભૂત પ્રતિક્રિયા લાવવાના માર્ગ તરીકે સામાન્ય એચટીએમએલ કોષ્ટકોનો આશરો લીધો. બ્રાઉઝર વ્યૂપોર્ટ પહોળાઈને બિન-તુચ્છ રીતે અનુકૂળ લેઆઉટ દર્શાવતી પ્રથમ મોટી સાઇટ 2001 ના અંતમાં શરૂ કરવામાં આવી હતી, જે રેઝોર્ફિશ ખાતેની એક ટીમ દ્વારા બનાવવામાં આવી હતી જેમાં જુર્ગેન સ્પેંગલ અને જિમ કાલબાચ (ઇન્ફોર્મેશન આર્કિટેક્ચર), કેન ઓલિંગ (ડિઝાઇન) અને જાન હોફમેન (ઇન્ટરફેસ ડેવલપમેન્ટ) નો સમાવેશ થાય છે. મર્યાદિત બ્રાઉઝર ક્ષમતાઓનો અર્થ એ હતો કે ઇન્ટરનેટ એક્સપ્લોરર માટે, લેઆઉટ બ્રાઉઝરમાં ગતિશીલ રીતે અનુકૂલિત થઈ શકે છે, જ્યારે નેટસ્કેપ માટે, જ્યારે કદ બદલવામાં આવે ત્યારે પૃષ્ઠને સર્વરમાંથી ફરીથી લોડ કરવું પડે છે. કેમેરોન એડમ્સે 2004માં એક પ્રદર્શન કર્યું હતું. 2008 સુધીમાં, લેઆઉટને વર્ણવવા માટે "લવચીક", "પ્રવાહી", "પ્રવાહી" અને "સ્થિતિસ્થાપક" જેવા સંખ્યાબંધ સંબંધિત શબ્દોનો ઉપયોગ કરવામાં આવી રહ્યો હતો. CSS3 મીડિયા ક્વેરીઝ 2008ના અંતમાં/2009ની શરૂઆતમાં પ્રાઇમ ટાઇમ માટે લગભગ તૈયાર હતી. એથન માર્કોટ્ટે રિસ્પોન્સિવ વેબ ડિઝાઇન શબ્દ બનાવ્યો-અને તેને પ્રવાહી ગ્રીડ/લવચીક છબીઓ/મીડિયા ક્વેરીઝ તરીકે વ્યાખ્યાયિત કર્યો-મે 2010ના એ લિસ્ટ અપાર્ટના લેખમાં. તેમણે રિસ્પોન્સિવ વેબ ડિઝાઇન નામના તેમના 2011 ના સંક્ષિપ્ત પુસ્તકમાં રિસ્પોન્સિવ વેબ ડિઝાઇનના સિદ્ધાંત અને પ્રથાનું વર્ણન કર્યું છે. #1 પર પ્રગતિશીલ વૃદ્ધિ પછી. નેટ મેગેઝિન દ્વારા 2012 માટે ટોચના વેબ ડિઝાઇન પ્રવાહોમાં પ્રતિભાવશીલ ડિઝાઇનને #2 તરીકે સૂચિબદ્ધ કરવામાં આવી હતી. મેશેબલ 2013ને રિસ્પોન્સિવ વેબ ડિઝાઇનનું વર્ષ કહે છે. સંબંધિત વિભાવનાઓ મોબાઇલ-ફર્સ્ટ ડિઝાઇન અને પ્રગતિશીલ વૃદ્ધિ એ સંબંધિત વિભાવનાઓ છે જે આરડબલ્યુડીની પહેલાની છે. મૂળભૂત મોબાઇલ ફોનના બ્રાઉઝર્સ જાવાસ્ક્રિપ્ટ અથવા મીડિયા ક્વેરીઝને સમજી શકતા નથી, તેથી મોબાઇલ ફોન પર જટિલ, છબી-ભારે સાઇટને કામ કરવા માટે આકર્ષક અધોગતિ પર આધાર રાખવાને બદલે, મૂળભૂત વેબ સાઇટ બનાવવી અને તેને સ્માર્ટફોન અને પર્સનલ કમ્પ્યુટર્સ માટે વધારવાની ભલામણ કરવામાં આવી હતી. એડેપ્ટિવ વેબ ડિઝાઇન બુટસ્ટ્રેપ (ફ્રન્ટ-એન્ડ ફ્રેમવર્ક) સી. એસ. એસ. ફ્રેમવર્ક ફાઉન્ડેશન (ફ્રેમવર્ક) ટેબલલેસ વેબ ડિઝાઇન સંદર્ભો 2010 માનવ-કમ્પ્યુટર ક્રિયાપ્રતિક્રિયામાં કમ્પ્યુટર-સંબંધિત પરિચય મોબાઇલ વેબ ઉપયોગીતા વપરાશકર્તા ઈન્ટરફેસ વેબ ડિઝાઇન 2010 ના નવા શબ્દો પણ જુઓ.