Το Πρόγραμμα Dreamweaver
Quick Start Guide
Δραστηριότητα 10 (τετρ.μαθητ.5,σελ15):
Να αντιστοιχίσετε τα Tags
Dreamweaver
Τι Είναι το DreamWeaver
 Το πρόγραμμα DreamWeaver της εταιρείας Adobe είναι ένα κορυφαίο
πρόγραμμα δημιουργίας και επεξεργασίας ιστοσελίδων, δηλαδή κώδικα
HTML, που είναι ιδιαίτερα εύκολο και φιλικό στη χρήση του.
 Το όνομα DreamWeaver προέρχεται από ένα παλιό ρομαντικό τραγούδι.
 Το DreamWeaver είναι εξαίρετο για να μπορούμε να δημιουργήσουμε στα
γρήγορα φόρμες (forms), πλαίσια (frames), πίνακες (tables) και άλλα
αντικείμενα της HTML.
 Είναι, όμως, ιδιαίτερα καλό όταν θέλουμε να δώσουμε σε μια ιστοσελίδα τη
δυνατότητα να κάνει κάτι. Πρέπει να έχουμε υπόψη μας ότι το DreamWeaver
μπορεί να χρησιμοποιηθεί και για τη δημιουργία εφαρμογών πολυμέσων.
Dreamweaver Jumpstart
Τι Είναι το DreamWeaver
 Το DreamWeaver έχει δυνατότητες για δημιουργία δυναμικής HTML (DHMTL)
και επιτρέπει κίνησης γραμμής χρόνου, απόλυτη τοποθέτηση
περιεχομένων,δημιουργία επιπέδων (layers) και συγγραφή σεναρίων (scripts).
 Το DreamWeaver περιέχει δικές του συμπεριφορές (behaviors), που είναι
έτοιμα scripts τα οποία μπορούμε να προσθέσουμε πολύ εύκολα σ’ ένα
αντικείμενο.
 Το DreamWeaver μάς παρέχει την ελευθερία να σχεδιάσουμε οπτικά την
εμφάνιση μιας ιστοσελίδας και τη δύναμη να την κάνουμε να λειτουργεί όπως
ακριβώς θέλουμε.
 Μπορούμε να δημιουργήσουμε τη δική μας προσωπική ιστοσελίδα (personal
web page) ή μια ολόκληρη περιοχή (web site) σ’ ένα εταιρικό δίκτυο
(intranet).
Dreamweaver
 Design and Layout
 Διαχείρηση Site και File Transfer
Protocol (FTP)
 Περιβάλλον Code & Text Editor
 Υποστήριξη για Σχεδιασμό
 Mobile συσκευών (Window >
Multiscreen Preview )
 Page and code object Insert
panels
Dreamweaver
 Customizable
workspace layouts:
 Powerful visual aids
 Live View and Live
Code
 CSS Inspection and
the Enable/Disable
Feature
 Related files
Dreamweaver
 Code Navigator
 Photoshop smart
objects
 HTML5, CSS3, and
PHP code hinting
Dreamweaver
 File > Open. dw01lessons
 Επιλέγουμε BasicHTML.html and press Open
Dreamweaver
Placing 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 για την εισαγωγή
εικόνας.
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
Dreamweaver
 Element hierarchy
 <strong><p>Big bold paragraph</p></strong>
ΛΑΘΟΣ ιεραρχία
 <p><strong>Big bold paragraph</strong></p>
ΣΩΣΤΗ ιεραρχία
Dreamweaver
 Element hierarchy
 <strong><p>Big bold paragraph</p></strong>
ΛΑΘΟΣ ιεραρχία
 <p><strong>Big bold paragraph</strong></p>
ΣΩΣΤΗ ιεραρχία
 Creating new documents
Dreamweaver
Setting Up a New Site
 Site > New Site, Site name : Organic Utopia
 Advanced site-creation options
Dreamweaver
Adding pages
 File > New
Dreamweaver
Defining page properties File > New

More Related Content

PPT
12 Multimedia Design Iii
PPT
11 Multimedia Design Ii
PPTX
Εισαγωγή στο powerpoint 2007
PDF
Παρουσιάσεις PowerPoint
PDF
02 Basic Elements Of Design
PDF
03 Basis Princeples Of Design
PDF
05 Typography Anatomy And Characteristics
PDF
04 Typography Introhistory
12 Multimedia Design Iii
11 Multimedia Design Ii
Εισαγωγή στο powerpoint 2007
Παρουσιάσεις PowerPoint
02 Basic Elements Of Design
03 Basis Princeples Of Design
05 Typography Anatomy And Characteristics
04 Typography Introhistory

Viewers also liked (14)

PDF
01 Introduction Into Design Language
PDF
06 Page Layout
PDF
09 Prepress Preparation Files In Dtp
PDF
08 Unicode, Image Formats
PPTX
07 wordpress google analytics
PDF
07 Multimedia Design Multi Lect1&2
PPTX
05 - 06 Html blog wordpress demo
PDF
10 Multimedia Design Basic Principles
PPTX
04 texnologies ektypwsewn
PPTX
03 texnologies ektypwsewn
PPTX
06 texnologies ektypwsewn
PPTX
02-Istoria typografias
PPTX
03 - 04 sxediasmos istoselidas
PPTX
05 texnologies ektypwsewn
01 Introduction Into Design Language
06 Page Layout
09 Prepress Preparation Files In Dtp
08 Unicode, Image Formats
07 wordpress google analytics
07 Multimedia Design Multi Lect1&2
05 - 06 Html blog wordpress demo
10 Multimedia Design Basic Principles
04 texnologies ektypwsewn
03 texnologies ektypwsewn
06 texnologies ektypwsewn
02-Istoria typografias
03 - 04 sxediasmos istoselidas
05 texnologies ektypwsewn
Ad

Similar to Dw lessons 01 lesson (20)

PDF
Sample dreamweaver
PDF
DREAMWEAVER eLEARNING
PPTX
Βασικές έννοιες διαδικτύου και σχεδίασης ιστοσελίδων
PPT
Eisagogi
PPTX
Προσφορά - Παρουσίαση κατασκευής και προώθησης e-shop
PPTX
βασικες εννοιες διαδικτυου και σχεδιασης ιστοσελιδων
PPT
στατικες δυναμικες νες
PPT
Wordpress on-site seo
PDF
Εργαλεία ανάπτυξης εφαρμογών Internet - 01 εισαγωγή στον παγκόσμιο ιστό
PPT
WordPress and Business Models
PPTX
Μοντέλο Client/Server, Διαδικτυακές υπηρεσίες και Cloud computing
PPT
DOC
Η ΘΕΜΑΤΙΚΗ ΚΑΙ ΣΧΕΔΙΑΣΤΙΚΗ ΕΞΕΛΙΞΗ ΤΟΥ WEB DESIGN ΑΠΟ ΤΙΣ ΠΡΩΤΕΣ ΗΜΕΡΕΣ ΤΟΥ...
PDF
Παρουσίαση - ΔΙΕΡΕΥΝΗΣΗ OPEN SOURCE CMS
PPTX
Search engine optimization
PPTX
επαγγέλματα διαδικτύου
DOCX
PPT
παρουσίαση πτυχιακής εργασίας νίκος κοφοτόλιος θεολόγης δελη
PPT
Προώθηση ιστοσελίδων και αναζήτηση από κινητά
PPTX
Πλεονεκτήματα δημιουργίας- ιστοσελίδας
Sample dreamweaver
DREAMWEAVER eLEARNING
Βασικές έννοιες διαδικτύου και σχεδίασης ιστοσελίδων
Eisagogi
Προσφορά - Παρουσίαση κατασκευής και προώθησης e-shop
βασικες εννοιες διαδικτυου και σχεδιασης ιστοσελιδων
στατικες δυναμικες νες
Wordpress on-site seo
Εργαλεία ανάπτυξης εφαρμογών Internet - 01 εισαγωγή στον παγκόσμιο ιστό
WordPress and Business Models
Μοντέλο Client/Server, Διαδικτυακές υπηρεσίες και Cloud computing
Η ΘΕΜΑΤΙΚΗ ΚΑΙ ΣΧΕΔΙΑΣΤΙΚΗ ΕΞΕΛΙΞΗ ΤΟΥ WEB DESIGN ΑΠΟ ΤΙΣ ΠΡΩΤΕΣ ΗΜΕΡΕΣ ΤΟΥ...
Παρουσίαση - ΔΙΕΡΕΥΝΗΣΗ OPEN SOURCE CMS
Search engine optimization
επαγγέλματα διαδικτύου
παρουσίαση πτυχιακής εργασίας νίκος κοφοτόλιος θεολόγης δελη
Προώθηση ιστοσελίδων και αναζήτηση από κινητά
Πλεονεκτήματα δημιουργίας- ιστοσελίδας
Ad

More from eretrianews (20)

PDF
Eswterikos kanonismos leitourgias gel amarynthou
PDF
Ektelesi ergasiwn afasis ergou
PDF
Anakoinwsi peri apolymansis
PDF
Sxedio antimetopisis ektaktis anagkis covid-19 signed
PDF
Anakoinwsi politikis prostasias 5 11-2020-2
DOCX
Ektakta kairikasep2020
PDF
Kleista sxoleiaanakoinwsi sep2020
PDF
Diakopi sxolikwnmonadwn sep2020
PDF
Κορονοιός Δήμος Ερέτριας
DOCX
Καρναβάλι Αμαρύνθου 2019
PDF
Diakopi mathimatwn logo eks 10 01_2019
PDF
Diakopi mathimatwn logo ektaktwn kairikwn synthikwn 09_01_2019
PDF
Diakopi mathimatwn logo ektaktwn kairikwn synthikwn 08_01_2019
PDF
Deltio typou enhmerwsi sxoleiwn
PDF
Dimiourgia tessarwn prosbasimwn thalasswn sto dimo eretrias
PDF
Filodimos I
PDF
Programma prosklisi 28 oktwmbriou 2018
PDF
ΔΗΜΟΣ ΕΡΕΤΡΙΑΣ - ΑΠΟΛΟΓΙΣΜΟΣ ΠΕΠΡΑΓΜΕΝΩΝ
PDF
Α.Δ.Σ. 35/2018: Συζήτηση αιτήματος φορέων Δ.Κ. Αμαρυνθίων περί επανακαθορισμο...
PDF
Prosklisi sti drash prosbasi gia olous
Eswterikos kanonismos leitourgias gel amarynthou
Ektelesi ergasiwn afasis ergou
Anakoinwsi peri apolymansis
Sxedio antimetopisis ektaktis anagkis covid-19 signed
Anakoinwsi politikis prostasias 5 11-2020-2
Ektakta kairikasep2020
Kleista sxoleiaanakoinwsi sep2020
Diakopi sxolikwnmonadwn sep2020
Κορονοιός Δήμος Ερέτριας
Καρναβάλι Αμαρύνθου 2019
Diakopi mathimatwn logo eks 10 01_2019
Diakopi mathimatwn logo ektaktwn kairikwn synthikwn 09_01_2019
Diakopi mathimatwn logo ektaktwn kairikwn synthikwn 08_01_2019
Deltio typou enhmerwsi sxoleiwn
Dimiourgia tessarwn prosbasimwn thalasswn sto dimo eretrias
Filodimos I
Programma prosklisi 28 oktwmbriou 2018
ΔΗΜΟΣ ΕΡΕΤΡΙΑΣ - ΑΠΟΛΟΓΙΣΜΟΣ ΠΕΠΡΑΓΜΕΝΩΝ
Α.Δ.Σ. 35/2018: Συζήτηση αιτήματος φορέων Δ.Κ. Αμαρυνθίων περί επανακαθορισμο...
Prosklisi sti drash prosbasi gia olous

Dw lessons 01 lesson

  • 3. Dreamweaver Τι Είναι το DreamWeaver  Το πρόγραμμα DreamWeaver της εταιρείας Adobe είναι ένα κορυφαίο πρόγραμμα δημιουργίας και επεξεργασίας ιστοσελίδων, δηλαδή κώδικα HTML, που είναι ιδιαίτερα εύκολο και φιλικό στη χρήση του.  Το όνομα DreamWeaver προέρχεται από ένα παλιό ρομαντικό τραγούδι.  Το DreamWeaver είναι εξαίρετο για να μπορούμε να δημιουργήσουμε στα γρήγορα φόρμες (forms), πλαίσια (frames), πίνακες (tables) και άλλα αντικείμενα της HTML.  Είναι, όμως, ιδιαίτερα καλό όταν θέλουμε να δώσουμε σε μια ιστοσελίδα τη δυνατότητα να κάνει κάτι. Πρέπει να έχουμε υπόψη μας ότι το DreamWeaver μπορεί να χρησιμοποιηθεί και για τη δημιουργία εφαρμογών πολυμέσων.
  • 4. Dreamweaver Jumpstart Τι Είναι το DreamWeaver  Το DreamWeaver έχει δυνατότητες για δημιουργία δυναμικής HTML (DHMTL) και επιτρέπει κίνησης γραμμής χρόνου, απόλυτη τοποθέτηση περιεχομένων,δημιουργία επιπέδων (layers) και συγγραφή σεναρίων (scripts).  Το DreamWeaver περιέχει δικές του συμπεριφορές (behaviors), που είναι έτοιμα scripts τα οποία μπορούμε να προσθέσουμε πολύ εύκολα σ’ ένα αντικείμενο.  Το DreamWeaver μάς παρέχει την ελευθερία να σχεδιάσουμε οπτικά την εμφάνιση μιας ιστοσελίδας και τη δύναμη να την κάνουμε να λειτουργεί όπως ακριβώς θέλουμε.  Μπορούμε να δημιουργήσουμε τη δική μας προσωπική ιστοσελίδα (personal web page) ή μια ολόκληρη περιοχή (web site) σ’ ένα εταιρικό δίκτυο (intranet).
  • 5. Dreamweaver  Design and Layout  Διαχείρηση Site και File Transfer Protocol (FTP)  Περιβάλλον Code & Text Editor  Υποστήριξη για Σχεδιασμό  Mobile συσκευών (Window > Multiscreen Preview )  Page and code object Insert panels
  • 6. Dreamweaver  Customizable workspace layouts:  Powerful visual aids  Live View and Live Code  CSS Inspection and the Enable/Disable Feature  Related files
  • 7. Dreamweaver  Code Navigator  Photoshop smart objects  HTML5, CSS3, and PHP code hinting
  • 8. Dreamweaver  File > Open. dw01lessons  Επιλέγουμε BasicHTML.html and press Open
  • 9. Dreamweaver Placing 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 για την εισαγωγή εικόνας.
  • 10. 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
  • 11. Dreamweaver  Element hierarchy  <strong><p>Big bold paragraph</p></strong> ΛΑΘΟΣ ιεραρχία  <p><strong>Big bold paragraph</strong></p> ΣΩΣΤΗ ιεραρχία
  • 12. Dreamweaver  Element hierarchy  <strong><p>Big bold paragraph</p></strong> ΛΑΘΟΣ ιεραρχία  <p><strong>Big bold paragraph</strong></p> ΣΩΣΤΗ ιεραρχία  Creating new documents
  • 13. Dreamweaver Setting Up a New Site  Site > New Site, Site name : Organic Utopia  Advanced site-creation options