Μαθήματα προγραμματισμού και σχεδιασμού ιστοσελίδων – HTML αρχεία, επικεφαλίδες, παράγραφοι, σύνδεσμοι, εικόνες.

website-647013_1920

Θα ξεκινήσουμε μία σειρά μαθημάτων προγραμματισμού και σχεδιασμού ιστοσελίδων για ηλικίες από 6 μέχρι 106 ετών. Ο προγραμματισμός είναι για όλους, όχι μόνο για αυτούς που τελειώσαν μία σχολή πληροφορικής. Τα παιδιά μας πρέπει να ξεκινήσουν να μαθαίνουν γλώσσες προγραμματισμού από το δημοτικό. Κατά την έναρξη του σχολικού έτους το 2014 τα κρατικά σχολεία της Αγγλίας άρχισαν να διδάσκουν στους μαθητές τους αλγορίθμους. Αποφάσισαν ότι το πρόγραμμα σπουδών του κρατικού σχολείου πρέπει να εμπλουτισθεί με την εκμάθηση προγραμματισμού. Πιστεύουν ότι τα παιδιά δεν πρέπει μόνο να καταναλώνουν την τεχνολογία, αλλά να τη δημιουργούν. Να σταματήσουν να χάνουν το χρόνο τους στα κοινωνικά δίκτυα αλλά να δημιουργούν τα δικά τους προγράμματα. Τα πρώτα μαθήματα μας  είναι στις γλώσσες HTML, CSS και Javascript που είναι απαραίτητες για την δημιουργία ιστοσελίδων.

Τί είναι η HTML;
Η HTML είναι μια γλώσσα σήμανσης(markup) για την περιγραφή των ιστοσελίδων.
HTML σημαίνει Hyper Text Markup Language.
Μια γλώσσα σήμανσης είναι ένα σύνολο από ετικέτες σήμανσης.
Τα έγγραφα HTML περιγράφονται με ετικέτες HTML.
Κάθε ετικέτα HTML περιγράφει διαφορετικό περιεχόμενο του εγγράφου.

HTML Αρχεία
Τα HTML αρχεία ξεκινάνε με <html> και τελειώνουν με </html>.
Τα ορατά μέρη του HTML κειμένου βρίσκονται μεταξύ του <body> και </body>.

Δοκιμάστε!

 

HTML Επικεφαλίδες
Οι επικεφαλίδες HTML ορίζονται με τις ετικέτες < h1 > έως < h6 >.

Δοκιμάστε!

 

HTML παράγραφοι
Οι παράγραφοι HTML ορίζονται με την ετικέτα < p >.

Δοκιμάστε!

 

HTML Σύνδεσμοι
Οι παράγραφοι HTML ορίζονται με την ετικέτα < a >.

Δοκιμάστε!

 

HTML Εικόνες
Οι παράγραφοι HTML ορίζονται με την ετικέτα < img>.
Το αρχείο προέλευσης ( src ) , το εναλλακτικό κείμενο ( ALT ) και το μέγεθος ( πλάτος και ύψος) είναι τα χαρακτηριστικά τους.

Δοκιμάστε!

 

Καλή επιτυχία!!
Σε επόμενη ανάρτηση θα συνεχίσουμε με άλλα χαρακτηριστικά της HTML.

 

HTML επικεφαλίδα, τίτλος, meta, αλλαγή γραμμής, pre, style.

binary-1071776_1280

HTML επικεφαλίδα
Η επικεφαλίδα ορίζεται με τις ετικέτα <head> και περιέχει μεταδεδομένα τα οποία δεν εμφανίζονται. Τοποθετείται μεταξύ <html> και <body> ετικέτας.

HTML τίτλος
Οι τίτλοι ορίζονται με την ετικέτα <title>.

HTML meta
Το χαρακτηριστικό meta μπορεί να χρησιμοποιηθεί για να καθορίσει το σύνολο χαρακτήρων, καθώς και άλλες πληροφορίες σχετικά με το έγγραφο HTML.

Δοκιμάστε!


HTML αλλαγή γραμμής

Η ετικέτα br καθορίζει την αλλαγή γραμμής σε ένα κείμενο.

HTML στοιχείο pre
Το κείμενο μέσα σε ένα pre στοιχείο διατηρεί τα κενά και τις αλλαγές γραμμών.

Δοκιμάστε!

 

HTML style
Η ρύθμιση του στυλ ενός στοιχείου HTML, μπορεί να γίνει με το στοιχείο style (style=property:value).

HTML background-color
Το στοιχείο background-color καθορίζει το χρώμα του φόντου για ένα στοιχείο HTML.

HTML color
Το στοιχείο color καθορίζει το χρώμα για ένα στοιχείο HTML.

HTML font-family
Το στοιχείο font-family καθορίζει το γραμματοσειρά για ένα στοιχείο HTML.

HTML font-size
Το στοιχείο font-size καθορίζει το μέγεθος της γραμματοσειράς για ένα στοιχείο HTML.

HTML text-align
Το στοιχείο text-align καθορίζει την οριζόντια στοίχιση για ένα στοιχείο HTML.

Δοκιμάστε!

 

Καλή επιτυχία!

 

HTML Bold, Strong, Italic, Emphasized, small, mark, del, ins, sub, sup.

office-820390_1920

HTML Bold και Strong μορφοποίηση
Οι ετικέτες <b> </b> και <strong> </strong> χρησιμοποιούνται για έντονα γράμματα.

HTML Italic και Emphasized μορφοποίηση
Οι ετικέτες <i> </i> και <em> </em> χρησιμοποιούνται για πλάγια γράμματα.

HTML small μορφοποίηση
Η ετικέτα <small> </small>  χρησιμοποιείται για μικρά γράμματα.

HTML Marked μορφοποίηση
Η ετικέτα <mark> </mark>  χρησιμοποιείται για επισημασμένα γράμματα.

HTML Deleted μορφοποίηση
Η ετικέτα <del> </del>  χρησιμοποιείται για διαγραμμένα γράμματα.

HTML Inserted μορφοποίηση
Η ετικέτα <ins> </ins>  χρησιμοποιείται για υπογραμμισμένα γράμματα.

HTML Subscript μορφοποίηση
Η ετικέτα <sub> </sub>  χρησιμοποιείται για γράμματα με τη μορφή δείκτη.

HTML Superscript μορφοποίηση
Η ετικέτα <sup> </sup>  χρησιμοποιείται για γράμματα με τη μορφή εκθέτη.

 

Δοκιμάστε!

 

Καλή επιτυχία!

 

HTML Στυλ – CSS, γραμματοσειρές, Box Μοντέλο, id, class.

internet-594148_1280

HTML Στυλ – CSS

CSS σημαίνει Cascading Style Sheets.
Μπορείτε να προσθέσετε CSS με τους παρακάτω τρόπους:

1. Inline – χρησιμοποιώντας ένα χαρακτηριστικό στυλ στα στοιχεία HTML

Δοκιμάστε!

 

2. Εσωτερική – χρησιμοποιώντας ένα style στοιχείο στην ενότητα head

Δοκιμάστε!

 

3. Εξωτερικές – χρησιμοποιώντας ένα ή περισσότερα εξωτερικά αρχεία CSS.
Ένα εξωτερικό αρχείο CSS μπορεί να γραφεί σε οποιοδήποτε πρόγραμμα επεξεργασίας κειμένου .
Το αρχείο δεν πρέπει να περιέχει καθόλου html tags.
Το αρχείο αρχείο CSS πρέπει να αποθηκεύονται με την επέκταση .css

Δοκιμάστε!

 

CSS – γραμματοσειρές
Το color ορίζει το χρώμα του κειμένου.
Το font-family καθορίζει τη γραμματοσειρά.
To font-size καθορίζει το μέγεθος του κειμένου.

Δοκιμάστε!

 

CSS – Box Μοντέλο
Κάθε στοιχείο HTML έχει ένα αόρατο κουτί γύρω του.
Το border καθορίζει το περίγραμμα.
Το padding ορίζει το κενό στο εσωτερικό του περιγράμματος.
Το margin ορίζει το κενό στο εξωτερικό του περιγράμματος.

Δοκιμάστε!

 

CSS – id 
Για να ορίσετε ένα ιδιαίτερο στυλ για ένα συγκεκριμένο στοιχείο HTML, πρέπει να προσθέσετε το id του.

CSS – class
Για να ορίσετε ένα στυλ για μία κατηγορία στοιχείων HTML, προσθέστε την class του.

Δοκιμάστε!

 

Καλή επιτυχία.

HTML code, σχόλια, συντομογραφίες, διεύθυνση.

wordpress-552922_1280

HTML για κώδικα προγραμματισμού
Η ετικέτα code χρησιμοποιείται για κώδικα προγραμματισμού. Tip: βάλετε το code μέσα σε ένα pre για να παραμείνουν τα κενά και οι νέες γραμμές.

Δοκιμάστε!

 

HTML σχόλια
Γράψτε <!– ΤΑ ΣΧΟΛΙΑ ΣΑΣ —> για να προσθέσετε σχόλια.

Δοκιμάστε!

 

HTML συντομογραφίες
Η ετικέτα abbr χρησιμοποιείται για συντομογραφίες. Με τις συντομογραφίες δίνετε πληροφορίες στους browsers, στα συστήματα μετάφρασης και τις μηχανές αναζήτησης.

Δοκιμάστε!

 

HTML διεύθυνση
Η ετικέτα address χρησιμοποιείται για να προσδιορίσει τα στοιχεία επικοινωνίας.

Δοκιμάστε!

 

Καλή επιτυχία.

HTML χρώματα, σύνδεσμοι, εικόνες.

flower-302889_1280

HTML Χρώματα

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

1. Με τη χρήση των ονομάτων τους(π.χ. Red, Orange, Yellow, Cyan, Blue).

2. Με τη χρήση του τύπου: RGB (red, green, blue ). Κάθε παράμετρος (red, green, blue ) ορίζει την ένταση του χρώματος μεταξύ 0 και 255 .
Για παράδειγμα ,  rgb ( 255,0,0 ) εμφανίζεται ως κόκκινο , γιατί το κόκκινο έχει την υψηλότερη τιμή ( 255) ενώ το πράσινο και το μπλε είναι 0.

3. Με τη χρήση δεκαεξαδικών τιμών χρώματος σε μορφή : #RRGGBB , όπου RR (κόκκινο ) , GG ( πράσινο) και ΒΒ ( μπλε) είναι οι δεκαεξαδικές τιμές μεταξύ 00 και FF.
Για παράδειγμα , #FF0000 εμφανίζεται ως κόκκινο , γιατί το κόκκινο είναι στην υψηλότερη τιμή του ( FF) ενώ το πράσινο και το μπλε είναι 0.

Δοκιμάστε!

 

HTML Σύνδεσμοι

Ένας σύνδεσμος είναι ένα κείμενο ή μια εικόνα που μπορείτε να κάνετε κλικ για να πάτε σε ένα άλλο έγγραφο.
Οι σύνδεσμοι ορίζονται με την ετικέτα <a>.

Δοκιμάστε!


HTML Εικόνες

Στην HTML , οι εικόνες δηλώνονται  με την < img> .

Δοκιμάστε!

Καλή επιτυχία.

HTML Πίνακες, Λίστες.

head-197345_1280

HTML Πίνακες

Στην HTML , οι πίνακες ορίζονται με  το < table>.
Οι  γραμμές του πίνακα δηλώνονται με το < tr >.
Κάθε γραμμή του πίνακα χωρίζεται σε δεδομένα με την < td >.

Δοκιμάστε!

 

HTML Λίστες

Στην HTML υπάρχουν τρεις κατηγορίες λιστών.

1. Μη αριθμημένες:
<ul>
<li>Καφές</li>
<li>Τσάι</li>
<li>Γάλα</li>
</ul>

2. Αριθμημένες:
<ol type=“1”>
<li>Καφές</li>
<li>Τσάι</li>
<li>Γάλα</li>
</ol>

3. Περιγραφικές:
<dl>
<dt>Καφές</dt>
<dd>– μαύρο ζεστό ρόφημα</dd>
<dt>Γάλα</dt>
<dd>– λευκό κρύο ρόφημα</dd>
</dl>

Δοκιμάστε!

 

Καλή επιτυχία

 

HTML Block, Inline, Classes.

brick-258938_1280

HTML Block

Ένα Block ξεκινά πάντα σε μια νέα γραμμή και καταλαμβάνει όλο το διαθέσιμο πλάτος. Παραδείγματα από block είναι τα div, h1-h6, p, form.

HTML Inline

Ένα inline δεν ξεκινά σε μια νέα γραμμή και καταλαμβάνει όσο πλάτος είναι απαραίτητο. Παραδείγματα από inline είναι τα span, a, img.

Δοκιμάστε!


HTML Classes

Με το class μπορούμε να δηλώσουμε το ίδιο στυλ για ίδια div .

Δοκιμάστε!

 

HTML Iframes, Encoding

horse-1147790_1280

HTML Iframes(εσωτερικό παράθυρο)

Ένα Iframe χρησιμοποιείται για να εμφανίσει μια ιστοσελίδα μέσα σε μια άλλη ιστοσελίδα.

Δοκιμάστε!


HTML Encoding

Για να εμφανισθεί σωστά μια ιστοσελίδα, ο web browser πρέπει να γνωρίζει την κωδικοποίηση των χαρακτήρων, αυτό καθορίζεται στο meta.
Τι είναι Κωδικοποίηση Χαρακτήρων;
Το ASCII ήταν το πρώτο πρότυπο στη κωδικοποίηση χαρακτήρων, δηλώνει 127 διαφορετικούς αλφαριθμητικούς χαρακτήρες.  Το ANSI (Windows-1252) ήταν το πρότυπο στη κωδικοποίηση χαρακτήρων για τα Windows(256 χαρακτήρες). Το ISO-8859-1 ήταν το πρότυπο στη κωδικοποίηση χαρακτήρων HTML 4(256 χαρακτήρες). Επειδή ANSI και ISO είναι περιορισμένα, το πρότυπο στη κωδικοποίηση χαρακτήρων άλλαξε στο UTF-8 στην HTML5. Το UTF-8 (Unicode) καλύπτει σχεδόν όλους τους χαρακτήρες και σύμβολα παγκόσμια.

Δοκιμάστε!

 

HTML Layouts

web-845803_1280

HTML Layouts(Διατάξεις)

Οι Δικτυακοί τόποι εμφανίζουν συχνά το περιεχόμενο τους σε πολλαπλές στήλες ( όπως ένα περιοδικό ή εφημερίδα ).
Η HTML5 προσφέρει σημασιολογικά στοιχεία που καθορίζουν τα διαφορετικά μέρη μιας ιστοσελίδας.

< Header >  Καθορίζει μια κεφαλίδα για ένα έγγραφο ή ένα τμήμα
< Nav > Καθορίζει το μενού πλοήγησης
< Section > Καθορίζει ένα τμήμα σε ένα έγγραφο
< Article > Καθορίζει ένα ανεξάρτητο αυτοτελές άρθρο
< Αside> Καθορίζει το περιεχόμενο δίπλα σε ένα άλλο περιεχόμενο ( όπως ένα sidebar )
< Footer > Καθορίζει ένα υποσέλιδο για ένα έγγραφο ή ένα τμήμα
< Details> – Καθορίζει επιπλέον λεπτομέρειες
< Summary> – Καθορίζει μια επικεφαλίδα για το < Details>

Δοκιμάστε!

 

HTML Responsive Web Design.

responsive-1166833_1280

HTML Responsive Web Design

Η ιστοσελίδα σας θα πρέπει να δείχνει καλά και να είναι εύκολη στη χρήση, ανεξάρτητα από τη συσκευή που τη βλέπετε. Το Responsive Web Design κάνει τις ιστοσελίδες σας να φαίνονται καλά σε όλες τις συσκευές ( επιτραπέζιους υπολογιστές , ταμπλέτες και κινητά τηλέφωνα ). Το Responsive Web Design γίνεται με τη χρήση CSS και HTML για να αλλάξετε το μέγεθος , να κρύψετε , να μικρύνετε , να μεγεθύνετε  , ή να μετακινήσετε το περιεχόμενο για να φανεί όμορφο σε οποιαδήποτε οθόνη. Η πιο δημοφιλής πλατφόρμα για την εύκολη δημιουργία Responsive Web Design είναι το Bootstrap, στο οποίο θα αναφερθούμε αναλυτικά σε επόμενα μαθήματα.

Δοκιμάστε!

 

HTML Forms

HTML Forms

Οι HTML forms χρησιμοποιούνται για τη συλλογή δεδομένων από το χρήστη. Οι HTML forms περιέχουν διαφορετικούς τύπους εισαγωγής δεδομένων όπως πλαίσια ελέγχου(checkboxes), κουμπιά επιλογής(radio buttons) , κουμπιά υποβολής(submit), και άλλα.

 

Δοκιμάστε!

 

HTML5

HTML5

Η HTML5 προσθέτει νέα στοιχεία στην HTML4. Τα πιο ενδιαφέροντα στοιχεία της HTML5 είναι: το header, το footer, το Article και το section. Για έλεγχο φόρμας είναι ο αριθμός , η ημερομηνία , η ώρα , το ημερολόγιο , και το εύρος . Νέα γραφικά στοιχεία είναι το svg και το canvas και νέα στοιχεία πολυμέσων είναι το audio και το video.

 

Δοκιμάστε!

 

HTML5 καμβάς

HTML5 Canvas είναι μια ορθογώνια περιοχή χωρίς περιθώρια και περιεχόμενο, πού μέσα σε αυτή μπορούμε να σχεδιάσουμε με εντολές javascript.

 

Δοκιμάστε!

 

HTML5 SVG

Το HTML5 SVG στοιχείο είναι μια περιοχή για SVG γραφικά . Το SVG έχει αρκετές μεθόδους για να σχεδιάσουμε κουτιά , κύκλους , κείμενο και εικόνες. Η κύρια διαφορά μεταξύ SVG και Canvas είναι ότι η SVG είναι μια γλώσσα σε XML για 2D γραφικά ενώ ο Canvas σχεδιάζει 2D γραφικά on the fly με εντολές JavaScript.

 

Δοκιμάστε!

 

HTML5 Ήχος, Βίντεο

HTML5 Ήχος

Πριν την HTML5, δεν υπήρξε πρότυπο για την αναπαραγωγή αρχείων ήχου σε μια ιστοσελίδα. Τα αρχεία ήχου εκτελούνταν μόνο με τη χρήση plug-in (όπως το flash).Το HTML5 audio στοιχείο καθορίζει ένα πρότυπο για να ενσωματώσετε ήχο σε μια ιστοσελίδα .

 

Δοκιμάστε!

 

HTML5 Βίντεο

Πριν την HTML5, δεν υπήρξε πρότυπο για την αναπαραγωγή αρχείων βίντεο σε μια ιστοσελίδα. Τα αρχεία ήχου εκτελούνταν μόνο με τη χρήση plug-in (όπως το flash).Το HTML5 video στοιχείο καθορίζει ένα πρότυπο για να ενσωματώσετε βίντεο σε μια ιστοσελίδα .

 

Δοκιμάστε!

 

HTML YouTube βίντεο

HTML YouTube βίντεο

Διαφορετικές εκδόσεις από διαφορετικούς browsers υποστηρίζουν διαφορετικές μορφές βίντεο, πρέπει να μετατρέψετε τα βίντεο σας σε διάφορες μορφές βίντεο για να παίξουν σε όλους τους browsers. Η μετατροπή βίντεο σε διαφορετική μορφή μπορεί να είναι δύσκολη και χρονοβόρα. Μια εύκολη λύση θα ήταν να αφήσετε το YouTube να παίξει τα βίντεο στην ιστοσελίδα σας. Το YouTube αναφέρει το id του βίντεο (σαν QtXby3twMmI), με αυτό το id μπορείτε να τοποθετήσετε το βίντεο στην ιστοσελίδα σας.

 

Δοκιμάστε!

 

Φιλοξενία ιστοσελίδων και ονόματα(domains).

 

it-838384_1280

Αν θέλουμε να φτιάξουμε την ιστοσελίδα μας πρέπει καταρχάς να αποφασίσουμε που θα τη αποθηκεύσουμε. Δεν μπορούμε να τη αποθηκεύσουμε στον υπολογιστή του σπιτιού μας γιατί δεν θα είναι προσβάσιμη όταν κλείσει ο υπολογιστής μας και μπορεί να εξυπηρετήσει μόνο μικρό αριθμό επισκεπτών. Θα χρειαστούμε μία εταιρεία που θα μας παρέχει τον απαραίτητο χώρο για να την αποθηκεύσουμε. Ακόμη θα χρειαστούμε και ένα όνομα για να μας βρίσκουν, μπορούμε να χρησιμοποιήσουμε την ίδια εταιρεία η κάποια άλλη για να καταχωρίσουμε το όνομα μας(domain).

 

Τι είναι το World Wide Web?
Το Web είναι ένα δίκτυο υπολογιστών σε όλο τον κόσμο. Όλοι οι υπολογιστές μπορούν να επικοινωνούν μεταξύ τους και χρησιμοποιούν ένα πρωτόκολλο επικοινωνίας που ονομάζεται HTTP.

 

Πως λειτουργεί το WWW?
Οι Web πληροφορίες είναι έγγραφα που ονομάζονται ιστοσελίδες και είναι αποθηκευμένες σε υπολογιστές που ονομάζονται διακομιστές. Οι υπολογιστές που βλέπουν τις ιστοσελίδες ονομάζονται πελάτες και βλέπουν τις ιστοσελίδες με τους web browsers. Δημοφιλείς web browsers είναι ο Google Chrome, Firefox και Internet Explorer.

 

Πως ένας web browser ζητάει μία ιστοσελίδα;
Ένας web browser ζητάει μια σελίδα από ένα web server(διακομιστή) με μια τυποποιημένη αίτηση HTTP που περιέχει μια διεύθυνση σε αυτή τη μορφή: http://plinet.net/index.html

 

Πως ένας web browser εμφανίζει μία ιστοσελίδα;
Όλες οι ιστοσελίδες περιέχουν οδηγίες, ο web browser εμφανίζει την ιστοσελίδα διαβάζοντας αυτές τις οδηγίες. Οι πιο κοινές οδηγίες είναι οι ετικέτες HTML(δείτε τα μαθήματα HTML).

 

Τι είναι ένας Web Server?
Για να δημοσιεύσουμε την ιστοσελίδα σας, θα πρέπει να την αντιγράψουμε σε έναν web server και να καταχωρίσουμε το όνομα της ιστοσελίδας μας(domain).

 

Ας δούμε πως μπορούμε να αποθηκεύσουμε την ιστοσελίδα μας και να έχουμε το δικό μας όνομα στο ΠΣΔ(δωρεάν για εκπαιδευτικούς και σχολικές μονάδες). Θα χρειαστούμε δύο προγράμματα, ένα απλό κειμενογράφο για την επεξεργασία του κώδικα της ιστοσελίδας μας, σας προτείνω το Notepad++, και ένα πρόγραμμα για την μεταφορά της ιστοσελίδας μας από τον υπολογιστή μας στο web server, σας προτείνω το filezilla.

 

1. Αν δεν έχετε, ανοίξτε λογαριασμό στο ΠΣΔ.
%ce%ba%ce%b1%cf%84%ce%b1%ce%b3%cf%81%ce%b1%cf%86%ce%ae1

 

2. Δημιουργείστε ένα φάκελο στον υπολογιστή σας(myweb). Ανοίξτε το Notepad++ και γράψτε στην πρώτη γραμμή <!DOCTYPE html> (δηλώνουμε την HTML), επιλέξτε και αντιγράψτε τον κώδικα της ιστοσελίδας που έχουμε αποθηκεύσει στο codepen.io και επικολλήσετε τον κώδικα κάτω από τη γραμμή που γράψατε. Αποθηκεύστε το αρχείο στο φάκελο με το όνομα index.html(όνομα αρχικής ιστοσελίδας).

capture5

3. Συνδεθείτε στο λογαριασμό σας στο ΠΣΔ, και επιλέξτε MySch > Πίνακας Ελέγχου > Στοιχεία δικτυακού τόπου. Μπορείτε να δείτε την Διεύθυνση δικτυακού τόπου(http://users.sch.gr/το όνομα σας) και το FTP url(users.sch.gr/το όνομα σας).

capture1

4. Ανοίξτε τον filezilla επιλέξτε τον Διαχειριστή τοποθεσιών για να δηλώσετε τον web server του ΠΣΔ. Πατήστε ‘Νέα τοποθεσία’, δηλώστε τα στοιχεία όπως φαίνονται στην παρακάτω εικόνα και πατήστε ‘Σύνδεση’.

capture6

5. Στο αριστερό παράθυρο βρίσκονται τα αρχεία του υπολογιστή σας και στο δεξί τα αρχεία του web server. Βρείτε το φάκελο σας στο αριστερό παράθυρο επιλέξτε το αρχείο index.html και κάντε διπλό κλικ για να σταλεί στον web server. Συγχαρητήρια, μόλις ανεβάσατε την πρώτη ιστοσελίδα σας, μπορείτε να τη δείτε στην διεύθυνση ‘http://users.sch.gr/το όνομα σας’.

capture3