વેબસાઈટો કોઈપણ સંચાર માધ્યમથી વિપરીત છે જે તેમની પહેલા આવ્યા હતા. મુખ્ય વસ્તુઓ કે જે અગાઉના મીડિયા બંધારણો, જેમ કે પ્રિન્ટ, રેડિયો અને ટેલિવિઝન સિવાયના વેબસાઇટ્સને અલગ રાખે છે તે " હાયપરલિંક " નો ખ્યાલ છે.
હાઇપરલિંક્સ, જે સામાન્ય રીતે ફક્ત "લિંક્સ" તરીકે ઓળખાય છે, તે વેબને એટલી ગતિશીલ બનાવે છે. પ્રિન્ટેડ પ્રકાશનથી વિપરીત જે અન્ય લેખ અથવા અન્ય સ્રોતને સંદર્ભ આપી શકે છે, વેબસાઇટ્સ આ લિંક્સનો ઉપયોગ ખરેખર તે અન્ય પૃષ્ઠો અને સ્રોતોને મુલાકાતીઓને મોકલી શકે છે. કોઈ અન્ય પ્રસારણ માધ્યમ આ કરી શકે છે. તમે રેડિયો પર કોઈ જાહેરાત સાંભળી શકો છો અથવા ટીવી પર જોઈ શકો છો, પરંતુ કોઈ હાયપરલિંક્સ નથી કે જે તમને તે જાહેરાતોમાં કંપનીઓને જે રીતે વેબસાઇટ સરળતાથી કરી શકે છે તે લઈ શકે છે. કડીઓ ખરેખર એક આકર્ષક સંચાર અને ક્રિયાપ્રતિક્રિયા સાધન છે!
વારંવાર, લિંક્સ જે વેબસાઇટ પર જોવા મળે છે તે ટેક્સ્ટ સામગ્રી છે જે મુલાકાતીને તે જ સાઇટના અન્ય પૃષ્ઠો પર દિશા નિર્દેશિત કરે છે. વેબસાઈટની સંશોધક પ્રેક્ટિસમાં ટેક્સ્ટ લિંક્સનું એક ઉદાહરણ છે પરંતુ લિંક્સને ટેક્સ્ટ-આધારિત કરવાની જરૂર નથી. તમે તમારી વેબસાઇટ પર સરળતાથી છબીઓને લિંક કરી શકો છો. ચાલો જોઈએ કે આ કેવી રીતે થાય છે, અમુક ઉદાહરણો છે જ્યાં તમે ઇમેજ-આધારિત હાયપરલિંક્સનો ઉપયોગ કરવા માગો છો.
એક છબી કેવી રીતે લિંક કરવી
પ્રથમ વસ્તુ જે તમારે કરવાની જરૂર છે તે તમારા HTML દસ્તાવેજમાં ઇમેજને મૂકવી છે. છબી-આધારિત લિન્કનો સામાન્ય ઉપયોગ સાઇટના લોગો ગ્રાફિક છે જે પછી સાઇટના હોમપેજ પર પાછા જોડાય છે. નીચે આપેલા અમારા ઉદાહરણ કોડમાં, જે ફાઇલ અમે વાપરી રહ્યા છીએ તે અમારા લોગો માટે એસવીજી છે . આ એક સારો વિકલ્પ છે કારણ કે તે અમારી છબીને વિવિધ રિઝોલ્યૂશન્સ માટે માપવા માટે પરવાનગી આપે છે, જ્યારે છબી ગુણવત્તા અને નાના એકંદર ફાઇલ કદ જાળવી રાખે છે.
અહીં તમે HTML દસ્તાવેજમાં તમારી છબી કેવી રીતે મૂકશો તે અહીં છે:
છબી ટૅગની આસપાસ, તમે હવે એન્કર લિંક્સને ઉમેરશો, છબીની પહેલા એન્કર ઘટક ખોલીને અને છબી પછી એન્કર બંધ કરી શકો છો. આ તમે ટેક્સ્ટને કેવી રીતે લિંક કરશો તેના જેવી જ છે, ફક્ત તમે એન્કર ટેગ સાથે લિંક થવા માંગતા શબ્દોને વીંટાવવાને બદલે, તમે છબીને લપેટી શકો છો. નીચે આપેલા અમારા ઉદાહરણમાં, અમે પાછા અમારી સાઇટના હોમપેજ સાથે જોડીએ છીએ, જે "index.html" છે.
આ પૃષ્ઠને તમારા પૃષ્ઠમાં ઉમેરતી વખતે, એન્કર ટેગ અને છબી ટેગ વચ્ચે કોઈ જગ્યાઓ ન મૂકો. જો તમે કરો, તો કેટલાક બ્રાઉઝર્સ છબીની બાજુમાં થોડી બટનો ઉમેરશે, જે વિચિત્ર દેખાશે.
લોગો ઇમેજ હવે હોમપેજ બટન તરીકે કાર્ય કરશે, જે આ દિવસોમાં ખૂબ જ એક વેબ સ્ટાન્ડર્ડ છે. નોંધ લો કે આપણી એચટીએમએલ માર્કઅપમાં ઈમેજની પહોળાઈ અને ઊંચાઈ જેવી કોઈ દ્રશ્ય શૈલીઓ શામેલ નથી. અમે આ વિઝ્યુઅલ સ્ટાઇલ CSS ને છોડી દઈશું અને HTML માળખું અને CSS શૈલીઓના સ્વચ્છ અલગ જાળવીશું.
એકવાર તમે CSS પર જાઓ તે પછી, તમે આ લોગોને લક્ષ્યાંક બનાવવા માટે જે સ્ટાઇલ લખશો તેમાં મલ્ટી-ડિવાઇસ મૈત્રીપૂર્ણ ઈમેજો માટે પ્રતિક્રિયાત્મક શૈલીઓ તેમજ કોઈ પણ દ્રશ્યો કે જે તમે છબી / લિંક પર ઉમેરવા માંગો છો, જેમ કે સરહદો અથવા CSS ડ્રોપ શેડોઝ તમે તમારી છબી આપી શકો છો અથવા ક્લાસ એટ્રીબ્યુટ લિંક કરી શકો છો જો તમને તમારા CSS સ્ટાઇલ સાથે વાપરવા માટે વધારાના "હુક્સ" ની જરૂર હોય
છબી લિંક્સ માટે કેસોનો ઉપયોગ કરો
તેથી એક છબી લિંક ઉમેરી ખૂબ સરળ છે. જેમ આપણે હમણાં જ જોયું છે, તમારે જે કરવું જોઈએ તે બધાને યોગ્ય એન્કર ટેગ સાથે છબી લપેટે છે. તમારો આગલો પ્રશ્ન "પહેલાંથી ઉપરોક્ત લોગો / હોમપેજ લિંક ઉદાહરણ ઉપરાંત આમાં ક્યારે કાર્ય કરશે?"
અહીં કેટલાક વિચારો છે:
- એક ગેલેરીમાં થંબનેલ છબીઓ જે તે છબીઓના મોટા સંસ્કરણો સાથે લિંક કરે છે.
- ઇ-કૉમર્સ વેબસાઇટ માટે ઉત્પાદન ફોટા જેવી સામગ્રીનું પ્રતિનિધિત્વ કરવા માટે એકલા ઉપયોગમાં લેવાતી છબીઓ.
- સતામણી કરનાર ઈમેજો કે જે અન્ય સામગ્રીનો એક ભાગ છે, જેમ કે બ્લૉગ લેખ અથવા અખબારી પ્રકાશન, જે લોકોને નોંધ લે છે કે સામગ્રી તેમને સંપૂર્ણ લેખ વાંચવા અથવા ક્લિક કરવા માટે લક્ષ્ય વિસ્તાર આપે છે.
- સાઇટની અંદર ચોક્કસ કાર્યક્ષમતા અથવા પૃષ્ઠોને કનેક્ટ કરવા માટે બટન્સ તરીકે ઉપયોગમાં લેવાતા આયકન છબીઓ.
- સામાજિક મીડિયા લિંક્સ જે તે સાઇટ અથવા કંપની માટે મહત્વપૂર્ણ છે તે વિવિધ સોશિયલ મીડિયા સાઇટ્સના ઓળખી શકાય તેવા લોગોનો ઉપયોગ કરે છે.
- કેટલીક વિધેયો માટે બટનો તરીકે ઉપયોગમાં લેવાતી છબીઓ, જેમ કે ફોર્મ સબમિશન (શ્રેષ્ઠ પ્રેક્ટિસ નોટ - વેબસાઇટની કામગીરી પરિપ્રેક્ષ્યથી, બટનો CSS સાથે સ્પષ્ટ રીતે સ્ટાઇલ કરેલા બટનો ઇમેજ બટન્સ કરતા વધુ સારી પસંદગી છે).
છબીઓનો ઉપયોગ કરતી વખતે રીમાઇન્ડર
છબીઓ વેબસાઇટની સફળતામાં મહત્વપૂર્ણ ભૂમિકા ભજવી શકે છે. તે સામગ્રી પર ધ્યાન દોરવા અને લોકો તેને વાંચવા માટે વિચાર કરવા માટે અન્ય સામગ્રી સાથેની છબીઓનો ઉપયોગ કરીને ઉપર દર્શાવેલ ઉદાહરણોમાંથી એક.
છબીઓનો ઉપયોગ કરતી વખતે, તમારે તમારી જરૂરિયાતો માટે યોગ્ય છબી પસંદ કરવા માટે ધ્યાન આપવું જોઈએ, તેમાં યોગ્ય ઇમેજ વિષય, ફોર્મેટ, અને એ પણ સુનિશ્ચિત કરવામાં આવે છે કે તમે તમારી વેબસાઇટ પર જે છબીઓનો ઉપયોગ કરો છો તે વેબસાઇટ વિતરણ માટે યોગ્ય રીતે ઑપ્ટિમાઇઝ કરેલું છે . આ છબીઓ ઉમેરવા માટે ઘણું કામ જેવું લાગે છે, પરંતુ ચૂકવણી તે મૂલ્યના છે! છબીઓ ખરેખર સાઇટની સફળતામાં ખૂબ જ ઉમેરી શકે છે
તમારી સાઇટ પર યોગ્ય છબીઓનો ઉપયોગ કરવા માટે અચકાવું નહીં, અને તમારી સામગ્રીમાં કંઈક ક્રિયાપ્રતિક્રિયાત્મક રીતે ઉમેરવાની જરૂર હોય ત્યારે તે છબીઓને લિંક કરો, પણ આ છબીને શ્રેષ્ઠ પ્રયાસોથી ધ્યાનમાં રાખો અને તમારા વેબ ડીઝાઇન કાર્યમાં આ ગ્રાફિક્સ / લિંક્સ યોગ્ય રીતે અને જવાબદારીપૂર્વકનો ઉપયોગ કરો.