Η HTML και το Internet

Κάθε σελίδα που εμφανίζεται στο Internet είναι ένα αρχείο γραμμένο με τη γλώσσα HTML (HyperText Markup Language, Γλώσσα Χαρακτηρισμού Υπερ-Κειμένου), που περιλαμβάνει το κείμενο της σελίδας, τη δομή της και τους συνδέσμους προς άλλα έγγραφα, εικόνες ή άλλα μέσα.
Ο φυλλομετρητής (Web browser) παίρνει τις πληροφορίες από τον Web server, τις μορφοποιεί και τις εμφανίζει κατάλληλα για το σύστημά μας. Διαφορετικά προγράμματα φυλλομετρητή μπορεί να μορφοποιούν και να εμφανίζουν το ίδιο αρχείο με διαφορετικό τρόπο, ανάλογα με τις δυνατότητες του συστήματος στο οποίο τρέχουν και τις επιλογές διαμόρφωσης του προγράμματος του φυλλομετρητή.
Μια Web σελίδα ή ιστοσελίδα (Web page) είναι ένα μεμονωμένο στοιχείο μιας παρουσίασης για το Web και περιέχεται σ’ ένα αρχείο στον δίσκο, το οποίο ανακτάται από έναν Web server και μορφοποιείται μέσω ενός φυλλομετρητή.
Η αρχική σελίδα (home page) είναι η πρώτη ή κορυφαία σελίδα μιας παρουσίασης για το Web, είναι δηλαδή το σημείο εισόδου ή εκκίνησης για τις υπόλοιπες σελίδες της παρουσίασης και η πρώτη σελίδα που θα συναντήσουν οι αναγνώστες της παρουσίασής μας. Η αρχική σελίδα περιέχει συνήθως μια σύνοψη του περιεχομένου της παρουσίασης με τη μορφή ενός πίνακα περιεχομένων ή μιας ομάδας εικονιδίων.

Τι Είναι η HTML

Η HTML είναι το ακρωνύμιο των λέξεων HyperText Markup Language, δηλ. Γλώσσα Χαρακτηρισμού Υπερ-Κειμένου και βασίζεται στη γλώσσα SGML, Standard Generalized Markup Language, που είναι ένα πολύ μεγαλύτερο σύστημα επεξεργασίας εγγράφων.
Η HTML ορίζει ένα σύνολο κοινών στυλ για τις Web σελίδες, όπως τίτλοι (titles), επικεφαλίδες (headings), παράγραφοι (paragraphs), λίστες (lists) και πίνακες (tables). Ορίζει επίσης στυλ χαρακτήρων, όπως η έντονη γραφή (boldface) και οι ενότητες κώδικα.
Κάθε στοιχείο έχει ένα όνομα και περιέχεται μέσα στα σύμβολα <>, που αποκαλούνται tags (ετικέτες). Όταν γράφουμε μια Web σελίδα με την HTML, στην ουσία δίνουμε τίτλους στα διάφορα στοιχεία της σελίδας μ’ αυτά τα tags.
Οι φυλλομετρητές, μαζί με τη δυνατότητά τους να ανακτούν σελίδες από το Web, λειτουργούν επίσης και σαν μορφοποιητές για την HTML. Όταν διαβάζουμε μια σελίδα γραμμένη με την HTML σ’ έναν φυλλομετρητή, ο φυλλομετρητής διαβάζει (διερμηνεύει) τα tags της HTML και μορφοποιεί το κείμενο και τις εικόνες στην οθόνη.
Διαφορετικοί φυλλομετρητές, οι οποίοι τρέχουν σε διαφορετικούς υπολογιστές, μπορεί να αντιστοιχίζουν διαφορετικά στυλ σε κάθε στοιχείο μιας σελίδας. Αυτό σημαίνει ότι οι σελίδες που δημιουργούμε με την HTML μπορεί να δείχνουν εντελώς διαφορετικές από σύστημα σε σύστημα και από φυλλομετρητή σε φυλλομετρητή. Δηλαδή, οι πραγματικές πληροφορίες και οι σύνδεσμοι που περιέχουν οι σελίδες μας θα είναι πάντα εκεί, αλλά η εμφάνιση των σελίδων στην οθόνη θα είναι διαφορετική.

Η Δομή μιας HTML Σελίδας

Οι σελίδες που γράφουμε με την HTML είναι απλά αρχεία κειμένου σε μορφή ASCII, που σημαίνει ότι δεν περιέχουν πληροφορίες για κάποιο λειτουργικό σύστημα ή πρόγραμμα, αλλά μπορούν να διαβαστούν από οποιονδήποτε συντάκτη υποστηρίζει απλό κείμενο.
Τα αρχεία της HTML περιέχουν τα ακόλουθα :
•    Το κείμενο της σελίδας.
•    Τα tags της HTML, τα οποία υποδεικνύουν τα στοιχεία, τη δομή και τη μορφοποίηση των σελίδων, καθώς επίσης και τους συνδέσμους υπερ-κειμένου προς άλλες σελίδες ή προς αρχεία άλλων μορφών (πολυμέσα).

Τα περισσότερα tags της HTML έχουν την εξής μορφή :

<ΌνομαTag> επηρεαζόμενο κείμενο </ΌνομαTag>

Τα tags της HTML έχουν γενικά ένα tag αρχής και ένα tag τέλους ή ένα tag ανοίγματος και ένα tag κλεισίματος, τα οποία περικλείουν το κείμενο που επηρεάζουν. Το tag αρχής ενεργοποιεί μια λειτουργία ή ένα χαρακτηριστικό, όπως είναι για παράδειγμα η έντονη γραφή, ενώ το tag τέλους την απενεργοποιεί. Τα tags τέλους έχουν το ίδιο όνομα με τα tags αρχής, αλλά με πρόθεμα τον χαρακτήρα /.
Δεν αποτελούν ζευγάρι όλα τα tags της HTML, καθώς ορισμένα είναι “μονομελή”, ενώ άλλα περιέχουν επιπλέον πληροφορίες και κείμενο μέσα στα σύμβολα <>. Ακόμη, όλα τα tags της HTML δεν κάνουν διάκριση μεταξύ κεφαλαίων και πεζών γραμμάτων, δηλ. μπορούμε να τα γράφουμε είτε με κεφαλαίους είτε με πεζούς χαρακτήρες είτε με οποιονδήποτε συνδυασμό τους. Συνήθως τα γράφουμε κεφαλαία για να μπορούμε να τα ξεχωρίζουμε ευκολότερα από το κείμενο της σελίδας.
Τα αρχεία της HTML πρέπει να τα γράφουμε σε συντάκτες κειμένων, δηλ. προγράμματα που μπορούν να αποθηκεύσουν αρχεία κειμένου σε μορφή ASCII. Τέτοια προγράμματα είναι τα Notepad, Wordpad και Write των Windows, το Edit του DOS και τα vi, emacs και pico του UNIX.
Το όνομα του αρχείου θα πρέπει να έχει επέκταση .html ή .htm σε συστήματα DOS ή Windows που επιτρέπουν επεκτάσεις μόνο τριών χαρακτήρων.
Η HTML χρησιμοποιεί τρία tags για την περιγραφή της συνολικής δομής μιας σελίδας, τα οποία παρέχουν ορισμένες απλές πληροφορίες κεφαλίδας. Αυτά τα tags προσδιορίζουν τη σελίδα μας στους φυλλομετρητές και παρέχουν επίσης απλές πληροφορίες για τη σελίδα, όπως τον τίτλο ή τον συγγραφέα της, πριν από τη φόρτωση ολόκληρης της σελίδας.

Το Tag <HTML>

Το πρώτο tag που ελέγχει τη δομή μιας σελίδας που είναι γραμμένη σε κώδικα HTML είναι το <HTML>, που υποδεικνύει ότι το περιεχόμενο του αρχείου περιέχει κώδικα γραμμένο στη γλώσσα HTML. Όλο το κείμενο και οι εντολές μέσα σε μια HTML σελίδα θα πρέπει να τοποθετούνται ανάμεσα στα tags αρχής και τέλους <HTML>, ως εξής :

<HTML>
... κείμενο σελίδας ...
</HTML>

Το Tag <HEAD>

Το tag <HEAD> προσδιορίζει ότι οι γραμμές που περιέχονται ανάμεσα στην αρχή και στο τέλος του είναι ο πρόλογος για το υπόλοιπο του αρχείου. Στην ενότητα αυτή δεν τοποθετούμε ποτέ κείμενο, αλλά συνήθως μόνο τον τίτλο της σελίδας.

<HTML>
<HEAD>
<TITLE> Εδώ είναι ο τίτλος </TITLE>
</HEAD>
...
</HTML>

Το Tag <BODY>

Το υπόλοιπο της HTML σελίδας, δηλ. όλο το κείμενο και οποιοδήποτε άλλο περιεχόμενο, όπως σύνδεσμοι, εικόνες κ.ά., περικλείεται μέσα σ’ ένα tag <BODY>. Η δομή της σελίδας δείχνει τώρα ως εξής :

<HTML>
<HEAD>
<TITLE> Εδώ είναι ο τίτλος </TITLE>
</HEAD>
<BODY>
... κυρίως κείμενο ...
</BODY>
</HTML>

Όλα τα tags της HTML σχηματίζουν ξεχωριστές, ένθετες ενότητες κειμένου και θα πρέπει να είμαστε πολύ προσεκτικοί ώστε να μην υπάρχει επικάλυψη μεταξύ των tags. Αυτό σημαίνει ότι πρέπει να κλείνουμε κάθε tag που ανοίγουμε, εκτός κι αν είναι μονομερές, και ακόμη όταν κλείνουμε ένα tag, κλείνουμε το πιο πρόσφατο tag που ανοίξαμε.

Το Tag <TITLE>

Κάθε HTML σελίδα χρειάζεται έναν τίτλο, ο οποίος θα υποδεικνύει το περιεχόμενό της και αυτό γίνεται με το tag <TITLE>. Ο τίτλος περιγράφει το περιεχόμενο και τον σκοπό μιας σελίδας και εμφανίζεται στη γραμμή τίτλου των δημοφιλέστερων φυλλομετρητών.
Τα tags <TITLE> τοποθετούνται πάντα μέσα στο ζευγάρι των tags <HEAD>, ως εξής :

<HTML>
<HEAD>
<TITLE> Παρουσίαση της Φλώρινας </TITLE>
</HEAD>
<BODY>
... κυρίως κείμενο ...
</BODY>
</HTML>

Τα Tags Επικεφαλίδων

Οι επικεφαλίδες (headings) χρησιμοποιούνται για τον διαχωρισμό των ενοτήτων κειμένου, ακριβώς όπως και σ’ ένα βιβλίο. Η HTML ορίζει 6 επίπεδα επικεφαλίδων, που τα tags τους έχουν την εξής μορφή :

<H1> Η Ιστορία της Φλώρινας </H1>

Οι αριθμοί υποδεικνύουν το επίπεδο επικεφαλίδας (Η1 έως Η6). Οι επικεφαλίδες δεν αριθμούνται όταν εμφανίζονται στην οθόνη, αλλά έχουν ένα χαρακτηριστικό που τις ξεχωρίζει από το κανονικό κείμενο, όπως μεγαλύτερο μέγεθος ή εντονότερο κείμενο ή υπογράμμιση. Καθώς πηγαίνουμε από το Η1 στο Η6, ελαττώνεται το μέγεθος του κειμένου της επικεφαλίδας στην οθόνη.
Οι επικεφαλίδες είναι σαν τα στοιχεία μιας διάρθρωσης και ένα καλό παράδειγμα χρήσης επικεφαλίδων σε μια σελίδα HTML είναι το παρακάτω :

<Η1> Η Πόλη της Φλώρινας </Η1>
<Η2> Γενικά για τη Φλώρινα </Η2>
<Η2> Η Ιστορία της Φλώρινας </Η2>
<Η3> Η Φλώρινα στην Προϊστορική Περίοδο </Η3>
<Η3> Η Φλώρινα από την Αρχαιότητα ως την Απελευθέρωση</Η3>
<Η4> Η Νεώτερη Ιστορία της Φλώρινας </Η4>
<Η5> Ο Μακεδονικός Αγώνας </Η5>
<Η6> Ο Καπετάν Κώττας </Η6>

Τα Tags Παραγράφων

Τα tags παραγράφων είναι τα <Ρ> και </Ρ> και η αλλαγή παραγράφου σημαίνει το ξεκίνημα μιας νέας γραμμής και μια επιπλέον κατακόρυφη απόσταση από παράγραφο σε παράγραφο. Το tag </Ρ> είναι προαιρετικό.

<Ρ> Πολιτιστικοί Σύλλογοι της Πόλης της Φλώρινας </Ρ>