કેવી રીતે સક્રિય અને Safari 9 માં રિસ્પોન્સિવ ડિઝાઇન મોડનો ઉપયોગ કરો

06 ના 01

સક્રિય અને સફારી 9 માં રિસ્પોન્સિવ ડિઝાઇન મોડનો ઉપયોગ કરો

© સ્કોટ ઓર્ગરા

આજની દુનિયામાં એક વેબ ડેવલપર બનવું એટલે ઉપકરણો અને પ્લેટફોર્મ્સની સહાયતા આપવી, જે કેટલીક વાર મુશ્કેલ કાર્ય બની શકે. તાજેતરનાં વેબ ધોરણોને અનુસરતા સૌથી વધુ સારી રીતે તૈયાર કરાયેલ કોડ સાથે, તમે હજી પણ શોધી શકો છો કે તમારી વેબસાઇટનાં ભાગો તમે ચોક્કસ ઉપકરણ અથવા રિઝૉલ્યૂશન પર જે રીતે ઇચ્છો તે રીતે કાર્ય અથવા કાર્ય કરી શકશે નહીં. જ્યારે તમારી દૃષ્ટિએ આ પ્રકારની વિશાળ શ્રેણીને ટેકો આપવાની પડકારનો સામનો કરવો પડે છે, ત્યારે તમારા નિકાલ પર જમણી સિમ્યુલેશન સાધનો ધરાવતા અમૂલ્ય હોઈ શકે છે.

જો તમે મેકનો ઉપયોગ કરતા ઘણા પ્રોગ્રામરો પૈકી એક છે, સફારીના ડેવલપર ટૂલ્સેટ હંમેશાં હાથમાં આવે છે. સફારી 9 ના પ્રકાશન સાથે, આ વિધેયની પહોળાઈ નોંધપાત્ર રીતે વિસ્તૃત થઈ છે, મુખ્યત્વે રિસ્પોન્સિવ ડિઝાઇન મોડથી કારણે. જે તમને તમારી સાઇટ વિવિધ સ્ક્રીન રીઝોલ્યુશન તેમજ અલગ આઈપેડ, આઇફોન અને આઇપોડ ટચ બિલ્ડ્સ પર કેવી રીતે રેન્ડર કરશે તેનું પ્રદાન કરવા માટે પરવાનગી આપે છે.

આ ટ્યુટોરીયલની વિગતો, રિસ્પોન્સિવ ડિઝાઇન મોડને કેવી રીતે સક્રિય કરવી તે તેમજ કેવી રીતે તમારા વિકાસ જરૂરિયાતો માટે તેનો ઉપયોગ કરવો.

પ્રથમ, તમારું Safari બ્રાઉઝર ખોલો.

06 થી 02

સફારી પસંદગીઓ

© સ્કોટ ઓર્ગરા

સ્ક્રીનની ટોચ પર સ્થિત, બ્રાઉઝર મેનૂમાં સફારી પર ક્લિક કરો. ડ્રોપ-ડાઉન મેનૂ દેખાય ત્યારે, ઉપરોક્ત ઉદાહરણમાં ચક્કરવાળા પસંદગીઓને પસંદ કરો.

મહેરબાની કરીને નોંધ કરો કે તમે ઉપરોક્ત મેનુ વસ્તુના બદલે નીચેની કીબોર્ડ શૉર્ટકટનો ઉપયોગ કરી શકો છો: COMMAND + COMMA (,)

06 ના 03

મેનૂ વિકાસ બતાવો

© સ્કોટ ઓર્ગરા

સફારીની પસંદગીઓ સંવાદ હવે પ્રદર્શિત થવો જોઈએ, તમારા બ્રાઉઝર વિંડોને ઓવરલે કરીને. પ્રથમ, ગિયર દ્વારા રજૂ કરાયેલ અદ્યતન આયકન પર ક્લિક કરો અને વિંડોના ઉપલા જમણા-ખૂણે સ્થિત છે.

બ્રાઉઝરની વિગતવાર પસંદગીઓ હવે દૃશ્યમાન હોવી જોઈએ. તળિયે એક ચેકબૉક્સ સાથે એક વિકલ્પ છે, મેનૂ બારમાં શો શો વિકાસ મેનૂ લેબલ અને ઉપરોક્ત ઉદાહરણમાં ચક્કર છે. આ મેનૂને સક્રિય કરવા માટે ચેકબોક્સ પર ક્લિક કરો.

06 થી 04

રિસ્પોન્સિવ ડિઝાઇન મોડ દાખલ કરો

© સ્કોટ ઓર્ગરા

એક નવું વિકલ્પ હવે તમારા સફારી મેનૂમાં ઉપલબ્ધ હોવું જોઈએ, જે સ્ક્રીનની ટોચ પર સ્થિત થયેલ છે, વિકાસ કરેલ લેબલ થયેલ છે આ વિકલ્પ પર ક્લિક કરો ડ્રોપ-ડાઉન મેનૂ દેખાય ત્યારે, રિસ્પોન્સિવ ડિઝાઇન મોડને દાખલ કરો _ ઉપરના ઉદાહરણમાં ચક્કર.

મહેરબાની કરીને નોંધ કરો કે તમે ઉપરોક્ત મેનુ આઇટમની જગ્યાએ નીચેની કીબોર્ડ શૉર્ટકટનો ઉપયોગ કરી શકો છો: વિકલ્પ + COMMAND + R

05 ના 06

રિસ્પોન્સિવ ડિઝાઇન મોડ

© સ્કોટ ઓર્ગરા

સક્રિય વેબ પૃષ્ઠ હવે રિસ્પોન્સિવ ડિઝાઇન મોડમાં પ્રદર્શિત થવું જોઈએ, જેમ કે ઉપરના ઉદાહરણમાં બતાવ્યા પ્રમાણે. આઇ 6 જેવી યાદી થયેલ આઈઓએસ ડિવાઇસમાંના એકને પસંદ કરીને, અથવા 800 x 600 જેવા પ્રાયોજિત સ્ક્રીઝ રિઝોલ્યુશંસમાંથી કોઈ એક, તમે તુરંત જ જોઈ શકો છો કે આ પૃષ્ઠ કે જે ડિવાઇસ રીઝોલ્યુશનમાં પૃષ્ઠ રેન્ડર કરશે.

ઉપકરણો અને ઠરાવો બતાવ્યા ઉપરાંત, તમે અલગ વપરાશકર્તા એજન્ટને અનુરૂપ - પણ રીઝોલ્યુશન ચિહ્નો ઉપર સીધા જ બતાવેલ ડ્રોપ-ડાઉન મેનૂ પર ક્લિક કરીને- અલગ બ્રાઉઝરમાંથી એકને અનુરૂપ કરવા માટે સફારીને સૂચના આપી શકો છો.

06 થી 06

મેનુ વિકાસ: અન્ય વિકલ્પો

© સ્કોટ ઓર્ગરા

રિસ્પોન્સિવ ડિઝાઇન મોડ ઉપરાંત, સફારી 9 ના વિકાસ મેનૂ ઘણા અન્ય ઉપયોગી વિકલ્પોની સૂચિ આપે છે - જે નીચે સૂચિબદ્ધ છે.

સંબંધિત વાંચન

જો તમને આ ટ્યુટોરીયલ ઉપયોગી લાગ્યું હોય, તો અમારા અન્ય સફારી 9 વૉકથ્રૂઝ તપાસો.