ﻣﺎ ﺍﻟﺬﻱ ﺃﺣﺘﺎﺟﻪ ﻹﻧﺸﺎﺀ ﺭﺍﺑﻂ؟
ﻹﻧﺸﺎﺀ ﺭﺍﺑﻂ ﺳﺘﺴﺘﺨﺪﻡ ﻣﺎ ﺗﺴﺘﺨﺪﻣﻪ ﺩﺍﺋﻤﺎً ﻋﻨﺪﻡ ﻛﺘﺎﺑﺔ :HTML ﻋﻨﺼﺮ، ﻋﻨﺼﺮ ﺑﺴﻴﻂ ﻣﻊ ﺧﺎﺻﻴﺔ ﻭﺍﺣﺪﺓ ﻭﺳﺘﺘﻤﻜﻦ ﻣﻦ ﺇﻧﺸﺎﺀ ﺭﺍﺑﻂ ﻷﻱ ﺷﻲﺀ ﻭﻛﻞ ﺷﻲﺀ ، ﺇﻟﻴﻚ ﻫﺬﺍ ﺍﻟﻤﺜﺎﻝ ﻟﺮﺍﺑﻂ ﻟﻤﻮﻗﻊ HTML.net ﻭﻛﻴﻒ ﺳﻴﻜﻮﻥ ﺷﻜﻠﻪ :
ﻣﺜﺎﻝ :1
<a href="http://www.html.net/">Here is a link to HTML.net</a>
ﺳﻴﻈﻬﺮ ﻓﻲ ﺍﻟﻤﺘﺼﻔﺢ ﺑﻬﺬﺍ ﺍﻟﺸﻜﻞ :
Here is a link to HTML.net
ﺍﻟﻌﻨﺼﺮ a ﻫﻮ ﺍﺧﺘﺼﺎﺭ "anchor" ﻭﺍﻟﺨﺎﺻﻴﺔ href ﻫﻲ ﺍﺧﺘﺼﺎﺭ " hypertext reference " ، ﻭﻫﻲ ﺍﻟﺘﻲ ﺗﺤﺪﺩ ﺇﻟﻰ ﺃﻳﻦ ﺳﻴﺬﻫﺐ ﺍﻟﺮﺍﺑﻂ، ﻏﺎﻟﺒﺎً ﻋﻨﻮﺍﻥ ﻓﻲ ﺍﻹﻧﺘﺮﻧﺖ ﺃﻭ ﺍﺳﻢ ﻣﻠﻒ ﻣﺎ .
ﻓﻲ ﺍﻟﻤﺜﺎﻝ ﺃﻋﻼﻩ ﺍﻟﺨﺎﺻﻴﺔ href ﺗﺤﻮﻱ ﺍﻟﻘﻴﻤﺔ "
http://www.html.net " ، ﻭﻫﻲ ﺍﻟﻌﻨﻮﺍﻥ ﺍﻟﻜﺎﻣﻞ ﻟﻤﻮﻗﻊ HTML.net ﻭﻳﺴﻤﻰ ﺍﻟﻌﻨﻮﺍﻥ URL ﻭﻫﻲ ﺍﺧﺘﺼﺎﺭ " Uniform Resource Locator " ، ﻻﺣﻆ ﺃﻥ
"http://" ﻳﺠﺐ ﺃﻥ ﺗﻀﺎﻑ ﻓﻲ ﺃﻱ ﻋﻨﻮﺍﻥ، ﺃﻣﺎ ﺍﻟﺠﻤﻠﺔ " Here is a link to HTML.net " ﻓﻬﻲ ﺍﻟﻨﺺ ﺍﻟﺬﻱ ﺳﻴﻈﻬﺮ ﻓﻲ ﺍﻟﻤﺘﺼﻔﺢ ﻋﻠﻰ ﺷﻜﻞ ﺭﺍﺑﻂ، ﺗﺬﻛﺮ ﺃﻥ ﺗﻘﻮﻡ ﺑﺈﻏﻼﻕ ﺍﻟﻌﻨﺼﺮ ﺑﻮﺳﻢ ﺍﻹﻋﻼﻕ </a> .
ﻣﺎﺫﺍ ﻋﻦ ﺍﻟﺮﻭﺍﺑﻂ ﺑﻴﻦ ﺍﻟﺼﻔﺤﺎﺕ ﻓﻲ ﻣﻮﻗﻌﻲ؟
ﺇﺫﺍ ﺃﺭﺩﺕ ﺇﻧﺸﺎﺀ ﺭﺍﺑﻂ ﺑﻴﻦ ﺻﻔﺤﺘﻴﻦ ﻓﻲ ﻧﻔﺲ ﺍﻟﻤﻮﻗﻊ ﻓﻼ ﺗﺤﺘﺎﺝ ﺇﻟﻰ ﺃﻥ ﺗﻀﻊ ﻛﺎﻣﻞ ﺍﻟﻌﻨﻮﺍﻥ ﻟﻠﺼﻔﺤﺔ، ﻓﻤﺜﻼً ﺇﺫﺍ ﻗﻤﺖ ﺑﺈﻧﺸﺎﺀ ﺻﻔﺤﺘﻴﻦ ﻭﻟﻨﺴﻤﻬﻤﺎ page1.htm ﻭ page2.htm ﻭﻗﻤﺖ ﺑﺤﻔﻈﻬﻤﺎ ﻓﻲ ﻧﻔﺲ ﺍﻟﻤﺠﻠﺪ ﻓﻴﻤﻜﻨﻚ ﺃﻥ ﺗﺮﺑﻂ ﻣﻦ ﺻﻔﺤﺔ ﺇﻟﻰ ﺃﺧﺮﻯ ﺑﻜﺘﺎﺑﺔ ﺍﺳﻢ ﺍﻟﻤﻠﻒ ﻓﻲ ﺍﻟﺮﺍﺑﻂ، ﻓﻤﺜﻼً ﺭﺍﺑﻂ ﻣﻦ ﺻﻔﺤﺔ page1.htm ﻳﺸﻴﺮ ﺇﻟﻰ page2.htm ﺳﻴﻈﻬﺮ ﺑﻬﺬﺍ ﺍﻟﺸﻜﻞ :
ﻣﺜﺎﻝ :2
<a href="page2.htm">Click here to go to page 2</a>
ﺇﺫﺍ ﻛﺎﻧﺖ ﺍﻟﺼﻔﺤﺔ 2 ﻭﺿﻌﺖ ﻓﻲ ﻣﺠﻠﺪ ﻓﺮﻋﻲ ﻭﻟﻨﺴﻤﻪ "subfolder" ﻓﺎﻟﺮﺍﺑﻂ ﺳﻴﻈﻬﺮ ﺑﻬﺬﺍ ﺍﻟﺸﻜﻞ :
ﻣﺜﺎﻝ :3
<a href="subfolder/page2.htm">Click here to go to page 2</a>
ﻟﻮ ﺃﺭﺩﻧﺎ ﺃﻥ ﻧﻀﻊ ﺭﺍﺑﻄﺎً ﻣﻌﺎﻛﺴﺎً ﻣﻦ ﺍﻟﺼﻔﺤﺔ 2 ﻓﻲ ﺍﻟﻤﺠﻠﺪ ﺍﻟﻔﺮﻋﻲ ﺇﻟﻰ ﺍﻟﺼﻔﺤﺔ 1 ﺳﻴﻜﻮﻥ ﺷﻜﻞ ﺍﻟﺮﺍﺑﻂ ﻫﻜﺬﺍ :
ﻣﺜﺎﻝ :4
<a href="../page1.htm">A link to page 1</a>
"../" ﺗﺸﻴﺮ ﺇﻟﻰ ﻣﺠﻠﺪ ﻭﺍﺣﺪ ﻓﻲ ﻣﺴﺘﻮﻯ ﺃﻋﻠﻰ ﻣﻦ ﺍﻟﻤﻠﻒ ﺍﻟﺬﻱ ﻳﺤﻮﻱ ﺍﻟﺮﺍﺑﻂ، ﺑﻨﻔﺲ ﺍﻟﻨﻈﺎﻡ ﻳﻤﻜﻦ ﺍﻹﺷﺎﺭﺓ ﺇﻟﻰ ﻣﺴﺘﻮﻳﻴﻦ ﺃﻭ ﺃﻛﺜﺮ ﻣﻦ ﺍﻟﻤﺠﻠﺪﺍﺕ ﺑﻜﺘﺎﺑﺔ "../../" .
points to the folder one level up from position of the file from which the link is made. Following the same system, you can also point two (or more) folders up by writing
ﻫﻞ ﻓﻬﻤﺖ ﻫﺬﺍ ﺍﻟﻨﻈﺎﻡ؟ ﺑﺈﻣﻜﺎﻧﻚ ﺩﺍﺋﻤﺎً ﺃﻥ ﺗﻜﺘﺐ ﺍﻟﻌﻨﻮﺍﻥ ﺍﻟﻜﺎﻣﻞ ﻟﻠﻤﻠﻒ ﺇﺫﺍ ﻭﺟﺪﺕ ﻫﺬﺍ ﺍﻟﻨﻈﺎﻡ ﻣﻌﻘﺪﺍً .
ﻣﺎﺫﺍ ﻋﻦ ﺍﻟﺮﻭﺍﺑﻂ ﺍﻟﺪﺍﺧﻠﻴﺔ ﻓﻲ ﻧﻔﺲ ﺍﻟﺼﻔﺤﺔ؟
ﺑﺈﻣﻜﺎﻧﻚ ﺇﻧﺸﺎﺀ ﺭﻭﺍﺑﻂ ﺩﺍﺧﻠﻴﺔ ﺿﻤﻦ ﺍﻟﺼﻔﺤﺔ، ﻓﻤﺜﻼً ﻳﻤﻜﻨﻚ ﺇﻧﺸﺎﺀ ﺟﺪﻭﻝ ﺑﺎﻟﻤﺤﺘﻮﻳﺎﺕ ﺍﻋﻠﻰ ﺍﻟﺼﻔﺤﺔ ﻭﻳﺤﻮﻱ ﺭﻭﺍﺑﻂ ﺗﺸﻴﺮ ﺇﻟﻰ ﻛﻞ ﻓﺼﻞ ﻓﻲ ﺍﻟﺼﻔﺤﺔ، ﻛﻞ ﻣﺎ ﺗﺤﺘﺎﺟﻪ ﻫﻲ ﺧﺎﺻﻴﺔ ﺗﺴﻤﻰ
id ﺃﻭ "identification" ﻭﺍﻟﻌﻼﻣﺔ ."#"
ﺍﺳﺘﺨﺪﻡ ﺧﺎﺻﻴﺔ id ﻟﺘﻀﻊ ﺇﺷﺎﺭﺓ ﻟﻠﻌﻨﺼﺮ ﺍﻟﺬﻱ ﺗﺮﻳﺪ ﻭﺿﻊ ﺭﺍﺑﻂ ﻟﻪ، ﻣﺜﺎﻝ :
<h1 id="heading1">heading 1</h1>
ﺑﺈﻣﻜﺎﻧﻚ ﺍﻵﻥ ﺇﻧﺸﺎﺀ ﺭﺍﺑﻂ ﻟﻬﺬﺍ ﺍﻟﻌﻨﺼﺮ ﺑﺎﺳﺘﺨﺪﺍﻡ ﻋﻼﻣﺔ "#" ﻓﻲ ﺧﺎﺻﻴﺔ ﺍﻟﺮﺍﺑﻂ، ﺍﻟﻌﻼﻣﺔ "#" ﻳﺠﺐ ﺃﻥ ﺗﺘﺒﻊ ﺑﻘﻴﻤﺔ id ﻟﻠﻌﻨﺼﺮ ﺍﻟﺬﻱ ﺗﺮﻳﺪ ﺍﻟﺮﺑﻂ ﻟﻪ، ﻣﺜﺎﻝ :
<a href="#heading1">Link to heading 1</a>
ﻛﻞ ﻫﺬﺍ ﺳﻴﺘﻀﺢ ﻣﻊ ﻫﺬﺍ ﺍﻟﻤﺜﺎﻝ :
ﻣﺜﺎﻝ :5
<html>
<head>
</head>
<body>
<p><a href="#heading1">Link to heading 1</a></p>
<p><a href="#heading2">Link to heading 2</a></p>
<h1 id="heading1">heading 1</h1>
<p>Text text text text</p>
<h1 id="heading2">heading 2</h1>
<p>Text text text text</p>
</body>
</html>
ﺳﻴﻈﻬﺮ ﺑﻬﺬﺍ ﺍﻟﺸﻜﻞ ﻓﻲ ﺍﻟﻤﺘﺼﻔﺢ ( ﺟﺮﺏ ﺃﻥ ﺗﻀﻐﻂ ﻋﻠﻰ ﺍﻟﺮﺍﺑﻄﻴﻦ ) :
Link to heading 1
Link to heading 2
Heading 1
Text text text text
Heading 2
Text text text text
ﻣﻼﺣﻈﺔ : ﻗﻴﻤﺔ ﺍﻟﺨﺎﺻﻴﺔ id ﻳﺠﺐ ﺃﻥ ﺗﺒﺪﺃ ﺑﺤﺮﻑ ﻭﻟﻴﺲ ﺑﺮﻗﻢ .
ﻫﻞ ﻳﻤﻜﻦ ﺃﻥ ﺃﺿﻊ ﺭﺍﺑﻄﺎً ﻷﻱ ﺷﻲﺀ ﺁﺧﺮ؟
ﺑﺈﻣﻜﺎﻧﻚ ﺃﻳﻀﺎً ﺃﻥ ﺗﻀﻊ ﺭﻭﺍﺑﻂ ﻟﻌﻨﺎﻭﻳﻦ ﺑﺮﻳﺪ ﺇﻟﻜﺘﺮﻭﻧﻲ، ﻳﻤﻜﻨﻚ ﻓﻌﻞ ﺫﻟﻚ ﺑﻄﺮﻳﻘﺔ ﻣﺸﺎﺑﻬﺔ ﻟﻄﺮﻳﻘﺔ ﻭﺿﻊ ﺭﺍﺑﻂ ﻟﺼﻔﺤﺔ ﺃﺧﺮﻯ :
ﻣﺜﺎﻝ :6
<a href="mailto:nobody@html.net">Send an e-mail to nobody at HTML.net</a>
ﺳﻴﻈﻬﺮ ﺑﻬﺬﺍ ﺍﻟﺸﻜﻞ ﻓﻲ ﻣﺘﺼﻔﺤﻚ
Send an e-mail to nobody at HTML.net
ﺍﻻﺧﺘﻼﻑ ﺍﻟﻮﺣﻴﺪ ﺑﻴﻦ ﺍﻟﺮﺍﺑﻂ ﻟﺒﺮﻳﺪ ﺇﻟﻜﺘﺮﻭﻧﻲ ﻭﺭﺍﺑﻂ ﻟﻤﻠﻒ ﻫﻮ ﻛﺘﺎﺑﺔ mailto: ﻣﺘﺒﻮﻋﺎً ﺑﻌﻨﻮﺍﻥ ﺍﻟﺒﺮﻳﺪ، ﻋﻨﺪﻣﺎ ﻳﻀﻐﻂ ﺃﺣﺪﻫﻢ ﻋﻠﻰ ﺍﻟﺮﺍﺑﻂ ﺳﻴﻌﻤﻞ ﺑﺮﻧﺎﻣﺞ ﺍﻟﺒﺮﻳﺪ ﺍﻹﻟﻜﺘﺮﻭﻧﻲ ﻭﻳﻌﺮﺽ ﺭﺳﺎﻟﺔ ﺟﺪﻳﺪﺓ ﻓﺎﺭﻏﺔ ﺗﺤﻮﻱ ﻋﻨﻮﺍﻥ ﺍﻟﺒﺮﻳﺪ ﺍﻹﻟﻜﺘﺮﻭﻧﻲ ﺍﻟﺬﻱ ﻭﺿﻌﺘﻪ ﻓﻲ ﺍﻟﺮﺍﺑﻂ، ﺳﻴﺤﺪﺙ ﻫﺬﺍ ﻓﻲ ﺣﺎﻝ ﻭﺟﺪ ﺑﺮﻧﺎﻣﺞ ﺑﺮﻳﺪ ﺇﻟﻜﺘﺮﻭﻧﻲ ﻣﺜﺒﺖ ﻋﻠﻰ ﺍﻟﺤﺎﺳﻮﺏ، ﺟﺮﺏ ﺫﻟﻚ ﺍﻵﻥ !
ﻫﻞ ﻫﻨﺎﻙ ﺧﺼﺎﺋﺺ ﺃﺧﺮﻯ ﻳﺠﺐ ﻋﻠﻲ ﺃﻥ ﺃﻋﺮﻓﻬﺎ؟
ﻹﻧﺸﺎﺀ ﺭﺍﺑﻂ ﺍﺳﺘﺨﺪﺍﻡ ﺩﺍﺋﻤﺎً ﺍﻟﺨﺎﺻﻴﺔ href ﺑﺎﻹﺿﺎﻓﺔ ﺇﻟﻰ ﺫﻟﻚ ﺑﺈﻣﻜﺎﻧﻚ ﺃﻥ ﺗﻀﻊ ﺧﺎﺻﻴﺔ title ﻟﻠﺮﺍﺑﻂ :
ﻣﺜﺎﻝ :7
<a href="http://www.html.net/" title="Visit HTML.net and learn HTML">HTML.net</a>
ﺳﻴﻈﻬﺮ ﺑﻬﺬﺍ ﺍﻟﺸﻜﻞ ﻓﻲ ﺍﻟﻤﺘﺼﻔﺢ :
HTML.net
ﺧﺎﺻﻴﺔ title ﺗﺴﺘﺨﺪﻡ ﻟﻮﺿﻊ ﺷﺮﺡ ﻗﺼﻴﺮ ﻋﻦ ﺍﻟﺮﺍﺑﻂ، ﺇﺫﺍ ﻭﺿﻌﺖ ﻣﺆﺷﺮ ﺍﻟﻔﺄﺭﺓ ﻋﻠﻰ ﺍﻟﺮﺍﺑﻂ ﺩﻭﻥ ﺃﻥ ﺗﻀﻐﻂ ﻋﻠﻴﻪ ﺳﺘﺮﻯ ﺍﻟﻨﺺ ﺍﻟﺬﻱ ﻛﺘﺒﺘﻪ ﻓﻲ ﺧﺎﺻﻴﺔ title ﻳﻈﻬﺮ ﻟﻚ .
