Παραπομπές (Links)

Εισαγωγή:

Οι παραπομπές είναι οι ψυχή του Web. Με αυτές μπορούμε να συνδέσουμε 2 σελίδες έτσι ώστε κάνοντας κλικ σε κείμενο (ή εικόνα) της μιας να μεταφερόμαστε στην άλλη. Η γενική σύνταξη μια παραπομπής είναι:

<A HREF="URL">το κείμενο της παραπομπής</A>

όπου URL είναι η θέση κάποιας Web σελίδας (η παράμετρος HREF προέρχεται από τις λέξεις Hypertext REFerence).

Περίπτωση 1

Παραπομπές από μια σελίδα σε μια άλλη κάπου στο Internet

Ο κώδικας θα είναι:

Αυτό που θα βλέπει ο χρήστης θα είναι:

Με κλικ πάνω στην λέξη Yahoo! ο browser θα καλεί την σελίδα http://www.yahoo.com

Περίπτωση 2

Παραπομπές από μια σελίδα σε μια άλλη που βρίσκεται στον ίδιο φάκελο (directory)

Αν η σελίδα στην οποία παραπέμπουμε είναι στο ίδιο directory (folder) με αυτή η οποία έχει την παραπομπή, ο κώδικας θα είναι: <A HREF="όνομα αρχείου">κείμενο παραπομπής</A>

Για παραπομπή στο αρχείο mypage2.htm ο κώδικας θα είναι:

Αυτό που θα βλέπει ο χρήστης θα είναι:

Με κλικ πάνω στην λέξη εδώ ο browser θα καλεί την σελίδα με όνομα αρχείου mypage.htm

Περίπτωση 3

Παραπομπές από μια σελίδα σε μια άλλη που βρίσκεται σε υποφάκελο (subdirectory)

Η γενική σύνταξη είναι: <a href="/υποφάκελος/mypage2.htm">υπογραμμισμένο κείμενο</a>

Παράδειγμα:

Υποθέτουμε πως η αρχική μας σελίδα έχει όνομα mypage1.htm και βρίσκεται στην θέση c:\wwwroot\mypages\dance\tango

Μια δεύτερη σελίδα έχει όνομα mypage2.htm και βρίσκεται στην θέση c:\wwwroot\mypages\dance\tango\argentine

Η παραπομπή από την mypage1.htm στην mypage2.htm θα είναι

<a href="/argentine/mypage2.htm">υπογραμμισμένο κείμενο</a>

Προσοχή! Σε μερικούς unix web servers η σύνταξη πρέπει να είναι <a href="./argentine/mypage2.htm">υπογραμμισμένο κείμενο</a> Υπάρχει δηλαδή μια τελεία πριν το path.

Αν η mypage2.htm βρίσκεται στην θέση

c:\wwwroot\mypages\dance\tango\argentine\evita

Η παραπομπή από την mypage1.htm στην mypage2.htm θα είναι

<a href="/argentine/evita/mypage2.htm">υπογραμμισμένο κείμενο</a>

Περίπτωση 4

Παραπομπές από μια σελίδα σε μια άλλη που βρίσκεται σε ανώτερο φάκελο (directory)

Η γενική σύνταξη είναι: <a href="../mypage2.htm">υπογραμμισμένο κείμενο</a>

(Δεν υπάρχει λόγος να βάλουμε το όνομα του ανώτερου φακέλου διότι κάθε φάκελος έχει μόνον έναν αμέσως ανώτερο. Γι' αυτό αρκούν οι δύο τελείες).

Παράδειγμα:

Υποθέτουμε πως η αρχική μας σελίδα έχει όνομα mypage2.htm και βρίσκεται στην θέση

c:\wwwroot\mypages\dance\tango\argentine

Μια δεύτερη σελίδα έχει όνομα mypage1.htm και βρίσκεται στην θέση

c:\wwwroot\mypages\dance\tango

Η παραπομπή από την mypage2.htm στην mypage1.htm θα είναι

<a href="../mypage1.htm">υπογραμμισμένο κείμενο</a>

Αν η mypage2.htm βρίσκεται στην θέση

c:\wwwroot\mypages\dance\tango\argentine\evita

Η παραπομπή από την mypage2.htm στην mypage1.htm θα είναι

<a href="../../mypage1.htm">υπογραμμισμένο κείμενο</a>

Περίπτωση 5

Παραπομπές από μια σελίδα σε μια άλλη που βρίσκεται σε άλλο (γενικά) φάκελο (directory)

Η σύνταξη της παραπομπής αυτής είναι ένας συνδυασμός των άλλων βημάτων 3 και 4. Για παράδειγμα έστω πως έχουμε τις σελίδες:

mypage1.htm στην διεύθυνση c:\wwwroot\mypages\dance\tango\argentine\evita

mypage2.htm στην διεύθυνση c:\wwwroot\mypages\dance\mambo\cuba\

Η παραπομπή από την mypage1.htm στην mypage2.htm θα είναι:

<A HREF="../../mambo/cuba/mypage2.htm"> υπογραμμισμένο κείμενο</a>

Η παραπομπή αυτή σημαίνει: Από τον τρέχοντα φάκελο (evita) ανέβα στον ανώτερο (../ δηλαδή τον argentine). Μετά ανέβα στον αμέσως ανώτερο (../ δηλαδή τον tango). Από εκεί θα πας στον mambo. Από αυτόν θα πας στον cuba όπου θα βρεις το αρχείο mypage2.htm

Σημείωση: Στα βήματα 2, 3, 4, 5 χρησιμοποιούμε relative links. Δηλαδή οι παραπομπές δεν γίνονται με το απόλυτο path: από το c:\wwwroot\mypages\dance\tango στο

c:\wwwroot\mypages\dance\tango\argentine\evita Γίνονται με το σχετικό: από τον τρέχοντα φάκελο (που είναι ο tango) στον αμέσως ανώτερό του (που είναι ο argentine). Ο τόπος αυτός είναι ο ενδεδειγμένος διότι μας επιτρέπει χωρίς πρόβλημα να μεταφέρουμε ολόκληρο το site από μηχάνημα σε μηχάνημα (ή από φάκελο σε φάκελο) χωρίς να χρειαστεί καμία απολύτως μεταβολή.

Προσοχή! Οι σχετικές παραπομπές δεν λειτουργούν για το πρωτόκολλο file (ο browser προσπαθεί να βρει το αρχείο στον δικό του δίσκο και όχι στον δίσκο του κόμβου από τον οποίο πήρε αυτή την διεύθυνση.

Περίπτωση 6

Παραπομπές από ένα σημείο μιας σελίδας σε ένα άλλο

Πολλές φορές χρειάζεται να παραπέμψουμε τον αναγνώστη όχι σε άλλη σελίδα αλλά σε άλλο τμήμα της ίδιας Web σελίδας. Για να το επιτύχουμε αυτό, χρησιμοποιούμε την παράμετρο NAME για να δώσουμε όνομα στο σημείο στο οποίο θέλουμε να οδηγεί η παραπομπή.

Όνομα (identifier) μπορούμε να δώσουμε είτε σε μια μεμονωμένη λέξη είτε σε ολόκληρο κείμενο. Για παράδειγμα παίρνουμε τις λέξεις: "Η σχέση Internet και Επιχειρήσεων" και τους δίνουμε το όνομα ΧΧΧ. Αυτό γίνεται με την οδηγία <a name="ΧΧΧ">Η σχέση Internet και Επιχειρήσεων</a>

Η παραπομπή στο σημείο της σελίδας που έχει αυτό το όνομα θα είναι:

<a href="#ΧΧΧ">το κείμενο της παραπομπής</a>

Περίπτωση 7

Παραπομπές από μια σελίδα σε ένα σημείο μιας άλλης σελίδας

Πολλές φορές χρειάζεται να παραπέμψουμε τον αναγνώστη όχι στην κορυφή μιας άλλης σελίδας αλλά σε ένα συγκεκριμένο σημείο της. Για να το επιτύχουμε αυτό, χρησιμοποιούμε, όπως και στην περίπτωση 6, την παράμετρο NAME για να δώσουμε όνομα στο σημείο στο οποίο θέλουμε να οδηγεί η παραπομπή.

Όπως και παραπάνω (περίπτωση 6) το όνομα (identifier) μπορεί να είναι μια μεμονωμένη λέξη ή ένα ολόκληρο κείμενο. Για παράδειγμα παίρνουμε τις λέξεις: "Η σχέση Internet και Επιχειρήσεων" και τους δίνουμε το όνομα ΧΧΧ. Αυτό γίνεται με την οδηγία <a name="ΧΧΧ">Η σχέση Internet και Επιχειρήσεων</a>

Η παραπομπή στο σημείο της σελίδας που έχει αυτό το όνομα θα είναι:

<a href="path#ΧΧΧ">το κείμενο της παραπομπής</a>

Όπου path είναι η διαδρομή που πρέπει να ακολουθήσει ο browser για να βρει αυτή τη σελίδα. Για παράδειγμα:

<a href="http://www.eeei.gr/oghgos/info.htm#ΧΧΧ">το κείμενο της παραπομπής</a>

Περίπτωση 8

Παραπομπές για την αποστολή email (mailto: URL)

Για να δημιουργήσουμε μια παραπομπή η οποία θα ανοίγει στο PC του επισκέπτη της σελίδας μας ένα παράθυρο σύνταξης email με παραλήπτη τη διεύθυνση που επιθυμούμε, θα πρέπει να χρησιμοποιήσουμε το mailto: URL στην ακόλουθη σύνταξη:

<A HREF="mailto:gepiti@gepiti.com">Γράψτε μας</A>

Αν ο χρήστης επιλέξει Γράψτε μας τότε το mail πρόγραμμα που χρησιμοποιεί θα ανοίξει ένα κενό παράθυρο αποστολής email με τη διεύθυνση gepiti@gepiti.com ως παραλήπτη.

Αν θέλουμε το παράθυρο αποστολής να έχει ήδη γραμμένο και το θέμα (subject) του mail αυτού, η σύνταξη που θα χρησιμοποιήσουμε είναι:

<a href="mailto:gepiti@gepiti.com?subject=Geia sou gepiti">Γράψτε στον gepiti</a>

Αν κάποιος επιλέξει την παραπομπή Γράψτε στον gepiti θα ανοίξει το ακόλουθο παράθυρο αποστολής με παραλήπτη τον gepiti@gepiti.com και θέμα Geia sou gepiti.

Δυστυχώς το mailto: URL δεν λειτουργεί σε κάποιους πολύ παλαιούς browsers ή αν ο χρήστης δεν έχει εγκατεστημένο ή σωστά ρυθμισμένο κάποιο πρόγραμμα ηλεκτρονικού ταχυδρομείου. Γι' αυτό συνήθως όταν χρησιμοποιούμε το mailto: URL τοποθετούμε ως link τη διεύθυνση του παραλήπτη (π.χ. <A HREF="mailto:gepiti@gepiti.com">gepiti@gepiti.com</A>). Έτσι, ακόμη και όταν βλέπουν την παραπομπή από browser που δεν υποστηρίζει το mailto: θα βλέπουν τη διεύθυνση στην οποία μπορούν να μας γράψουν. 

Γιώργος Επιτήδειος © 2005

Επιστροφή στον Οδηγό Κατασκευής Web Σελίδων