[eeei.gr Logo]
Επικοινωνία
Ταυτότητα
Μαθήματα Internet | Μαθήματα Προγραμματισμού | Net Business | Τα νέα του Internet | Ο Κόσμος του Αύριο

ΤΑ TAGS ΚΑΙ ΟΙ ΛΕΙΤΟΥΡΓΙΕΣ ΠΟΥ ΕΠΙΤΕΛΕΙ ΚΑΘΕΝΑ ΑΠΟ ΑΥΤΑ

<HTML>...</HTML>

Κάθε Web σελίδα αρχίζει με την οδηγία (tag) <HTML> και τελειώνει με την εντολή </HTML>. Η πρώτη πληροφορεί τον Web client πως το αρχείο είναι γραμμένο σε γλώσσα HTML και η τελευταία πως ο HTML κώδικας τελείωσε.

<HEAD>...</HEAD>

Τα περιεχόμενά του είναι πληροφοριακά (περικλείουμε σε αυτό κείμενο που μας δίνει διάφορα στοιχεία για την Web σελίδα). Δεν εμφανίζεται στο κείμενο της σελίδας. Τοποθετείται πάντοτε μέσα στην οδηγία <TITLE>.

Π.χ. <HEAD><TITLE>Το πρώτο μου κείμενο σε HTML</TITLE></HEAD>

<TITLE>...</TITLE>

Περιέχει τον τίτλο μιας σελίδας. Ο τίτλος αυτός εμφανίζεται στην κορυφή του παραθύρου του browser που χρησιμοποιούμε για να την δούμε. Μέσα στον τίτλο τοποθετείται η <HEAD> και άλλες οδηγίες.

<BODY>...</BODY>

Περιέχει το κυρίως σώμα της σελίδας (κείμενο, εικόνες, οδηγίες μορφοποίησης κτλ.)

Η οδηγία <BODY> δεν είναι υποχρεωτική από τεχνικής πλευράς (μπορούμε να την παραλείψουμε) αλλά την απαιτεί το πρότυπο HTML και έχει πολλές χρήσεις.

<BASE...>

Η οδηγία <BASE...> μας επιτρέπει να ορίσουμε το βασικό URL της σελίδας, που θα χρησιμοποιηθεί σαν βάση σε περίπτωση που μια web σελίδα διαβάζεται από άλλο χώρο (local file ή mirror site) και θέλουμε να εξακολουθούν να λειτουργούν οι σχετικές παραπομπές (relative links). Όπου δεν ορίζεται η παράμετρος BASE ο browser χρησιμοποιεί στην θέση του BASE το URL που μόλις ζήτησε.

Η σύνταξη της BASE είναι <BASE HREF="http://www.myhost.com/"> και βρίσκεται μέσα στην οδηγία HEAD.

ΕΠΙΚΕΦΑΛΙΔΕΣ (Headings)

Η οδηγία επικεφαλίδας καθορίζει το μέγεθος των γραμμάτων και ισχύει ανεξάρτητα από την γραμματοσειρά που χρησιμοποιεί ο browser που διαβάζει την σελίδα.

Η μεγαλύτερη σε μέγεθος επικεφαλίδα είναι η <H1>, ακολουθούμενη από τις <H2>...<H6>.

Παραδείγματα

<H1>Αυτή είναι η μεγαλύτερη επικεφαλίδα</H1>

<H2>Αυτή είναι η δεύτερη μεγαλύτερη επικεφαλίδα</H2>

ΠΑΡΑΓΡΑΦΟΙ <P>

Οι παράγραφοι στα HTML κείμενα πρέπει να οριστούν με ειδική οδηγία. Διαφορετικά όλο το κείμενο θα παρουσιαστεί από τον browser σαν μια παράγραφος, ανεξάρτητα από τον τρόπο που αυτό έχει μορφοποιηθεί σε έναν ASCII editor (παράγραφοι κενές γραμμές και πολλά διαστήματα θα χαθούν).

Η εντολή για να ξεκινήσει μια καινούρια παράγραφος είναι <P>. Αντίθετα απ' ότι θα περίμενε κανείς, η οδηγία αυτή δεν κλείνει με ένα </P> που να σημαίνει πως τελειώνει παράγραφος (αν και πολλοί συνιστούν να την γράφουμε στο τέλος κάθε παραγράφου για λόγους ομοιομορφίας και τάξεως). Το τέλος μιας παραγράφου σηματοδοτείται με την οδηγία <P> με την οποία αρχίζει η επόμενη παράγραφος (αν αρχίζει νέα παράγραφος αυτό ερμηνεύεται κατά τον browser σαν ένδειξη ότι τελειώνει η παλιά και έτσι το κείμενο μορφοποιείται ανάλογα).

ΑΡΙΘΜΗΜΕΝΕΣ ΛΙΣΤΕΣ

Αν θέλουμε να δημιουργήσουμε μια αριθμημένη λίστα του τύπου

 

1. Άνδρος
2. Μύκονος
3. Τήνος
4. Σίφνος

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

<OL>...</OL>

Η οδηγία <OL> (Ordered List) τοποθετείται στην αρχή της λίστας ενώ η οδηγία
</OL> στο τέλος της.

<LI>

Κάθε νέα εγγραφή στην λίστα πρέπει να σημειώνεται με την οδηγία <LI> (οδηγία </LI> δεν χρησιμοποιούμε για τον ίδιο λόγο που δεν χρησιμοποιούμε την </P>)

Έτσι η παραπάνω αριθμημένη λίστα θα πρέπει να γραφτεί ως εξής:

<OL><LI>Άνδρος<LI>Μύκονος<LI>Τήνος<LI>Σίφνος</OL>

ΛΙΣΤΕΣ ΧΩΡΙΣ ΑΡΙΘΜΗΣΗ <UL>...</UL> Unordered Lists

Για να δημιουργήσουμε μια λίστα με κουκίδες όπως η παρακάτω θα ακολουθήσουμε την ίδια ακριβώς μεθοδολογία όπως και με τις αριθμημένες με την διαφορά πως αντί για την οδηγία <OL> θα χρησιμοποιήσουμε την <UL>.

  • Άνδρος
  • Μύκονος
  • Τήνος
  • Σίφνος

 

Έτσι η παραπάνω μη αριθμημένη λίστα θα πρέπει να γραφτεί ως εξής:

<UL><LI>Άνδρος<LI>Μύκονος<LI>Τήνος<LI>Σίφνος</UL>

Τα ενδεικτικά σημάδια κάθε μέρους μιας μη αριθμημένης λίστας μπορούν να οριστούν με ειδικές παραμέτρους και να πάρουν τις εξής μορφές: Μαύρα δισκάκια (UL TYPE=DISC που είναι το default), Κυκλάκια (UL TYPE=CIRCLE), Τετραγωνάκια (UL TYPE=SQUARE).

ΛΙΣΤΕΣ ΜΕΣΑ ΣΕ ΑΛΛΕΣ ΛΙΣΤΕΣ

Δεν υπάρχει κανένα πρόβλημα αν θέλετε να συμπεριλάβετε μια λίστα μέσα σε μια άλλη. Για παράδειγμα, η παρακάτω διάταξη:

· ΣΠΟΡΑΔΕΣ
· ΚΥΚΛΑΔΕΣ
· Άνδρος
· Μύκονος
· Τήνος
· Σίφνος
· ΔΩΔΕΚΑΝΗΣΑ
· ΙΟΝΙΑ ΝΗΣΙΑ

θα πρέπει να έχει καταχωρηθεί με τον ακόλουθο τρόπο:

<UL><LI>ΣΠΟΡΑΔΕΣ<LI>ΚΥΚΛΑΔΕΣ<UL><LI>Άνδρος<LI>Μύκονος<LI>Τήνος<LI>Σίφνος</UL><LI>ΔΩΔΕΚΑΝΗΣΑ<LI>ΙΟΝΙΑ ΝΗΣΙΑ</UL>

 

<A...>...</A> ΠΑΡΑΠΟΜΠΕΣ (Anchor Element)

Η πιο γνωστή και χρήσιμη οδηγία. Επιτρέπει να συνδέσουμε δύο κείμενα οπουδήποτε στο Internet με τέτοιο τρόπο ώστε το ένα να παραπέμπει στο άλλο.

Το πρώτο τμήμα της παραπομπής <A...> μπορεί να πάρει τις επιλογές HREF & NAME.

HREF

Προέρχεται από τις λέξεις Hypertext REFerence και η σύνταξή της είναι <A HREF="URL">υπογραμμισμένο μπλε (η default επιλογή) κείμενο</A> όπου URL είναι η διεύθυνση κάποιας Web σελίδας (π.χ. http://www.eexi.gr/interbiz), ή κάποιο άλλο αρχείο στο ίδιο ή σε άλλο directory. Σαν παραπομπή μπορούμε να χρησιμοποιήσουμε κάθε είδους URL (βλέπε παραπάνω) και όχι μόνο το http πρωτόκολλο.

Υπάρχει φυσικά η δυνατότητα να παραπέμψουμε σε άλλη web σελίδα στο ίδιο site (σχετική παραπομπή - relative link).

Αν η σελίδα είναι στο ίδιο directory τότε θα γράψουμε απλώς το όνομα του αρχείου στο οποίο βρίσκεται. Για παράδειγμα αν παραπέμπει στο αρχείο test2.htm τότε η παραπομπή θα είναι <A HREF="test2.htm">υπογραμμισμένο μπλε κείμενο</A>

Αν η σελίδα είναι σε διαφορετικό directory (π.χ. στο subdirectory answers που βρίσκεται μέσα στο directory του αρχείου που είναι ενεργό), τότε η οδηγία είναι <a href="./answers/όνομα αρχείου.html">. Προσοχή πρέπει να δοθεί στην αρχική τελεία. Σε περιβάλλον Windows δεν είναι απαραίτητη αλλά σε unix web server μπορεί να μην δουλέψει η παραπομπή χωρίς αυτήν.

Αν η σελίδα βρίσκεται σε ένα ανώτερο directory (δηλαδή το τρέχον directory αποτελεί subdirectory της) τότε η οδηγία είναι <a href="../όνομα αρχείου.html"> κείμενο παραπομπής</a> αν πρέπει να ανέβει κατά ένα directory ο browser για να βρει το αρχείο που θέλουμε, ή <a href="../../όνομα αρχείου.html"> κείμενο παραπομπής</a> αν πρέπει να ανέβει κατά δύο directories.

Προσοχή 1 Είπαμε πως οι οδηγίες της γλώσσας HTML είναι case insensitive (δεν έχει σημασία αν είναι γραμμένες με κεφαλαία ή πεζά). Αυτό ΔΕΝ ΙΣΧΥΕΙ για τα  URLs. Το πιο πολλά από αυτά πρέπει να προσπελαστούν μέσα από UNIX όπου η διαφορά πεζών και κεφαλαίων υπάρχει (άλλο το αρχείο TEST.HTM και άλλο το test.htm). Το χειρότερο στην περίπτωση αυτή είναι πως αν γράφετε τις σελίδες σας σε περιβάλλον Windows (που είναι και το πιο πιθανό), τότε αυτές θα δουλεύουν μια χαρά εκεί προσπελασμένα σαν local files (ειδικά τα relative links) αλλά δεν θα δουλεύουν όταν τοποθετηθούν στον Web server. Γι' αυτό πρέπει ΠΑΝΤΟΤΕ να ξαναελέγχετε την εργασία σας όταν τοποθετηθεί στο Internet.

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

Page Properties

Για να ορίσουμε παραπομπή από το Dreamweaver, μαρκάρουμε το κείμενο που θέλουμε και είτε γράφουμε το link (αν είναι εξωτερικό site h διεύθυνση γράφεται πάντοτε με το http:// μπροστά της) ή κάνουμε κλικ στο φακελάκι και επιλέτουμε το αρχείο. Εναλλακτικά μπορούμε με το στόχαστρο που βρίσκεται δίπλα στο φάκελο να κάνουμε drag & drop το όνομα του αρχείου για να δημιουργηθεί η παραπομπή.

NAME

Υπάρχει επίσης η δυνατότητα να παραπέμψουμε την browser σε άλλο τμήμα της ίδιας Web σελίδας. Για να το επιτύχουμε αυτό θα χρησιμοποιήσουμε την παράμετρο NAME που λειτουργεί ως εξής:

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

Συνήθως οι λέξεις αυτές αποτελούν την επικεφαλίδα κάποιας ενότητας μέσα στην τρέχουσα Web σελίδα. Η παραπομπή σε αυτές θα γίνει με τον εξής τρόπο:

Περισσότερες πληροφορίες για τις <a href="#ΧΧΧ">Επιχειρήσεις και το Internet </a>


Τρέχουσα Ενότητα: HTML - Dreamweaver


 

© Eeei.gr 2009