HTML

Η Hyper Text Markup Language (HTML) είναι μια γλώσσα σήμανσης για τη δημιουργία μιας ιστοσελίδας. Οι ιστοσελίδες προβάλλονται συνήθως σε ένα πρόγραμμα περιήγησης στο διαδίκτυο. Μπορούν να περιλαμβάνουν γραφή, συνδέσμους, εικόνες, ακόμη και ήχο και βίντεο. Η HTML χρησιμοποιείται για τη σήμανση και την περιγραφή καθενός από αυτά τα είδη περιεχομένου, ώστε το πρόγραμμα περιήγησης ιστού να μπορεί να τα εμφανίσει σωστά. Η HTML μπορεί επίσης να χρησιμοποιηθεί για την προσθήκη μετα-πληροφοριών σε μια ιστοσελίδα. Οι μεταπληροφορίες συνήθως δεν εμφανίζονται από τους φυλλομετρητές ιστού και είναι δεδομένα σχετικά με την ιστοσελίδα, π.χ. το όνομα του ατόμου που δημιούργησε τη σελίδα. Τα Cascading Style Sheets (CSS) χρησιμοποιούνται για τη διαμόρφωση των στοιχείων HTML, ενώ η JavaScript χρησιμοποιείται για τον χειρισμό των στοιχείων HTML και των στυλ CSS.

Η HTML δημιουργήθηκε από την κοινοπραξία World Wide Web Consortium (W3C). Υπάρχουν διάφορες εκδόσεις της HTML. Από τον Σεπτέμβριο του 2018, το τρέχον πρότυπο της HTML ονομάζεται HTML 5 και συγκεκριμένα βρίσκεται στην έκδοση 5.2.

Ετικέτες

Η HTML χρησιμοποιεί ειδικά κομμάτια της γλώσσας προγραμματισμού που ονομάζονται "ετικέτες" για να ενημερώσει το πρόγραμμα περιήγησης για το πώς πρέπει να φαίνεται μια ιστοσελίδα. Οι ετικέτες είναι συνήθως σε ζεύγη: μια ετικέτα ανοίγματος ορίζει την αρχή ενός μπλοκ περιεχομένου και μια ετικέτα κλεισίματος ορίζει το τέλος αυτού του μπλοκ περιεχομένου. Υπάρχουν πολλά διαφορετικά είδη ετικετών και κάθε μία έχει διαφορετικό σκοπό. Για παραδείγματα ετικετών ανατρέξτε στην ενότητα Βασικές ετικέτες HTML παρακάτω.

Ορισμένες ετικέτες λειτουργούν μόνο σε ορισμένα προγράμματα περιήγησης. Για παράδειγμα, η ετικέτα <menuitem>, η οποία χρησιμοποιείται για να κάνει κάτι να εμφανίζεται όταν το άτομο πατάει το δεξί κουμπί του ποντικιού, λειτουργεί μόνο στο πρόγραμμα περιήγησης Mozilla Firefox. Οι άλλοι φυλλομετρητές απλώς αγνοούν αυτή την ετικέτα και εμφανίζουν το γραπτό κανονικά. Πολλοί δημιουργοί ιστοσελίδων αποφεύγουν να χρησιμοποιούν αυτές τις "μη τυποποιημένες" ετικέτες επειδή θέλουν οι σελίδες τους να φαίνονται το ίδιο σε όλους τους φυλλομετρητές.

Παράδειγμα

Ακολουθεί ένα παράδειγμα σελίδας σε HTML.

1 <!DOCTYPE html> 2 < html> 3 < head> 4 < title> Αυτός είναι ο τίτλος της σελίδας. </title> 5 </head> 6 < body> 7 < p> Αυτή είναι μια παράγραφος. </p> 8 < a href="https://www.domain.com"> Αυτός είναι ένας σύνδεσμος. </a> 9 < img src="image.jpg" alt="Image"> 10 </body> 11 </html>

Μια απλή σελίδα HTML θα ήταν η εξής: μια απλή παράγραφος με το "Hello world! " γραμμένο πάνω της.

1 <!DOCTYPE html> 2 < html> 3 < head> 4 < title> Γεια σου! </title> 5 </head> 6 < body> 7 < p> Γεια σου κόσμε! </p> 8 </body> 9 </html>

Βασικές ετικέτες HTML

Όνομα ετικέτας	Όνομα	Λειτουργία	Παράδειγμα κώδικα
`<!DOCTYPE>`	Doctype	Ορίζει τον τύπο εγγράφου	<!DOCTYPE html>
`<html>`	HTML	Ορίζει ένα έγγραφο HTML και ξεκινά ένα έγγραφο HTML.	< html> Όλος ο κώδικας</html>
`<head>`	Επικεφαλής	Περιέχει οποιονδήποτε κώδικα που δεν χρησιμοποιείται για την εμφάνιση στοιχείων στην ιστοσελίδα	< head></head>
`<title>`	Τίτλος	Καθορίζει τον τίτλο της ιστοσελίδας (εμφανίζεται στην καρτέλα) και εισάγεται μέσα στο `<head>`	< title> Ιστοσελίδα</title>
`<body>`	Σώμα	Περιέχει τα ορατά στοιχεία της ιστοσελίδας (και περιέχει την παράγραφο και άλλα)	< body> Html tags</body>
`<h1>` έως `<h6>`	Τίτλοι	Επικεφαλίδες διαφόρων μεγεθών `(η <h1>` είναι η μεγαλύτερη`)`	<h1> Επικεφαλίδα</h1>
<p>	Παράγραφος	Ορίζει μια παράγραφο κειμένου	< p> ΚΕΙΜΕΝΟ</p>
	Άγκυρα	Δημιουργεί ενεργούς συνδέσμους προς άλλες ιστοσελίδες	< a href="www.domain.com"> Επισκεφθείτε τον ιστότοπό μας</a>
`<img>`	Εικόνα	Εμφανίζει μια εικόνα στη σελίδα	< img src="ImageUrl" alt="Κείμενο που εμφανίζεται εάν η εικόνα δεν είναι διαθέσιμη">
`<br>`	Διάλειμμα	Εισάγει ένα απλό διάλειμμα γραμμής	Κείμενο < br> Κείμενο
`<center>`	Κέντρο	Μετακινεί το περιεχόμενο στο κέντρο της σελίδας	< center> Κώδικας</center>
`<script>`	Σενάριο	Δημιουργεί ένα σενάριο στην ιστοσελίδα, συνήθως γραμμένο σε JavaScript	< script> document. write("Hello World!")</script>

Χρήση ετικετών HTML

Κάνοντας μια ιστοσελίδα

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

Πρώτον, πρέπει να βρείτε ένα μέρος για να πληκτρολογήσετε τις ετικέτες HTML (προτείνω το σημειωματάριο) και να πληκτρολογήσετε τις ετικέτες.

Ακολουθεί ένα άλλο παράδειγμα μιας σελίδας με ετικέτες HTML.

<html>

<head>

<h1> Γεια σου κόσμε!</h1>

</head>

<body>

<p>

Αυτή είναι μια σελίδα με ετικέτες HTML.

</p>

Με: *Προσθέστε το όνομα εδώ*

</footer>

</html>

Μόλις τελειώσετε, αποθηκεύστε το σε αυτή τη μορφή: helloworld.htm

(μην βάζετε κενά)

Και τελειώσατε! Μόλις το αποθηκεύσετε στον υπολογιστή σας, αν το πατήσετε, θα σας στείλει στην ιστοσελίδα σας στο google!

Ερωτήσεις και απαντήσεις

Ερ: Τι είναι η HTML;

A: Η HTML είναι ένας τύπος γλώσσας σήμανσης που χρησιμοποιείται για τη δημιουργία ιστοσελίδων που περιέχουν γραφή, συνδέσμους, εικόνες και οπτικοακουστικά μέσα.

Ε: Ποια είναι η λειτουργία της HTML;

A: Η λειτουργία της HTML είναι να λέει στους φυλλομετρητές ιστού πώς πρέπει να μοιάζουν οι ιστοσελίδες και να προσθέτει μεταπληροφορίες, όπως το όνομα του δημιουργού της ιστοσελίδας.

Ερ: Ποια είναι μερικά παραδείγματα μέσων που μπορούν να συμπεριληφθούν σε ιστοσελίδες που δημιουργούνται με τη χρήση της HTML;

Α: Μερικά παραδείγματα μέσων που μπορούν να συμπεριληφθούν σε ιστοσελίδες που δημιουργούνται με τη χρήση της HTML είναι αρχεία ήχου και βίντεο κλιπ.

Ε: Πώς συμπληρώνει η CSS την HTML;

Α: Η CSS χρησιμοποιείται για την αλλαγή της εμφάνισης των σελίδων HTML.

Ερ: Ποιος είναι ο ρόλος της JavaScript στην ανάπτυξη ιστοσελίδων;

Α: Η JavaScript είναι μια βασική γλώσσα σεναρίων στην ανάπτυξη ιστοσελίδων, καθώς λέει στους ιστότοπους πώς να συμπεριφέρονται και μπορεί να αλλάξει την εμφάνιση της HTML και της CSS.

Ε: Ποιος είναι υπεύθυνος για τη δημιουργία της HTML;

Α: Η HTML δημιουργείται από την Κοινοπραξία του Παγκόσμιου Ιστού (World Wide Web Consortium, W3C).

Ε: Ποια είναι η τρέχουσα τυπική έκδοση της HTML;

Α: Από τον Σεπτέμβριο του 2018, η HTML 5 είναι η πιο πρόσφατη τυποποιημένη έκδοση της HTML στην έκδοση 5.2.