Χπιςσόυοπορ Παναγιώσοτ

Μέγεθος: px

Εμφάνιση ξεκινά από τη σελίδα:

Download "Χπιςσόυοπορ Παναγιώσοτ"

Ζακχαῖος Ζυγομαλάς
6 χρόνια πριν
Προβολές:

1 Χπιςσόυοπορ Παναγιώσοτ

2 Πεπιβάλλον ςτγγπαυήρ ςσασικών ή δτναμικών ςελίδψν Υποςσηπίζει απκεσέρ σεφνολογίερ όπψρ JSP, PHP, ASP, Coldfusion κ.α. Τόςο ο κώδικαρ, όςο και η εμυάνιςη σψν ςελίδψν μποπούν να επιθεψπηθούν Στνσονιςμόρ σηρ μηφανήρ τλοποίηςηρ με σον εξτπηπεσησή δοκιμών ή σψν εξτπηπεσησή δημοςίετςηρ Διετκόλτνςη ςτνεπγαςίαρ με άλλοτρ ππογπαμμασιςσέρ/ςφεδιαςσέρ (check in/check out) Και πολλά άλλα...

3 Τα απφικά ςημαίνοτν extensible Hypertext Markup Language (Επεκσάςιμη Γλώςςα Υπεπκειμενικήρ Σήμανςηρ) Σίγοτπα θα έφεσε ακούςει για σην HTML (Γλώςςα Υπεπκειμενικήρ Σήμανςηρ) Η XHTML είναι μία πιο καθαπή έκδοςη σηρ HTML με ςσόφο σο διαφψπιςμό σηρ δομήρ μίαρ ςελίδαρ από σην εμυάνιςη σηρ (πεπιςςόσεπα γι' ατσό ςση ςτνέφεια...)

4 Πποέκτχαν από σον σομέα σηρ ςσοιφειοθέσηςηρ εγγπάυψν (typesetting) Το κείμενο ππορ εκσύπψςη ςφολιαζόσαν (annoteted) με αναπσήμασα (tags) σα οποία τποδηλώναν σα ςημεία ποτ έππεπε να αλλάξει λ.φ. η γπαμμασοςειπά ή σο φπώμα ςσο εκστπψμένο κείμενο Για σην ηλεκσπονική ςσοιφειοθέσηςη εγγπάυψν δημιοτπγήθηκε η SGML (Ππόστπη Γλώςςα Γενικετμένηρ Σήμανςηρ)

5 Σσην ππαγμασικόσησα η SGML είναι μία μέσαγλώςςα (metalanguage) για ση δημιοτπγία εξειδικετμένψν γλψςςών ςήμανςηρ για ςτγκεκπιμένερ ευαπμογέρ Η HTML είναι μία σέσοια γλώςςα για ση δημιοτπγία τπεπκειμένψν Σε μία ςψςσή γλώςςα ςήμανςηρ σα αναπσήμασα τποδηλώνοτν σο πόλο σοτ ςσοιφείοτ σο οποίο πεπιγπάυοτν π.φ. Τίσλορ, Επικευαλίδα κ.ο,κ. Για ση ςσοιφειοθέσηςη σοτ εγγπάυοτ φπηςιμοποιείσαι ξεφψπιςσό υύλλο σεφνοσποπίαρ (style sheet) Π.φ. Οι σίσλοι εμυανίζονσαι ςε γπαμμασοςειπά Arial μεγέθοτρ 14 pt

6 Δτςστφώρ κασά καιπούρ η HTML επεκσάθηκε από σοτρ κασαςκεταςσέρ υτλλομεσπησών με σπόπο ανεξέλεγκσο και με σην ππόςμιξη αναπσημάσψν ποτ ςφεσίζονσαν με σην εμυάνιςη και όφι με ση δομή σψν ιςσοςελίδψν Η XML (Επεκσάςιμη Γλώςςα Σήμανςηρ) είναι μία απλοποιημένη ςε ςφέςη με σην HTML μέσα-γλώςςα για ση δημιοτπγία γλψςςών ςήμανςηρ για σην ηλεκσπονική ανσαλλαγή ή δημοςίετςη πληπουοπιών Η XHTML είναι μία αναθεψπημένη έκδοςη σηρ HTML με μόνο δομικά ςσοιφεία και βαςιςμένη πλέον ςσην XML

9 <HTML>: πεπικλείει ολόκληπη ση ςελίδα <HEAD>: πεπικλείει οπιςμένερ πληπουοπίερ για ση ςελίδα οι οποίερ δεν εμυανίζονσαι ςσην οθόνη <BODY>: πεπικλείει σο οπασό μέπορ σηρ ςελίδαρ

Το ανάπσημα ατσό τποδηλώνει όφι σο κένσπο σηρ ςελίδαρ - από πλετπά δομήρ - αλλά σον σπόπο με σον οποίο θα εμυανιςσεί σο σμήμα σηρ ςελίδαρ σο οποίο πεπικλείει ςσην οθόνη Αρ τποθέςοτμε όσι θέλοτμε να

19 Το ανάπσημα ατσό τποδηλώνει όφι σο κένσπο σηρ ςελίδαρ - από πλετπά δομήρ - αλλά σον σπόπο με σον οποίο θα εμυανιςσεί σο σμήμα σηρ ςελίδαρ σο οποίο πεπικλείει ςσην οθόνη Αρ τποθέςοτμε όσι θέλοτμε να σοποθεσούμε ςσο κένσπο σηρ ςελίδαρ σόςο σοτρ σίσλοτρ σψν διαυόπψν σμημάσψν όςο και σιρ λεζάνσερ σψν εικόνψν καθώρ επίςηρ και σιρ ίδιερ σιρ εικόνερ Αν μεσά απουαςίςοτμε να ςσοιφίςοτμε απιςσεπά σοτρ σίσλοτρ; Αν θέλοτμε οι λεζάνσερ επιπλέον να εμυανίζονσαι με διαυοπεσική γπαμμασοςειπά;

20 Οι απουάςειρ ποτ αυοπούν σην σεφνοσποπία σηρ ςελίδαρ ςτγκενσπώνονσαι ςε ένα απφείο ή ςε ςτγκεκπιμένα ςημεία σηρ ςελίδαρ Ξεφψπιςσό απφείο: external style sheet Ενςώμασο μ ένερ ςση ςελίδα: internal style sheet

21 Θτμηθείσε όσι σο κάθε ςσοιφείο έφει κάποια φαπακσηπιςσικά (attributes) Βάςει σηρ κλάςηρ σοτ ςσοιφείοτ Μέςψ σοτ φαπακσηπιςσικού class Π.φ. Το κείμενο ποτ πεπιέφεσαι ςε κάθε γνώπιςμα ποτ ανήκει ςσην κλάςη important να είναι μπλε Βάςει σηρ σατσόσησαρ σοτ ςσοιφείοτ Μέςψ σοτ φαπακσηπιςσικού ID

Ωρ ςφεδιαςσέρ ή ππογπαμμασιςσέρ ιςσοςελίδψν θα ππέπει να ςτνηθίςεσε ςσην ιδέα όσι η ςελίδα ςαρ πιθανόν να μην εμυανίζεσαι σο ίδιο ςε όλοτρ σοτρ υτλλομεσπησέρ Διαυοπεσικοί κασαςκεταςσέρ δτνασόν να

31 Ωρ ςφεδιαςσέρ ή ππογπαμμασιςσέρ ιςσοςελίδψν θα ππέπει να ςτνηθίςεσε ςσην ιδέα όσι η ςελίδα ςαρ πιθανόν να μην εμυανίζεσαι σο ίδιο ςε όλοτρ σοτρ υτλλομεσπησέρ Διαυοπεσικοί κασαςκεταςσέρ δτνασόν να επμηνεύςοτν διαυοπεσικά διάυοπα κομμάσια ενόρ πποσύποτ όπψρ σο CSS Για λόγοτρ ςτμβασόσησαρ με πποηγούμενερ εκδόςειρ μποπεί ςτνειδησά να επιλέξοτν σην παπαβίαςη σοτ πποσύποτ Δτνασό ακόμη να μην έφοτν τλοποιήςει ολόκληπο σο ππόστπο Σσο δικό μαρ παπάδειγμα μεπικοί υτλλομεσπησέρ δε θα μαρ εμυανίςοτν σον πίνακα ςσο κένσπο σηρ ςελίδαρ Για αςυάλεια, φπειάζεσαι να καθοπίςοτμε επιππόςθεσοτρ κανόνερ ποτ να διαςυαλίζοτν σην οπθή εμυάνιςη σηρ ςελίδαρ μαρ Καλό θα είναι να ελέγφεσε ση ςελίδα ςαρ με όςο σο δτνασό πεπιςςόσεποτρ υτλλομεσπησέρ

35 Τα ςφεδιόστπα μαρ επισπέποτν να δημιοτπγήςοτμε ιςσιακούρ σόποτρ με πολλέρ ςελίδερ οι οποίερ να έφοτν μεγάλη ςτνέπεια και ομοιομοπυία μεσαξύ σοτρ Επιπλέον, ψρ ςφεδιαςσέρ και ππογπαμμασιςσέρ μποπούμε να δώςοτμε ση δτνασόσησα ςε κάποιον ποτ δεν έφει απαπαίσησα κάποια πείπα με σην ΗΤΜΙ να δημιοτπγήςει μία επαγγελμασική ςελίδα Το ςφεδιόστπο είναι μία κανονική ςελίδα σηρ οποίαρ κάποια μέπη μποπεί να σποποποιηθούν, ενώ άλλα παπαμένοτν πποςσασετμένα Απουεύγονσαι έσςι οι αθέμισερ αλλαγέρ ςε βαςικά ςημεία σηρ ςελίδαρ

44 Καλό είναι να τλοποιούμε και να δοκιμάζοτμε αλλαγέρ ςε μία ιςσοςελίδα ςε διαυοπεσικό τπολογιςσή από ατσόν ποτ παίζει σο πόλο σοτ εξτπηπεσησή μέςψ σοτ οποίοτ δημοςιεύεσαι η ςελίδα Πψρ ςτγφπονίζοτμε σιρ αλλαγέρ ςσον τπολογιςσή τλοποίηςηρ με σα πεπιεφόμενα σοτ εξτπηπεσησή; Πολλέρ υοπέρ φπειάζεσαι να ςτνεπγαςσούμε με άλλοτρ ππογπαμμασιςσέρ για σην τλοποίηςη ενόρ μεγάλοτ ιςσιακού σόποτ Τί γίνεσαι όσαν δύο ππογπαμμασιςσέρ επιφειπήςοτν να σποποποιήςοτν σην ίδια ςελίδα;

Σχετικά έγγραφα

Ψηυιακά δεδομένα (data) :είναι δεδομένα ποτ έφοτν αναπαπαςσαθεί με κάποιο σπόπο (κψδικοποίηςη), είναι αποθηκετμένα ςε τπολογιςσή και είναι δτνασόν να

Ψηυιακά δεδομένα (data) :είναι δεδομένα ποτ έφοτν αναπαπαςσαθεί με κάποιο σπόπο (κψδικοποίηςη), είναι αποθηκετμένα ςε τπολογιςσή και είναι δτνασόν να επεξεπγαςσούν. Τα χηυιακά δεδομένα αποθηκεύονσαι ςε