Εκμάθηση HTML/Σύνδεσμοι

Προηγούμενη Ενότητα	Περιεχόμενα	Τέλος

Τα γνωστά μας links μπορούν να παραπέμψουν τον επισκέπτη της ιστοσελίδας μας σε άλλη σελίδα του ίδιου ιστότοπου ή ακόμα και σε εξωτερική.

Εξωτερικοί σύνδεσμοι

<a href="http://el.wikiversity.org/wiki/">Αυτός είναι ένας σύνδεσμος 
που οδηγεί στην κεντρική σελίδα του Βικιεπιστημίου.</a>

Το tag <a> (anchor) δίνει μερικές ιδιότητες στο κείμενό μας. Μία από αυτές είναι το href (Hypertext Reference), που δίνει την δυνατότητα να συνδέσουμε ένα κομμάτι κειμένου με μια ιστοσελίδα. Ο σύνδεσμος στον οποίο θέλουμε να οδηγεί θα πρέπει να εσωκλείεται από διπλά εισαγωγικά ". Κατόπιν κλείνουμε το open tag, γράφουμε το κείμενό μας, και γράφουμε και το close tag </a>. Περνώντας τον κέρσορα πάνω από αυτό το κείμενο, δίνεται η δυνατότητα ο επισκέπτης να κάνει κλικ πάνω του, και έτσι ανακατευθύνετε σε μια άλλη σελίδα.

Μια επίσης σημαντική παράμετρος είναι η target. Θέτοντας την target ως "_blank", η σελίδα του συνδέσμου θα ανοίξει σε μια νέα καρτέλα του φυλλομετρητή μας, και όχι στην ίδια σελίδα.

<a href="http://el.wikiversity.org/wiki/" target="_blank">Αυτός είναι ένας 
σύνδεσμος που ανοίγει μια νέα καρτέλα για το Βικιεπιστήμιο.</a>

Εσωτερικοί σύνδεσμοι

Ήρθε η ώρα να δοκιμάσουμε κάτι πιο ενδιαφέρον.

Γράψτε τον παρακάτω κώδικα στο αρχείο index.htm σας.

<html>
<body>
 
<h1>Τίτλος σελίδας</h1>
 <a href="page1.html">Σελίδα 1</a>
 <a href="page2.html">Σελίδα 2</a>

</body>
</html>

Επίσης δημιουργήστε στον ίδιο φάκελο, άλλα δύο αρχεία με το όνομα page1.htm, και page2.htm, το καθένα με ξεχωριστό περιεχόμενο. Κατόπιν, ανοίξτε με τον φυλλομετρητή σας το αρχείο index.htm, και θα δείτε δύο συνδέσμους, ο καθένας να οδηγεί σε μια από τις δύο σελίδες. Όπως αντιλαμβάνεστε για σελίδες που βρίσκονται στον ίδιο φάκελο ή και μέσα σε άλλους φακέλους αλλά στον ίδιο υπολογιστή, μπορείτε απλά να τοποθετήσετε έναν εσωτερικό σύνδεσμο.

Σύνδεσμοι στην ίδια σελίδα

Μια επίσης πολύ ενδιαφέρουσα παράμετρος είναι η name. Με αυτήν μπορούμε με ένα κλικ ο φυλλομετρητής να κατέβει/ανέβει στο σημείο της σελίδας που θέλουμε.

<a name="content">Κάποιο περιεχόμενο</a>
<!-- Παρεμβάλλεται αρκετό κείμενο, ούτως ώστε να υπάρξει οριζόντια μπάρα 
και ο χρήστης να χρειάζεται να κατέβει για να διαβάσει όλο το κείμενο -->
<a href="#content">Επιστροφή στο περιεχόμενο</a>

e-mail

Τέλος έχετε την δυνατότητα να προσθέσετε έναν σύνδεσμο επικοινωνίας.

<a href="mailto:someone@wikiversity.com?subject=Γεια%20σου">Επικοινωνία</a>
<!-- O συμβολισμός %20 είναι το κενό. Αυτό που θα γίνει είναι να ανοίξει το ηλεκτρονικό 
ταχυδρομείο του επισκέπτη με τον τίτλο: Γεια σου -->