Download - Dw lessons 01 lesson

Transcript
Page 1: Dw lessons 01 lesson

Το Πρόγραμμα DreamweaverQuick Start Guide

Page 2: Dw lessons 01 lesson

Δραστηριότητα 10 (τετρ.μαθητ.5,σελ15): Να αντιστοιχίσετε τα Tags

Page 3: Dw lessons 01 lesson

DreamweaverΤι Είναι το DreamWeaver Το πρόγραμμα DreamWeaver της εταιρείας Adobe είναι ένα

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

Το όνομα DreamWeaver προέρχεται από ένα παλιό ρομαντικό τραγούδι.

Το DreamWeaver είναι εξαίρετο για να μπορούμε να δημιουργήσουμε στα γρήγορα φόρμες (forms), πλαίσια (frames), πίνακες (tables) και άλλα αντικείμενα της HTML.

Είναι, όμως, ιδιαίτερα καλό όταν θέλουμε να δώσουμε σε μια ιστοσελίδα τη δυνατότητα να κάνει κάτι. Πρέπει να έχουμε υπόψη μας ότι το DreamWeaver μπορεί να χρησιμοποιηθεί και για τη δημιουργία εφαρμογών πολυμέσων.

Page 4: Dw lessons 01 lesson

Dreamweaver JumpstartΤι Είναι το DreamWeaver Το DreamWeaver έχει δυνατότητες για δημιουργία δυναμικής HTML

(DHMTL) και επιτρέπει κίνησης γραμμής χρόνου, απόλυτη τοποθέτηση περιεχομένων,δημιουργία επιπέδων (layers) και συγγραφή σεναρίων (scripts).

Το DreamWeaver περιέχει δικές του συμπεριφορές (behaviors), που είναι έτοιμα scripts τα οποία μπορούμε να προσθέσουμε πολύ εύκολα σ’ ένα αντικείμενο.

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

Μπορούμε να δημιουργήσουμε τη δική μας προσωπική ιστοσελίδα (personal web page) ή μια ολόκληρη περιοχή (web site) σ’ ένα εταιρικό δίκτυο (intranet).

Page 5: Dw lessons 01 lesson

Dreamweaver Design and Layout Διαχείρηση Site και File

Transfer Protocol (FTP) Περιβάλλον Code & Text

Editor Υποστήριξη για Σχεδιασμό Mobile συσκευών (Window

> Multiscreen Preview ) Page and code object

Insert panels

Page 6: Dw lessons 01 lesson

Dreamweaver Customizable

workspace layouts:

Powerful visual aids

Live View and Live Code

CSS Inspection and the Enable/Disable Feature

Related files

Page 7: Dw lessons 01 lesson

Dreamweaver Code Navigator Photoshop smart

objects HTML5, CSS3,

and PHP code hinting

Page 8: Dw lessons 01 lesson

Dreamweaver File > Open. dw01lessons Επιλέγουμε BasicHTML.html and press

Open

Page 9: Dw lessons 01 lesson

DreamweaverPlacing images in HTML File > Open /

dw01lessons/Images.html πατήστε Open

Split button in the Document toolbar

Common / Insert / Image / gears.jpg από το φάκελο images / dw01lessons

Image Tag Accessibility Attributes βάζουμε «Gears Image» στο Alternate / OK για την εισαγωγή εικόνας.

Page 10: Dw lessons 01 lesson

Dreamweaver Colors in HTML Case sensitivity

and whitespace rules

File > Open/dw01lessons /Whitespace.html πατάμε Open

Split view Shift+Enter simple Enter File/Save File/Close

Page 11: Dw lessons 01 lesson

Dreamweaver Element hierarchy <strong><p>Big bold

paragraph</p></strong> ΛΑΘΟΣ ιεραρχία <p><strong>Big bold

paragraph</strong></p> ΣΩΣΤΗ ιεραρχία

Page 12: Dw lessons 01 lesson

Dreamweaver Element hierarchy <strong><p>Big bold

paragraph</p></strong> ΛΑΘΟΣ ιεραρχία <p><strong>Big bold

paragraph</strong></p> ΣΩΣΤΗ ιεραρχία

Creating new documents

Page 13: Dw lessons 01 lesson

DreamweaverSetting Up a New Site

Site > New Site, Site name : Organic Utopia

Advanced site-creation options

Page 14: Dw lessons 01 lesson

DreamweaverAdding pages File > New

Page 15: Dw lessons 01 lesson

DreamweaverDefining page properties File > New