നിങ്ങളുടെ വെബ്സൈറ്റിൽ ചിത്രങ്ങൾ പ്രദർശിപ്പിക്കാത്തത് എന്താണെന്നും അത് എങ്ങനെ പരിഹരിക്കുമെന്നും അറിയുക
പഴയ ചിത്രം പറയുന്നത് "ഒരു ചിത്രം ആയിരം വാക്കുകൾ വിലമതിക്കുന്നു." ഇത് പ്രത്യേകിച്ചും ശ്രദ്ധാകേന്ദ്രം ശ്രദ്ധാകേന്ദ്രം ആയതിനാൽ, കൃത്യമായ ശ്രദ്ധ ആകർഷിക്കുന്നതിലൂടെയും അല്ലെങ്കിൽ കൃത്യമായ ചിത്രം ആകർഷിക്കുന്നതിനും ശരിയായ ഒരു ഇമേജ് ഉണ്ടാക്കാനും അവർക്ക് കഴിയും. വെബ് പേജിൽ സന്ദർശകർക്ക് ഒരു പ്രത്യേക പഠനമോ സൈറ്റിനായി ഒരു "വിജയി" എന്ന് സൂചിപ്പിക്കുന്ന പ്രവർത്തനം. അതേ, അത് ഒരു വെബ്സൈറ്റിലേക്ക് വരുമ്പോൾ, ആയിരം വാക്കുകളേക്കാൾ കൂടുതൽ മൂല്യമുള്ള ചിത്രങ്ങൾ ആയിരിക്കാം!
അങ്ങനെ ഓൺലൈൻ ചിത്രങ്ങൾ പ്രാധാന്യത്തോടെ, നമുക്ക് അടുത്തതായി സൈറ്റിൽ ഉണ്ടാകാൻ സാധ്യതയുള്ള ഒരു ചിത്രം ലോഡ് ചെയ്യാൻ കഴിയുന്നില്ലെങ്കിൽ നിങ്ങളുടെ വെബ്സൈറ്റിനെക്കുറിച്ച് എന്തൊക്കെയുണ്ടെന്ന് നോക്കാം. നിങ്ങൾക്ക് CSS ൽ പ്രയോഗിക്കപ്പെടുന്ന HTML അല്ലെങ്കിൽ പശ്ചാത്തല ഇമേജുകളുടെ ഭാഗമായ ഇൻലൈൻ ഇമേജുകളാണോ അതോ നിങ്ങളുടെ സൈറ്റിന് ഇവ രണ്ടും ഉണ്ടോ എന്ന് മനസ്സിലാക്കാം. ഒരു ഗ്രാഫിക് ഒരു പേജിൽ ലോഡുചെയ്യുമ്പോൾ പരാജയപ്പെടുമ്പോൾ, അത് ഡിസൈൻ രൂപത്തിൽ ദൃശ്യമാകും, ഒപ്പം ചില കേസുകളിൽ ആ സൈറ്റിൽ ഉപയോക്തൃ അനുഭവം പൂർണ്ണമായി നശിപ്പിക്കാൻ കഴിയും. ചിത്രം അയയ്ക്കുന്ന "ആയിരം വാക്കുകൾ" തീർച്ചയായും ശുഭപ്രതീക്ഷകളല്ല!
ഒരു സൈറ്റിൽ ലോഡ് ചെയ്യാൻ കഴിയാത്തതിൻറെ കാരണങ്ങൾ, വെബ്സൈറ്റ് പരിശോധനയിൽ ഈ പ്രശ്നം പരിഹരിക്കപ്പെടുമ്പോൾ നിങ്ങൾ ശ്രദ്ധിക്കേണ്ട കാര്യങ്ങൾ എന്നിവ പരിശോധിക്കാം .
തെറ്റായ ഫയൽ പാഥുകൾ
നിങ്ങൾ ഒരു സൈറ്റിന്റെ HTML അല്ലെങ്കിൽ CSS ഫയലിലേക്ക് ഇമേജുകൾ ചേർക്കുമ്പോൾ, നിങ്ങളുടെ ഡയറക്റ്ററി ഘടനയിലുള്ള സ്ഥലത്ത് എവിടെയാണ് താമസിക്കുന്നതെന്ന് വ്യക്തമാക്കേണ്ടതാണ്. ഇമേജ് തിരയുന്നതിനും ലഭ്യമാക്കുന്നതിനുമുള്ള ബ്രൗസറിനെ സൂചിപ്പിക്കുന്ന കോഡ് ഇതാണ്. മിക്ക കേസുകളിലും ഇത് 'images' എന്ന ഫോൾഡറിന്റെ ഉള്ളിലായിരിക്കും. ഈ ഫോൾഡറിന്റെയും അതിനുള്ളിലുള്ള ഫയലുകളുടെയും പാത്ത് തെറ്റാണ് എങ്കിൽ, ബ്രൌസർ ശരിയായ ഫയലുകൾ വീണ്ടെടുക്കാൻ കഴിയാത്തതിനാൽ ചിത്രങ്ങൾ ശരിയായി ലോഡ് ചെയ്യില്ല. നിങ്ങൾ പറഞ്ഞ വഴിയെ അത് പിന്തുടരും, പക്ഷേ ഒരു ചത്ത അവസാനവും, അനുയോജ്യമായ ചിത്രം പ്രദർശിപ്പിക്കുന്നതിനു പകരം, ശൂന്യമാകും.
ഇമേജ് ലോഡിങ് പ്രശ്നങ്ങൾ ഡീബഗ്ഗ് ചെയ്യുന്നതിൽ ഘട്ടം 1 നിങ്ങൾ കോഡുചെയ്ത ഫയൽ പാത്ത് ശരിയാണെന്ന് ഉറപ്പു വരുത്തുക എന്നതാണ്. ഒരു പക്ഷേ തെറ്റായ ഡയറക്ടറി നിർദ്ദേശിച്ചിട്ടുണ്ടെങ്കിലോ അല്ലെങ്കിൽ ആ ഡയറക്ടറിയിലേക്കുള്ള പാത്ത് ശരിയായി നൽകപ്പെട്ടിട്ടില്ല. ഇങ്ങനെയല്ലെങ്കിൽ, നിങ്ങൾക്ക് ആ വഴിയിലൂടെ മറ്റൊരു പ്രശ്നം ഉണ്ടായേക്കാം. വായിക്കുക!
ഫയലുകളുടെ പേരുകൾ അസാധുവാക്കി
നിങ്ങളുടെ ഫയലുകൾക്കുള്ള ഫയൽ പാത്തുകൾ പരിശോധിക്കുമ്പോൾ, നിങ്ങൾ ശരിയായ ചിത്രത്തിന്റെ പേര് ശരിയായി എഴുതിയിട്ടുണ്ടെന്ന് ഉറപ്പാക്കുക. ഞങ്ങളുടെ അനുഭവത്തിൽ, തെറ്റായ പേരുകളോ അല്ലെങ്കിൽ അക്ഷരത്തെറ്റകളോ ഇമേജ് ലോഡിംഗ് പ്രശ്നങ്ങൾക്ക് ഏറ്റവും സാധാരണ കാരണം ആകുന്നു. ഓർക്കുക, വെബ് ബ്രൗസറുകൾ ഫയൽ നാമങ്ങൾ വരുമ്പോൾ വളരെ തെറ്റിദ്ധരിപ്പിക്കുന്നതാണ്. നിങ്ങൾ അബദ്ധത്തിൽ ഒരു കത്ത് മറക്കുകയോ അല്ലെങ്കിൽ തെറ്റായ അക്ഷരം ഉപയോഗിക്കുകയോ ചെയ്തെങ്കിൽ, ബ്രൌസർ സമാനമായ ഒരു ഫയലിനായി തിരയുകയും "ഓ, നിങ്ങൾ ഇത് ഉദ്ദേശിച്ചേക്കാമെങ്കിൽ, ശരിയാണോ?" ഇല്ല - ഫയൽ തെറ്റായാണ് എഴുതിയതെങ്കിൽ, അത് അടുത്താണെങ്കിൽ പോലും, അത് പേജിൽ ലോഡ് ചെയ്യില്ല.
തെറ്റായ ഫയൽ വിപുലീകരണം
ചില സന്ദർഭങ്ങളിൽ, നിങ്ങൾ ശരിയായ ഫയലിന്റെ പേര് നൽകിയിരിക്കാം, പക്ഷേ ഫയൽ എക്സ്റ്റൻഷൻ തെറ്റായിരിക്കാം. നിങ്ങളുടെ ചിത്രം ഒരു .jpg ഫയൽ ആണെങ്കിൽ, നിങ്ങളുടെ HTML ഒരു .png എന്നതിനായി തിരയുന്നു, ഒരു പ്രശ്നമുണ്ടാകും. ഓരോ ഇമേജിനും നിങ്ങൾ ശരിയായ ഫയൽ തരം ഉപയോഗിക്കുന്നുണ്ടെന്ന് ഉറപ്പുവരുത്തുക, തുടർന്ന് നിങ്ങളുടെ വെബ്സൈറ്റിന്റെ കോഡിലെ അതേ വിപുലീകരണത്തിനായി നിങ്ങൾ വിളിച്ചിട്ടുണ്ടെന്ന് ഉറപ്പാക്കുക.
കേസ് സെൻസിറ്റിവിറ്റി കൂടി നോക്കുക. നിങ്ങളുടെ ഫയൽ .JPG കൊണ്ട് അവസാനിക്കുന്നുണ്ടെങ്കിൽ, എല്ലാ അക്ഷരങ്ങളും അക്ഷരങ്ങളുപയോഗിച്ച് അവസാനിക്കും, എന്നാൽ നിങ്ങളുടെ കോഡ് റെഫറൻസുകൾ .jpg, എല്ലാ ചെറിയക്ഷരങ്ങളും, ചില വെബ് സെർവറുകൾ, അവ ഒരേ സെറ്റ് സെറ്റ് ആണെങ്കിലും ആ രണ്ട് വ്യത്യസ്തത കാണാം. കേസ് സെൻസിറ്റിവിറ്റി കൗണ്ട്! ഇതുകൊണ്ടാണ് ഞങ്ങൾ എല്ലായ്പ്പോഴും ചെറിയ ഫയലുകൾ എല്ലാ ചെറിയ അക്ഷരങ്ങൾ ഉപയോഗിച്ച് സേവ് ചെയ്യുക. അങ്ങനെ ചെയ്യുന്നതിലൂടെ നമ്മുടെ കോഡിൽ ചെറിയക്ഷരങ്ങൾ ഉപയോഗിക്കാൻ ഞങ്ങളെ അനുവദിക്കുന്നു, ഞങ്ങളുടെ ഇമേജ് ഫയലുകളുമായി ഞങ്ങൾക്ക് ഒരു പ്രശ്നമുണ്ടാക്കാൻ കഴിയുന്നു.
ഫയലുകൾ നഷ്ടമായി
നിങ്ങളുടെ ഇമേജ് ഫയലുകളിലേക്കുള്ള വഴികൾ ശരിയാണെന്നും, നാമവും ഫയൽ എക്സ്റ്റെൻഷനും പിശകുകളുമുണ്ടെങ്കിൽ, പരിശോധിക്കാനുള്ള അടുത്ത വസ്തു, ഫയലുകൾ യഥാർത്ഥ വെബ് സെർവറിലേക്ക് അപ്ലോഡ് ചെയ്തിട്ടുണ്ടെന്നുറപ്പുവരുത്തുക എന്നതാണ്. സൈറ്റ് സമാരംഭിക്കുമ്പോൾ ആ സെർവറിലേക്ക് ഫയലുകൾ അപ്ലോഡുചെയ്യുന്നതിനെ അവഗണിക്കുന്നത് എളുപ്പമല്ലാത്ത ഒരു പൊതു പിശകാണ്.
നിങ്ങൾ എങ്ങനെയാണ് ഈ പ്രശ്നം പരിഹരിക്കുന്നത്? ആ ഇമേജുകൾ അപ്ലോഡുചെയ്യുക, നിങ്ങളുടെ വെബ് പേജ് പുതുക്കുക, അത് പ്രതീക്ഷിച്ചതുപോലെ ഫയലുകൾ ഉടൻ പ്രദർശിപ്പിക്കണം. നിങ്ങൾക്ക് സെർവറിൽ ഇമേജ് ഇല്ലാതാക്കുവാൻ അത് വീണ്ടും ശ്രമിക്കാം. ഇത് വിചിത്രമായി തോന്നിയേക്കാം, എന്നാൽ ഈ ജോലി ഞങ്ങൾ ഒന്നിലധികം തവണ കണ്ടിട്ടുണ്ട്. ചിലപ്പോൾ ഫയലുകൾ കേടായേക്കാം, അതിനാൽ ഈ "മായ്ക്കൽ മാറ്റി പകരം വയ്ക്കാവുന്ന രീതി" സഹായിക്കുന്നു.
ഇമേജുകൾ ഹോസ്റ്റുചെയ്യുന്ന വെബ്സൈറ്റ് താഴേക്ക്
നിങ്ങളുടെ സൈറ്റ് നിങ്ങളുടെ സ്വന്തം സെർവറിലുപയോഗിക്കുന്ന ഏതെങ്കിലും ഇമേജുകൾ ഹോസ്റ്റുചെയ്യാൻ സാധാരണയായി ആഗ്രഹിക്കും, ചില സന്ദർഭങ്ങളിൽ മറ്റെവിടെയെങ്കിലും ഹോസ്റ്റുചെയ്തിരിക്കുന്ന ചിത്രങ്ങൾ നിങ്ങൾ ഉപയോഗിക്കാം. ഇമേജ് ഹോസ്റ്റുചെയ്യുന്ന സൈറ്റിന്റെ താഴേക്ക് പോകുകയാണെങ്കിൽ, നിങ്ങളുടെ ചിത്രങ്ങൾ ഒന്നുകിൽ ലോഡ് ചെയ്യാൻ പോകുന്നില്ല.
ട്രാൻസ്ഫർ പ്രശ്നം
ഒരു ബാഹ്യ ഡൊമെയ്നിൽ നിന്നോ അല്ലെങ്കിൽ നിങ്ങളുടേയോ ഒരു ഇമേജ് ഫയൽ ലോഡ് ചെയ്തിട്ടുണ്ടോ, ബ്രൗസർ ആദ്യം ആവശ്യപ്പെട്ടാൽ ആ ഫയലിനായി ഒരു ട്രാൻസ്ഫർ പ്രശ്നമുണ്ടാകാനുള്ള സാധ്യതയുണ്ട്. ഇത് ഒരു സാധാരണ സംഭവമായിരിക്കരുത് (അത്, നിങ്ങൾ ഒരു പുതിയ ഹോസ്റ്റിംഗ് പ്രൊവൈഡർ നോക്കേണ്ടി വന്നേക്കാം), എന്നാൽ ഇത് കാലാകാലങ്ങളിൽ സംഭവിക്കാം.
ഈ പ്രശ്നത്തിന്റെ ദൗർഭാഗ്യകരമായ വശമാണ് നിങ്ങളുടെ നിയന്ത്രണത്തിനു പുറത്തുള്ള പ്രശ്നം കാരണം നിങ്ങൾക്കത് ചെയ്യാൻ കഴിയില്ല എന്നതാണ്. നല്ല വാർത്ത പലപ്പോഴും വളരെ വേഗത്തിൽ പരിഹരിക്കപ്പെടുന്ന ഒരു താൽക്കാലിക പ്രശ്നമാണ് എന്നതാണ്. ഉദാഹരണത്തിന്, ബ്രേക്ക്-നോക്കിയുള്ള പേജ് കണ്ടാൽ ആ പ്രശ്നം പരിഹരിക്കപ്പെടുമ്പോൾ, അത് പലപ്പോഴും പ്രശ്നം പരിഹരിക്കുകയും ചിത്രങ്ങളെ ശരിയായി ലോഡ് ചെയ്യുകയും ചെയ്യും.ഒരു തകർന്ന ഇമേജ് നിങ്ങൾ കാണുകയാണെങ്കിൽ, ബ്രൌസർ പുതുക്കാനുള്ള ഒരു പ്രശ്നം നിങ്ങളുടെ പ്രാരംഭ അഭ്യർത്ഥന.
ഒരു ചെറിയ അവലംബം
ഇമേജുകളെക്കുറിച്ചും ആശങ്കകൾ സൃഷ്ടിക്കുന്നതിനെക്കുറിച്ചും ചിന്തിക്കുമ്പോൾ , ALT ടാഗുകളുടെയും നിങ്ങളുടെ വെബ്സൈറ്റ് വേഗതയുടെയും മൊത്തത്തിലുള്ള പ്രകടനത്തിൻറെയും ശരിയായ ഉപയോഗമാണ് രണ്ട് കാര്യങ്ങളും ശ്രദ്ധിക്കേണ്ടത്.
ALT അല്ലെങ്കിൽ "alternate text", ഒരു ഇമേജ് ലോഡ് ചെയ്യാൻ കഴിയാത്തപക്ഷം ഒരു ബ്രൌസർ കാണിക്കുന്ന ടാഗുകളാണ് . ചില വൈകല്യങ്ങളുള്ള ആളുകൾക്ക് ഉപയോഗിക്കാൻ കഴിയുന്ന സൈറ്റുകൾ നിർമ്മിക്കുന്നതിൽ അവർ ഒരു പ്രധാന ഘടകമാണ്. നിങ്ങളുടെ സൈറ്റിലെ എല്ലാ ഇൻലൈൻ ഇമേജും ഉചിതമായ ALT ടാഗ് ഉണ്ടായിരിക്കണം. ഈ ആട്രിബ്യൂട്ട് ഇല്ലാത്ത CSS- നൊപ്പം പ്രയോഗിച്ച ചിത്രങ്ങൾ ശ്രദ്ധിക്കുക.
വെബ്സൈറ്റ് പ്രകടനം, നിരവധി ചിത്രങ്ങൾ ലോഡ് ചെയ്യൽ അല്ലെങ്കിൽ വെബ് ഡെലിവറിക്ക് ഉചിതമായി ഒപ്റ്റിമൈസ് ചെയ്തിട്ടില്ലാത്ത ഏതാനും ഭീമൻ ചിത്രങ്ങൾ പോലും ലോഡിംഗ് വേഗതയിൽ പ്രതികൂലമായ പ്രത്യാഘാതങ്ങൾ ഉണ്ടാകും. ഈ കാരണത്താൽ, നിങ്ങളുടെ സൈറ്റിന്റെ ഡിസൈനിൽ ഉപയോഗിക്കുന്ന ഏതെങ്കിലും ഇമേജുകളുടെ ആഘാതം പരിശോധിക്കുന്നതും നിങ്ങളുടെ വെബ്സൈറ്റ് പ്രോജക്ടിന് അനുയോജ്യമായ മൊത്തത്തിലുള്ള കാഴ്ചയും ഭാവവും സൃഷ്ടിക്കുന്നതിനിടയിൽ ആ സൈറ്റിന്റെ പ്രകടനം മെച്ചപ്പെടുത്തുന്നതിന് ആവശ്യമായ നടപടികൾ എടുക്കുന്നതും ഉറപ്പാക്കുക.