Absolute and Relative URL in HTML with a simple example.

Absolute and Relative URL in HTML: जैसाकि हम जानते हैं कि एक URL Internet पर स्थित किसी Resource को Locate करने का काम करता है। हर Web Page और Image यहां तक कि Internet पर स्थित हर File का एक Unique URL होता है, जो कि उस Particular File को प्राप्‍त करने का एक Address होता है। Internet पर स्थित किन्‍हीं भी दो Resources का URL एक समान नहीं होता है।

यदि हमें किसी Web Site कि किसी Particular Web Page को प्राप्‍त करना होता है, तो हमें हमारे Web Browser के Address Bar में उस Web Page का Web Address यानी URL लिखना पडता है। उदाहरण के लिए यदि हमें किसी Web Site के Home Page पर जाना हो, तो हमें हमारे Web Browser के Address Bar में http://www.exampleNewSite.com/entertainment/index.htm Web Address यानी URL लिखना पडता है। ये Web Address एक Absolute URL का उदाहरण है, क्‍योंकि इसमें हमने URL के सभी हिस्‍सों को उपयोग में लेकर index.htm Web Page को Locate किया है।

यानी यदि हमें Internet पर स्थित किसी Resource को प्राप्‍त करने के लिए उसके पूरे Unique Web Address का प्रयोग करना पडे, तो वह Unique Web Address Absolute URL कहलाता है।

जैसाकि हम देख सकते हैं कि Absolute URL काफी बडे हो सकते हैं और चूंकि एक Web Page पर कई Links हो सकते हैं, इसलिए हर Resource को प्राप्‍त करने के लिए Absolute Web Address का प्रयोग करना Practical तरीका नहीं हो सकता। इसलिए हम Internet पर स्थित किसी Resource को प्राप्‍त करने के लिए Relative URLs का प्रयोग करते हैं। Relative URLs अन्‍य Resources को Current Resource के Relation में Locate करते हैं। उदाहरण के लिए मानलो कि हम निम्‍न Web Site में Entertainment Section के Index Page पर जाना चाहते हैं:

http://www.exampleNewSite.com/Entertainment/index.htm

और वहां पहुंचने के बाद हम Index Page पर एक Film, TVAndRadio, Arts व Music Section के लिए एक Link Add करना चाहते हैं। अब हर Page के लिए पूरा Absolute URL Use करने के बजाय हम Index Page पर निम्‍नानुसार Relative URL Use कर सकते हैं:

Film/index.htm
TVAndRadio/TVAndRadio.htm
Arts/index.htm
Music/Music.htm

हालांकि हम ये Short तरीका Use करते हैं, लेकिन हमारा Web Browser हमारे Resource को उसके Absolute URL से ही Identify करता है और इस Relative URL को हमारा Browser स्‍वयं ही Absolute URL में Convert कर लेता है। Relative URL Use करने का एक और फायदा ये होता है, कि यदि किसी स्थिति में हम हमारा Domain Name Change कर लेते हैं, तो हमें हमारी Site के हर Web Page पर स्थित Link को नए Domain Name के आधार पर Modify करने की जरूरत नहीं रहती है क्‍योंकि हमारी Site का हर Link दूसरे Page के Relative URL पर आधारित होता है।

Relative URL Change होने पर सभी Pages के Links Automatically Internally Modify हो जाते हैं। जब हम Relative URL का प्रयोग करते हैं, तब हमें केवल एक बात का ध्‍यान रखना होता है कि Relative URL केवल Same Directory Structure पर ही Apply होते हैं। यदि हम किसी दूसरी Directory के किसी Page को Relative URL द्वारा Access करना चाहें, तो हम ऐसा नहीं कर सकते हैं।

जब हम जिस Directory में होते हैं, उसी Directory के किसी Resource को Current Resource से Link करना चाहते हैं, तब हमें केवल उस Link होने वाले Resource के नाम को ही URL में Specify करना होता है। उदाहरण के लिए मानलो कि abc.htm व xyz.htm दोनों ही Web Pages MySite नाम की Directory में है, तो abc.htm में xyz.htm का Link Specify करने के लिए हमें, केवल File को नाम को ही Use करना होगा।

जब हम जिस Directory में होते हैं, उसकी किसी Sub-Directory में स्थित किसी Resource को हमें हमारे Current Web Page से Link करना हो, तो हमें उस Directory के नाम को भी साथ में उपयोग में लेना पडता है। उदाहरण के लिए मानलो कि MySite Directory में Images नाम की एक और Directory है, जिसमें pqr.jpg नाम की एक Image File है, जिसे हम MySite में स्थित index.htm Web Page से Link करना चाहते हैं। इस Image को Link करने के लिए हमें index.htm File में निम्‍न Statement लिखना पडता है:

<a href=”Images/pqr.jpg”>My Image</a>

हम देख सकते हैं कि Current Directory की किसी Sub-Directory में स्थित किसी File को Locate करने के लिए हमें Sub-Directory के नाम के बाद एक Forward Slash का प्रयोग करके उस File को Refer करना पडता है, जिसे हम Link करना चाहते हैं। यदि Link की जाने वाली File एक से ज्‍यादा Level की Sub-Directory में हो, तो हमें एक से ज्‍यादा Sub-Directory के नाम को Specify करने के बाद अन्‍त में अपनी File के नाम को Specify करना होता है।

उदाहरण के लिए मानलो कि pqr.jpg नाम की Image File Images नाम की Directory में स्थित JPG नाम की Directory में है और हमें हमारी index.htm File में इस Image को Link करना है, तो index.htm File में हमें निम्‍नानुसार Statement लिखना होगा:

<a href=”Images/JPG/pqr.jpg”>My Image</a>

यदि हम हमारे Current Directory में स्थित किसी File से Parent Directory में स्थित किसी File को Link करना चाहते हैं, तो हमें हमारी Link होने वाली File के नाम से पहले “../” चिन्‍ह का प्रयोग करना पडता है। यदि हमारी वांछित File हमारे Current Parent के Parent यानी हमारे Grand Parent Directory में हो, तो हमें ये Symbol दो बार लगाना पडता है और ये क्रम आगे भी चलता रहता है।

उदाहरण के लिए यदि हम JPG नाम की Directory में स्थित Wallpapers.htm नाम की File से index.htm File को Link करना चाहें, तो हमें Wallpapers.htm नाम की File में हमें निम्‍न Statement लिखना होगा:

<a href=”../../index.htm”>My Image</a>

इसी तरह से यदि हम Images नाम के Folder में स्थित Wallpaper.htm नाम की File से index.htm File को Link करना चाहें, तो हमें निम्‍न Statement लिखना होगा:

<a href=”../index.htm”>My Image</a>

हम चाहे कितने भी Level की Sub-Directory में हों, लेकिन यदि हम Root Directory में स्थित‍ किसी File को Sub-Directory में स्थित किसी File से Link करना चाहते हों, तो हम ये काम एक Single Forward Slash का प्रयोग करते हुए Root Directory में स्थित File का नाम Use करके उससे Link स्‍थापित कर सकते हैं। यानी यदि हम चाहें तो उपरोक्‍त दोनों Statement करे निम्‍नानुसार भी लिख सकते हैं:

<a href=”/index.htm”>My Image</a>

हम चाहे किसी भी Level के Sub-Folder में हों, ये Statement उस Folder की किसी File में इस Statement द्वारा Hyperlink के रूप में इस index.htm File को Link कर सकते हैं। ये काम ठीक उसी काम का बिल्‍कुल विपरीत काम है, जिस में पूरा Path बता कर हम index.htm File से किसी भी Level के Sub-Folder की किसी भी File को Link कर सकते हैं। (Absolute and Relative URL in HTML)

Absolute and Relative URL in HTML