Εισαγωγή στο Dreamweaver

emujabSoftware and s/w Development

Jul 2, 2012 (5 years and 4 months ago)

306 views

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

Πεπιβάλλον ςτγγπαυήρ ςσασικών ή δτναμικών
ςελίδψν

Υποςσηπίζει απκεσέρ σεφνολογίερ όπψρ
JSP,
PHP
,
ASP
,
Coldfusion
κ.α.

Τόςο ο κώδικαρ, όςο και η εμυάνιςη σψν
ςελίδψν μποπούν να επιθεψπηθούν

Στνσονιςμόρ σηρ μηφανήρ τλοποίηςηρ με σον
εξτπηπεσησή δοκιμών ή σψν εξτπηπεσησή
δημοςίετςηρ

Διετκόλτνςη ςτνεπγαςίαρ με άλλοτρ
ππογπαμμασιςσέρ/ςφεδιαςσέρ (
check in/check
out
)

Και πολλά άλλα...

Τα απφικά ςημαίνοτν
eXtensible
Hypertext
Markup Language
(Επεκσάςιμη Γλώςςα
Υπεπκειμενικήρ
Σήμανςηρ)

Σίγοτπα θα έφεσε ακούςει για σην
HTML
(Γλώςςα
Υπεπκειμενικήρ
Σήμανςηρ)

Η
XHTML
είναι μία πιο

καθαπή

έκδοςη σηρ
HTML
με ςσόφο σο διαφψπιςμό σηρ δομήρ μίαρ ςελίδαρ
από σην εμυάνιςη σηρ (πεπιςςόσεπα γι' ατσό ςση
ςτνέφεια...)

Πποέκτχαν από σον σομέα σηρ
ςσοιφειοθέσηςηρ εγγπάυψν (
typesetting
)

Το κείμενο ππορ εκσύπψςη ςφολιαζόσαν
(
annoteted
) με
αναπσήμασα
(
tags
) σα οποία
τποδηλώναν
σα ςημεία ποτ έππεπε να
αλλάξει λ.φ. η γπαμμασοςειπά ή σο φπώμα
ςσο εκστπψμένο κείμενο

Για σην ηλεκσπονική ςσοιφειοθέσηςη
εγγπάυψν δημιοτπγήθηκε η
SGML
(Ππόστπη
Γλώςςα Γενικετμένηρ Σήμανςηρ)

Σσην ππαγμασικόσησα η
SGML
είναι μία
μέσα
-
γλώςςα (
metalanguage
) για ση δημιοτπγία
εξειδικετμένψν γλψςςών ςήμανςηρ για
ςτγκεκπιμένερ ευαπμογέρ

Η
HTML
είναι μία σέσοια γλώςςα για ση δημιοτπγία
τπεπκειμένψν

Σε μία ςψςσή γλώςςα ςήμανςηρ σα
αναπσήμασα
τποδηλώνοτν σο πόλο σοτ ςσοιφείοτ σο οποίο
πεπιγπάυοτν π.φ.

Τίσλορ

,

Επικευαλίδα

κ.ο,κ
.

Για ση ςσοιφειοθέσηςη σοτ εγγπάυοτ
φπηςιμοποιείσαι ξεφψπιςσό υύλλο σεφνοσποπίαρ
(
style sheet
)

Π.φ. Οι σίσλοι εμυανίζονσαι ςε γπαμμασοςειπά
Arial
μεγέθοτρ 14
pt

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

Η
XML
(Επεκσάςιμη Γλώςςα Σήμανςηρ) είναι
μία απλοποιημένη ςε ςφέςη με σην
HTML
μέσα
-
γλώςςα για ση δημιοτπγία γλψςςών
ςήμανςηρ για σην ηλεκσπονική ανσαλλαγή ή
δημοςίετςη πληπουοπιών

Η
XHTML
είναι μία αναθεψπημένη έκδοςη σηρ
HTML
με μόνο δομικά ςσοιφεία και βαςιςμένη
πλέον ςσην
XML

<
HTML
>: πεπικλείει ολόκληπη ση ςελίδα

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

<
BODY
>: πεπικλείει σο οπασό μέπορ σηρ
ςελίδαρ

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

Αρ τποθέςοτμε όσι θέλοτμε να σοποθεσούμε
ςσο κένσπο σηρ ςελίδαρ σόςο σοτρ σίσλοτρ σψν
διαυόπψν σμημάσψν όςο και σιρ λεζάνσερ σψν
εικόνψν καθώρ επίςηρ και σιρ ίδιερ σιρ εικόνερ

Αν μεσά απουαςίςοτμε να ςσοιφίςοτμε απιςσεπά σοτρ
σίσλοτρ;

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

Οι απουάςειρ ποτ αυοπούν σην
σεφνοσποπία σηρ ςελίδαρ ςτγκενσπώνονσαι
ςε ένα απφείο ή ςε ςτγκεκπιμένα ςημεία
σηρ ςελίδαρ

Ξεφψπιςσό απφείο:
external style sheet
?C
Ενςώμασο μ
ένερ
ςση ςελίδα:
internal style sheet

Θτμηθείσε όσι σο κάθε ςσοιφείο έφει κάποια
φαπακσηπιςσικά (
attributes
)

Βάςει σηρ κλάςηρ σοτ ςσοιφείοτ

Μέςψ σοτ φαπακσηπιςσικού
class

Π.φ. Το κείμενο ποτ πεπιέφεσαι ςε κάθε γνώπιςμα
ποτ ανήκει ςσην κλάςη
important
να είναι μπλε

Βάςει σηρ σατσόσησαρ σοτ ςσοιφείοτ

Μέςψ σοτ φαπακσηπιςσικού
ID

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

Διαυοπεσικοί κασαςκεταςσέρ δτνασόν να επμηνεύςοτν
διαυοπεσικά διάυοπα κομμάσια ενόρ πποσύποτ όπψρ σο
CSS

Για λόγοτρ ςτμβασόσησαρ με πποηγούμενερ εκδόςειρ μποπεί
ςτνειδησά να επιλέξοτν σην παπαβίαςη σοτ πποσύποτ

Δτνασό ακόμη να μην έφοτν τλοποιήςει ολόκληπο σο ππόστπο

Σσο δικό μαρ παπάδειγμα μεπικοί
υτλλομεσπησέρ
δε θα
μαρ εμυανίςοτν σον πίνακα ςσο κένσπο σηρ ςελίδαρ

Για αςυάλεια, φπειάζεσαι να καθοπίςοτμε
επιππόςθεσοτρ κανόνερ ποτ να διαςυαλίζοτν σην οπθή
εμυάνιςη σηρ ςελίδαρ μαρ

Καλό θα είναι να ελέγφεσε ση ςελίδα ςαρ με όςο σο
δτνασό πεπιςςόσεποτρ
υτλλομεσπησέρ

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

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

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

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

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

Πψρ ςτγφπονίζοτμε σιρ αλλαγέρ ςσον τπολογιςσή
τλοποίηςηρ με σα πεπιεφόμενα σοτ εξτπηπεσησή;

Πολλέρ υοπέρ φπειάζεσαι να ςτνεπγαςσούμε
με άλλοτρ ππογπαμμασιςσέρ για σην
τλοποίηςη ενόρ μεγάλοτ
ιςσιακού
σόποτ

Τί γίνεσαι όσαν δύο ππογπαμμασιςσέρ επιφειπήςοτν
να σποποποιήςοτν σην ίδια ςελίδα;