06 ൽ 01
സഫാരി 9 ൽ റെസ്പോൺസീവ് ഡിസൈൻ മോഡ് സജീവമാക്കുകയും ഉപയോഗിക്കുകയും ചെയ്യുക
ഇന്നത്തെ ലോകത്തിലെ ഒരു വെബ് ഡെവലപ്പർ എന്ന നിലയിൽ, ഉപകരണങ്ങളുടെയും പ്ലാറ്റ്ഫോമുകളുടെയും സാന്നിധ്യം പിന്തുണയ്ക്കുന്നു എന്നാണ്, ഇത് ചിലപ്പോൾ ഒരു തന്ത്രപരമായ കടമയായിരിക്കും. ഏറ്റവും മികച്ച രൂപകൽപ്പന ചെയ്ത കോഡും ഏറ്റവും പുതിയ വെബ് സ്റ്റാൻഡേർഡുകളുമായി പൊരുത്തപ്പെടുന്നുണ്ടെങ്കിലും, നിശ്ചിത ഉപകരണങ്ങളിൽ അല്ലെങ്കിൽ തീരുമാനങ്ങളിൽ നിങ്ങളുടെ വെബ്സൈറ്റിലെ ഭാഗങ്ങൾ നിങ്ങൾ ആഗ്രഹിക്കുന്ന രീതിയിൽ പ്രവർത്തിക്കാനോ പ്രവർത്തിക്കാനോ ഇടയില്ല. ഇത്തരത്തിലുള്ള വിപുലമായ പരിപാടികളെ പിന്തുണയ്ക്കുന്ന വെല്ലുവിളിയെ നേരിടുന്നത്, നിങ്ങളുടെ ഡിസ്പ്ലേയിൽ ശരിയായ സിമുലേഷൻ ടൂളുകൾ ഉണ്ടെങ്കിൽ അമൂല്യമാണ്.
നിങ്ങൾ ഒരു മാക് ഉപയോഗിക്കുന്ന പ്രോഗ്രാമർമാരിൽ ഒരാളാണെങ്കിൽ, സഫാരി ഡവലപ്പർ ടൂൾസെറ്റ് എല്ലായ്പ്പോഴും പ്രയോജനകരമാണ്. സഫാരി 9 ന്റെ പ്രകാശനത്തോടുകൂടിയ ഈ പ്രവർത്തനത്തിന്റെ വ്യാപ്തി പ്രധാനമായും വിപുലീകരിച്ചിട്ടുണ്ട്, കാരണം പ്രതികരിക്കാൻ ഡിസൈൻ Mode_ കാരണം നിങ്ങളുടെ സൈറ്റിന്റെ വിവിധ സ്ക്രീൻ റെസൊലൂഷനുകളിലും അതുപോലെ വ്യത്യസ്ത ഐപാഡ്, ഐഫോൺ, ഐപോഡ് ടച്ച് ബിൽഡുകൾ എന്നിവയിലും നിങ്ങൾ എങ്ങനെ പ്രദർശിപ്പിക്കും.
ഈ ട്യൂട്ടോറിയൽ വിവര്ത്ത നം എങ്ങനെ പ്രതികരിക്കണം എന്നത് നിങ്ങളുടെ ഡിസൈൻ ആവശ്യകതകൾക്കായി എങ്ങനെയാണ് ഉപയോഗിക്കേണ്ടത് എന്നും.
ആദ്യം നിങ്ങളുടെ സഫാരി ബ്രൌസർ തുറക്കുക.
06 of 02
സഫാരി മുൻഗണനകൾ
സ്ക്രീനിന്റെ മുകളിലുള്ള ബ്രൗസർ മെനുവിൽ സഫാരിയിൽ ക്ലിക്ക് ചെയ്യുക. ഡ്രോപ്പ്-ഡൌൺ മെനു ദൃശ്യമാകുമ്പോൾ, മുകളിൽ പറഞ്ഞിരിക്കുന്ന ഉദാഹരണത്തിൽ മുൻഗണന ഐച്ഛികം_ തിരഞ്ഞെടുക്കുക.
മുകളിൽ പറഞ്ഞിരിക്കുന്ന മെനുവിന്റെ പക്കലുള്ള ഇനിപ്പറയുന്ന കീബോർഡ് കുറുക്കുവഴി നിങ്ങൾക്ക് ഉപയോഗപ്പെടുത്താമെന്ന് ശ്രദ്ധിക്കുക: COMMAND + COMMA (,)
06-ൽ 03
ഡെവലപ്പ്മെൻറ് മെനു കാണിക്കുക
Safari- ന്റെ മുൻഗണനകൾ ഡയലോഗ് ഇപ്പോൾ നിങ്ങളുടെ ബ്രൌസർ വിൻഡോ മറയ്ക്കുക, ദൃശ്യമാക്കണം. ആദ്യം, ഒരു ഗിയറിലൂടെ പ്രതിനിധീകരിക്കപ്പെട്ട, അഡ്വാൻസ് ചെയ്തത്, വിൻഡോയുടെ മുകളിൽ വലത് കോണിലാണ്.
ബ്രൗസറിന്റെ വിപുലമായ മുൻഗണനകൾ ഇപ്പോൾ ദൃശ്യമാകണം. താഴെ ഒരു ചെക്ക്ബോക്സും ഒരു ഓപ്ഷൻ ആണ്, മെനുബാറിലെ ഷോ ഡവലപ് മെനു കാണിക്കുക ലേബലുള്ള മുകളിൽ ഉദാഹരണം. ഈ മെനു സജീവമാക്കുന്നതിന് ഒരിക്കൽ ചെക്ക്ബോക്സിൽ ക്ലിക്കുചെയ്യുക.
06 in 06
റെസ്പോൺസീവ് ഡിസൈൻ മോഡ് നൽകുക
ഒരു പുതിയ ഓപ്ഷൻ ഇപ്പോൾ സ്ക്രീനിന്റെ മുകളിൽ ലേബൽ വികസിപ്പിച്ചെടുത്ത നിങ്ങളുടെ സഫാരി മെനുവിൽ ലഭ്യമാകണം. ഈ ഓപ്ഷനിൽ ക്ലിക്ക് ചെയ്യുക. ഡ്രോപ്പ്-ഡൗൺ മെനു ദൃശ്യമാകുമ്പോൾ, മുകളിൽ പറഞ്ഞിരിക്കുന്ന ഉദാഹരണത്തിൽ റെസ്പോൺസീവ് ഡിസൈൻ മോഡ് നൽകുക .
മുകളിൽ പറഞ്ഞിരിക്കുന്ന മെനുവിന്റെ പക്കലുള്ള ഇനിപ്പറയുന്ന കീബോർഡ് കുറുക്കുവഴി നിങ്ങൾക്ക് ഉപയോഗപ്പെടുത്താം: OPTION + COMMAND + R
06 of 05
റെസ്പോൺസീവ് ഡിസൈൻ മോഡ്
മുകളിൽ പറഞ്ഞിരിക്കുന്ന ഉദാഹരണം പോലെ, സജീവ വെബ് പേജ് ഇപ്പോൾ പ്രതികരിക്കാൻ ഡിസൈൻ മോഡിലായിരിക്കണം. ഐഫോൺ 6 പോലുള്ള ഐഒഎസ് ഡിവൈസുകളിൽ ഒന്ന് തെരഞ്ഞെടുക്കുക അല്ലെങ്കിൽ 800 x 600 പോലുള്ള നിയന്ത്രിത സ്ക്രീൻ റെസല്യൂഷനുകളിൽ ഒന്ന് തിരഞ്ഞെടുക്കുക വഴി ആ ഉപകരണത്തിൽ അല്ലെങ്കിൽ ആ ഡിസ്പ്ലേ റെസൊലറിൽ എങ്ങനെ പേജ് റെൻഡർചെയ്യുമെന്നത് നിങ്ങൾക്ക് കാണാൻ കഴിയും.
വ്യക്തമാക്കിയ ഐക്കണുകൾക്ക് മുകളിൽ കാണിച്ചിരിക്കുന്ന ഡ്രോപ്പ്-ഡൗൺ മെനുവിൽ ക്ലിക്കുചെയ്തുകൊണ്ട് വ്യത്യസ്ത ബ്രൌസറിൽ നിന്ന് വ്യത്യസ്തമായ ഒരു ഉപയോക്തൃ ഏജന്റ് പകർത്താൻ നിങ്ങൾക്ക് സഫാരി നിർദ്ദേശിക്കാനും കഴിയും.
06 06
മെനു വികസിപ്പിക്കുക: മറ്റ് ഓപ്ഷനുകൾ
റെസ്പോൺസീവ് ഡിസൈൻ മോഡ് കൂടാതെ, സഫാരി 9 ന്റെ ഡെവലപ്മെൻറ് മെനു മറ്റ് നിരവധി ഉപയോഗപ്രദമായ ഓപ്ഷനുകൾ ലഭ്യമാക്കുന്നു.
- പേജിൽ തുറക്കുക: നിലവിൽ നിങ്ങളുടെ Mac- ൽ ഇൻസ്റ്റാളുചെയ്തിരിക്കുന്ന മറ്റേതെങ്കിലും ബ്രൗസറിൽ സജീവ വെബ് പേജ് തുറക്കാൻ നിങ്ങളെ അനുവദിക്കുന്നു.
- ഉപയോക്തൃ ഏജൻറ്: ഉപയോക്തൃ ഏജന്റ് മാറ്റുന്നത്, വെബ് ബ്രൗസറുകളെ നിങ്ങളുടെ ബ്രൗസർ Safari 9-ൽ അല്ലാതെ മറ്റെന്തെങ്കിലും ആയി തിരിച്ചറിയാൻ സഹായിക്കുന്നു.
- വെബ് ഇൻസ്പെക്ടർ കണക്റ്റുചെയ്യുക: സഫാരി 9 ന്റെ വെബ് ഇൻസ്പെക്ടർ ഒരു വെബ് പേജ് റിസോഴ്സസ് പ്രദർശിപ്പിക്കും, അതുപോലെ CSS വിവരങ്ങൾ, DOM മെട്രിക്സ്, ഘടന എന്നിവയും അതിന്റെ തനതായ സോഴ്സ് കോഡും സംഗ്രഹിക്കാനുള്ള കഴിവുണ്ട്.
- പിശക് കൺസോളിനെ കാണിക്കുക: വികസിപ്പിച്ച മെനുയിലെ ഏറ്റവും കൂടുതലായി ഉപയോഗിക്കുന്ന ഓപ്ഷനുകളിൽ ഒന്ന്, ഈ കൺസോൾ JavaScript, HTML, XML പിശകുകളും മുന്നറിയിപ്പുകളും പ്രദർശിപ്പിക്കുന്നു.
- പേജ് ഉറവിടം കാണിക്കുക: സജീവ വെബ് പേജിന്റെ ഉറവിട കോഡ് കാണാനും തിരയാനും നിങ്ങളെ അനുവദിക്കുന്നു.
- പേജ് റിസോഴ്സുകൾ കാണിക്കുക: ഈ ഓപ്ഷൻ തിരഞ്ഞെടുക്കുന്നത് നിലവിലെ പേജിൽ നിന്ന് പ്രമാണങ്ങൾ, സ്ക്രിപ്റ്റുകൾ, CSS, മറ്റ് റിസോഴ്സുകൾ എന്നിവ പ്രദർശിപ്പിക്കുന്നു.
- സ്നിപ്പെറ്റ് എഡിറ്റർ കാണിക്കുക: ഒരു പൂർണ്ണ പേജിൽ നിന്ന് വ്യത്യസ്തമായി, കോഡിന്റെ ശകലങ്ങൾ എഡിറ്റുചെയ്യാനും പ്രവർത്തിപ്പിക്കാനും ഉള്ള കഴിവ് നൽകുന്നു. ടെസ്റ്റിംഗ് കാഴ്ചപ്പാടിൽ നിന്ന് ഈ സവിശേഷത വളരെ ഉപയോഗപ്രദമാണ്.
- വിപുലീകരണ ബിൽഡർ കാണിക്കുക: നിങ്ങളുടെ കോഡ് പാക്കേജിംഗ് ചെയ്ത് മെറ്റാഡാറ്റ ചേർക്കുന്നതിലൂടെ നിങ്ങളുടെ സ്വന്തം സഫാരി വിപുലീകരണങ്ങൾ നിർമ്മിക്കാൻ നിങ്ങളെ അനുവദിക്കുന്നു.
- ആരംഭിക്കുന്ന ടൈംലൈൻ റെക്കോർഡിംഗ്: നെറ്റ്വർക്ക് അഭ്യർത്ഥനകൾ, JavaScript നടപ്പിലാക്കൽ, പേജ് റെൻഡർ ചെയ്യൽ, ഉപയോക്തൃ ഇവന്റ് കാലയളവിലെ മറ്റ് ഇവന്റുകൾ എന്നിവ ഉൾപ്പെടെ നിരവധി ഇനങ്ങൾ റെക്കോർഡ് ചെയ്യുന്നു, ഇവയെല്ലാം WebKit ഇൻസ്പെക്ടറിലാണ് കാണുന്നത്.
- ശൂന്യ കാഷെകൾ: ഈ ഓപ്ഷനിൽ ക്ലിക്കുചെയ്യുന്നത് സഫാരിയിലുള്ള എല്ലാ സ്റ്റോർ കാഷെയും ഇല്ലാതാക്കുന്നു, സ്റ്റാൻഡേർഡ് വെബ്സൈറ്റ് കാഷെ ഫയലുകൾ മാത്രം.
- കാഷെ അപ്രാപ്തമാക്കുക : കാഷെ അപ്രാപ്തമാക്കുമ്പോൾ, പ്രാദേശിക കാഷെ ഉപയോഗിക്കുന്നതിന് എതിരായി ആക്സസ് അഭ്യർത്ഥന നടത്തി ഓരോ തവണയും ഉറവിടങ്ങൾ ഒരു വെബ്സൈറ്റിൽ നിന്ന് ഡൌൺലോഡ് ചെയ്യപ്പെടും.
- സ്മാർട്ട് തിരയൽ ഫീൽഡിൽ നിന്നും JavaScript അനുവദിക്കുക സുരക്ഷാ കാരണങ്ങളാൽ സ്ഥിരസ്ഥിതിയായി അപ്രാപ്തമാക്കി, സഫാരി വിലാസ ബാറിൽ : javascript ഉൾക്കൊള്ളുന്ന URL കൾ നൽകാൻ ഈ സവിശേഷത നിങ്ങളെ അനുവദിക്കുന്നു.
- SHA-1 സർട്ടിഫിക്കറ്റുകൾ സുരക്ഷിതമല്ലാത്തത്: സുരക്ഷിത ഹാഷ് അൽഗോരിതം എന്നതിന് ഷാപ്പ്, SHA-1 ഹാഷ് ഫംഗ്ഷൻ യഥാർത്ഥത്തിൽ സഫാരി 9 ൽ ഈ ഓപ്ഷൻ കൂട്ടിച്ചേർത്തതിനേക്കാൾ സുരക്ഷിതത്വം കുറഞ്ഞതായി തെളിഞ്ഞു.
അനുബന്ധ വായന
ഈ ടൂട്ടോറിയൽ ഉപയോഗപ്രദമാണെന്നു കണ്ടാൽ, ഞങ്ങളുടെ മറ്റ് സഫാരി 9 ഓപ്ഷനുകൾ പരിശോധിക്കാൻ ഉറപ്പാക്കുക.
- വെബ്സൈറ്റ് പുഷ് അറിയിപ്പുകൾ എങ്ങനെ നിയന്ത്രിക്കണം
- ഒരു PDF ഫയലിൽ ഒരു വെബ് പേജ് എക്സ്പോർട്ട് ചെയ്യുന്നത് എങ്ങനെ
- എങ്ങനെ യാന്ത്രികമായി അപ്ഡേറ്റുചെയ്യാൻ സഫാരി 9 എക്സ്റ്റെൻഷനുകൾ കോൺഫിഗർ ചെയ്യുക
- പിൻ ചെയ്ത സൈറ്റുകൾ സവിശേഷത എങ്ങനെ ഉപയോഗിക്കാം