際際滷

際際滷Share a Scribd company logo
A Quick Tour
about Dreamweaver
  Owned by Adobe
  Current version is Dreamweaver CS6
  HTML editor
  WYSIWYG editor "what you see is what you
     get"
       Content during editing appears very similar
        to the final product (wikipedia definition)


10/17/2012      ITWP1000 Basic Web Programming        2
Dreamweaverthe launch
   When you first launch Dreamweaver you
      see a menu with a lot of choices:
        Create new documents
          Choose from basic HTML, PHP, ASP,
           JavaScript, CSS, etc.
        Top Features (videos)
        Open Recent documents

10/17/2012     ITWP1000 Basic Web Programming   3
in the beginning




10/17/2012   ITWP1000 Basic Web Programming   4
the basic layout
 Standard menu bar
 Insert bar contains objects that help you create a
    web page visually
       Common menu is default
       Browse through different menus with items by clicking
             on the tab
 From the menu & tool bars you can add
    images, anchors, different scripts, comments, etc.
    instantly


10/17/2012                ITWP1000 Basic Web Programming        5
the basic layout
    In CS5.5 the menu is located along the right side
        of the application in panels
       All elements can also be inserted from the top
        menu bar




10/17/2012        ITWP1000 Basic Web Programming         6
the basic layout
   Document tool bar contains options that let you
      view the source code, easily enter a page title
      and preview the current web page




   View the source              View in a             Title your
    code or layout                web                   Page
                                browser




10/17/2012           ITWP1000 Basic Web Programming                7
the basic layout
  Dreamweaver offers you three ways to
   view your web document:
     Code
     Split
     Design
  You can move back and forth between
   different views by clicking on the icons


10/17/2012   ITWP1000 Basic Web Programming   8
the basic layout
  Code view displays only the source code of the
     document
        Code is color coded
        Shows Line numbers




10/17/2012        ITWP1000 Basic Web Programming    9
the basic layout
 Split view displays a split screen with code
    and design views




10/17/2012   ITWP1000 Basic Web Programming      10
the basic layout
 Design view
  does not
  display any
  source code
  only the
  document
  window




10/17/2012      ITWP1000 Basic Web Programming   11
the basic layout
  You can add/view properties in your web
     document through the use of the properties
     inspector at the bottom of each page




10/17/2012      ITWP1000 Basic Web Programming    12
the basic layout
 Panel groups
    Located on the right side
     contain related panels docked
     together
    Can hide panels
     (through menu
     bar by checking
     or un-checking)



 10/17/2012     ITWP1000 Basic Web Programming   13
previewing a web page
 Dreamweaver makes it easy to preview your Web
 page in a browser
    Click the Preview/Debug in
       browser icon
      Select the browser you want
       to use to preview your Web page
        Can add multiple browsers to the list
           Choose Edit Browser List from the submenu
          Browser must be installed on the computer
    Web page opens up in a browser window
 10/17/2012       ITWP1000 Basic Web Programming        14
Dreamweaver and FTP
  Dreamweaver has FTP capabilities
  Can set up different sites by using the Site
     Manager located in the top menu bar
        Site > Manage Sites




10/17/2012        ITWP1000 Basic Web Programming   15
Dreamweaver CS6 Features




http://www.adobe.com/products/dreamweaver/features.html

10/17/2012                          ITWP1000 Basic Web Programming   16
Dreamweaver CS6 Features




http://www.adobe.com/products/dreamweaver/features.html

10/17/2012                          ITWP1000 Basic Web Programming   17
Dreamweaver help
   Dreamweaver Development Center
      http://www.adobe.com/devnet/dreamweaver.html




10/17/2012      ITWP1000 Basic Web Programming       18
Visit Dreamweaver online




10/17/2012   ITWP1000 Basic Web Programming   19
Ad

Recommended

Unit a adobe dreamweaver cs6
Unit a adobe dreamweaver cs6
Krista Lawrence
Unit c adobe dreamweaver cs6
Unit c adobe dreamweaver cs6
Krista Lawrence
Unit b adobe dreamweaver cs6
Unit b adobe dreamweaver cs6
Krista Lawrence
Getting Started with Adobe Dreamweaver CS6
Getting Started with Adobe Dreamweaver CS6
Ahmed Younis - imahmedyounis
Unit e adobe dreamweaver cs6
Unit e adobe dreamweaver cs6
Krista Lawrence
Unit f adobe dreamweaver cs6
Unit f adobe dreamweaver cs6
Krista Lawrence
Unit g adobe dreamweaver cs6
Unit g adobe dreamweaver cs6
Krista Lawrence
Unit j adobe dreamweaver cs6
Unit j adobe dreamweaver cs6
Krista Lawrence
Dreamweaver cs6 step by step
Dreamweaver cs6 step by step
zoran Jelinek
Unit h adobe dreamweaver cs6
Unit h adobe dreamweaver cs6
Krista Lawrence
Unit i adobe dreamweaver cs6
Unit i adobe dreamweaver cs6
Krista Lawrence
Unit d adobe dreamweaver cs6
Unit d adobe dreamweaver cs6
Krista Lawrence
How to Use Dreamweaver cs6
How to Use Dreamweaver cs6
Salman Memon
Dreamweaver - Introduction AND WALKTHROUGH
Dreamweaver - Introduction AND WALKTHROUGH
Sahil Bansal
Getting Started with Dreamweaver
Getting Started with Dreamweaver
Frank Fucile
Basic Web Design In Dreamweaver
Basic Web Design In Dreamweaver
jcharnin
Dreamweaver
Dreamweaver
Suneel Dogra
Using Stylesheets To Design A Web Site In Dreamweaver Mx 2004
Using Stylesheets To Design A Web Site In Dreamweaver Mx 2004
brighteyes
Developing a Web Page
Developing a Web Page
Frank Fucile
Dreamweawer
Dreamweawer
aditi sharma
Dreamweaver & Me PPT
Dreamweaver & Me PPT
electricgeisha
Macromedia Dreamweaver 8
Macromedia Dreamweaver 8
Jeff Wood
Joomla Template Tutorial
Joomla Template Tutorial
brighteyes
Start a Blog: Module 6
Start a Blog: Module 6
Merri Dennis
MS frontpage 2003
MS frontpage 2003
exquisitejhaira
171dreamweaver
171dreamweaver
Sourabh Vashistha
Dreamweaver8
Dreamweaver8
gifari alfan reza
Introduction, features and environment of ms front page 2003
Introduction, features and environment of ms front page 2003
Ann Alcid
DW Unit 1.pdf
DW Unit 1.pdf
SeethaDinesh
Microsoft FrontPage PPT
Microsoft FrontPage PPT
anushreekmurthy

More Related Content

What's hot (20)

Dreamweaver cs6 step by step
Dreamweaver cs6 step by step
zoran Jelinek
Unit h adobe dreamweaver cs6
Unit h adobe dreamweaver cs6
Krista Lawrence
Unit i adobe dreamweaver cs6
Unit i adobe dreamweaver cs6
Krista Lawrence
Unit d adobe dreamweaver cs6
Unit d adobe dreamweaver cs6
Krista Lawrence
How to Use Dreamweaver cs6
How to Use Dreamweaver cs6
Salman Memon
Dreamweaver - Introduction AND WALKTHROUGH
Dreamweaver - Introduction AND WALKTHROUGH
Sahil Bansal
Getting Started with Dreamweaver
Getting Started with Dreamweaver
Frank Fucile
Basic Web Design In Dreamweaver
Basic Web Design In Dreamweaver
jcharnin
Dreamweaver
Dreamweaver
Suneel Dogra
Using Stylesheets To Design A Web Site In Dreamweaver Mx 2004
Using Stylesheets To Design A Web Site In Dreamweaver Mx 2004
brighteyes
Developing a Web Page
Developing a Web Page
Frank Fucile
Dreamweawer
Dreamweawer
aditi sharma
Dreamweaver & Me PPT
Dreamweaver & Me PPT
electricgeisha
Macromedia Dreamweaver 8
Macromedia Dreamweaver 8
Jeff Wood
Joomla Template Tutorial
Joomla Template Tutorial
brighteyes
Start a Blog: Module 6
Start a Blog: Module 6
Merri Dennis
MS frontpage 2003
MS frontpage 2003
exquisitejhaira
171dreamweaver
171dreamweaver
Sourabh Vashistha
Dreamweaver8
Dreamweaver8
gifari alfan reza
Introduction, features and environment of ms front page 2003
Introduction, features and environment of ms front page 2003
Ann Alcid
Dreamweaver cs6 step by step
Dreamweaver cs6 step by step
zoran Jelinek
Unit h adobe dreamweaver cs6
Unit h adobe dreamweaver cs6
Krista Lawrence
Unit i adobe dreamweaver cs6
Unit i adobe dreamweaver cs6
Krista Lawrence
Unit d adobe dreamweaver cs6
Unit d adobe dreamweaver cs6
Krista Lawrence
How to Use Dreamweaver cs6
How to Use Dreamweaver cs6
Salman Memon
Dreamweaver - Introduction AND WALKTHROUGH
Dreamweaver - Introduction AND WALKTHROUGH
Sahil Bansal
Getting Started with Dreamweaver
Getting Started with Dreamweaver
Frank Fucile
Basic Web Design In Dreamweaver
Basic Web Design In Dreamweaver
jcharnin
Using Stylesheets To Design A Web Site In Dreamweaver Mx 2004
Using Stylesheets To Design A Web Site In Dreamweaver Mx 2004
brighteyes
Developing a Web Page
Developing a Web Page
Frank Fucile
Dreamweaver & Me PPT
Dreamweaver & Me PPT
electricgeisha
Macromedia Dreamweaver 8
Macromedia Dreamweaver 8
Jeff Wood
Joomla Template Tutorial
Joomla Template Tutorial
brighteyes
Start a Blog: Module 6
Start a Blog: Module 6
Merri Dennis
Introduction, features and environment of ms front page 2003
Introduction, features and environment of ms front page 2003
Ann Alcid

Similar to Dreamweaver (20)

DW Unit 1.pdf
DW Unit 1.pdf
SeethaDinesh
Microsoft FrontPage PPT
Microsoft FrontPage PPT
anushreekmurthy
Adobe Dreamweaver CS5 Basics
Adobe Dreamweaver CS5 Basics
Douglas Strahler
Wd & im session a3 _introduction to web page editors_april 08,2010
Wd & im session a3 _introduction to web page editors_april 08,2010
Mahesh Panchal
Chapter 01
Chapter 01
Long Beach City College
Intro to SharePoint 2013 Branding
Intro to SharePoint 2013 Branding
Thomas Daly
Introduction to visual basic
Introduction to visual basic
Manav Khandelwal
Web Design Guide
Web Design Guide
Mohamed Elabnody
1_Intro_toHTML.ppt
1_Intro_toHTML.ppt
benjaminonum1
Browser tools that make web development easier
Browser tools that make web development easier
Alan Seiden
cyber security-ethical hacking web servers.pdf
cyber security-ethical hacking web servers.pdf
jayaprasanna10
Webdesigningandpublishingcomputerstudiestheorylesson 101212054612-phpapp02
Webdesigningandpublishingcomputerstudiestheorylesson 101212054612-phpapp02
Harshith Rockx
XPages101 - Building an XPages app - Lotusphere 2011
XPages101 - Building an XPages app - Lotusphere 2011
Tim Clark
Ch 10: Hacking Web Servers
Ch 10: Hacking Web Servers
Sam Bowne
Dreaweaver cs5
Dreaweaver cs5
Miguel Kerlegan
W1.pptx
W1.pptx
MohamedNowfeek1
Dreamweaver Application
Dreamweaver Application
Sarah Hall
Font-End Development Tools
Font-End Development Tools
university of education,Lahore
CNIT 123 Ch 10: Hacking Web Servers
CNIT 123 Ch 10: Hacking Web Servers
Sam Bowne
Wedesign
Wedesign
nannudavis
Microsoft FrontPage PPT
Microsoft FrontPage PPT
anushreekmurthy
Adobe Dreamweaver CS5 Basics
Adobe Dreamweaver CS5 Basics
Douglas Strahler
Wd & im session a3 _introduction to web page editors_april 08,2010
Wd & im session a3 _introduction to web page editors_april 08,2010
Mahesh Panchal
Intro to SharePoint 2013 Branding
Intro to SharePoint 2013 Branding
Thomas Daly
Introduction to visual basic
Introduction to visual basic
Manav Khandelwal
1_Intro_toHTML.ppt
1_Intro_toHTML.ppt
benjaminonum1
Browser tools that make web development easier
Browser tools that make web development easier
Alan Seiden
cyber security-ethical hacking web servers.pdf
cyber security-ethical hacking web servers.pdf
jayaprasanna10
Webdesigningandpublishingcomputerstudiestheorylesson 101212054612-phpapp02
Webdesigningandpublishingcomputerstudiestheorylesson 101212054612-phpapp02
Harshith Rockx
XPages101 - Building an XPages app - Lotusphere 2011
XPages101 - Building an XPages app - Lotusphere 2011
Tim Clark
Ch 10: Hacking Web Servers
Ch 10: Hacking Web Servers
Sam Bowne
Dreamweaver Application
Dreamweaver Application
Sarah Hall
CNIT 123 Ch 10: Hacking Web Servers
CNIT 123 Ch 10: Hacking Web Servers
Sam Bowne
Ad

Dreamweaver

  • 2. about Dreamweaver Owned by Adobe Current version is Dreamweaver CS6 HTML editor WYSIWYG editor "what you see is what you get" Content during editing appears very similar to the final product (wikipedia definition) 10/17/2012 ITWP1000 Basic Web Programming 2
  • 3. Dreamweaverthe launch When you first launch Dreamweaver you see a menu with a lot of choices: Create new documents Choose from basic HTML, PHP, ASP, JavaScript, CSS, etc. Top Features (videos) Open Recent documents 10/17/2012 ITWP1000 Basic Web Programming 3
  • 4. in the beginning 10/17/2012 ITWP1000 Basic Web Programming 4
  • 5. the basic layout Standard menu bar Insert bar contains objects that help you create a web page visually Common menu is default Browse through different menus with items by clicking on the tab From the menu & tool bars you can add images, anchors, different scripts, comments, etc. instantly 10/17/2012 ITWP1000 Basic Web Programming 5
  • 6. the basic layout In CS5.5 the menu is located along the right side of the application in panels All elements can also be inserted from the top menu bar 10/17/2012 ITWP1000 Basic Web Programming 6
  • 7. the basic layout Document tool bar contains options that let you view the source code, easily enter a page title and preview the current web page View the source View in a Title your code or layout web Page browser 10/17/2012 ITWP1000 Basic Web Programming 7
  • 8. the basic layout Dreamweaver offers you three ways to view your web document: Code Split Design You can move back and forth between different views by clicking on the icons 10/17/2012 ITWP1000 Basic Web Programming 8
  • 9. the basic layout Code view displays only the source code of the document Code is color coded Shows Line numbers 10/17/2012 ITWP1000 Basic Web Programming 9
  • 10. the basic layout Split view displays a split screen with code and design views 10/17/2012 ITWP1000 Basic Web Programming 10
  • 11. the basic layout Design view does not display any source code only the document window 10/17/2012 ITWP1000 Basic Web Programming 11
  • 12. the basic layout You can add/view properties in your web document through the use of the properties inspector at the bottom of each page 10/17/2012 ITWP1000 Basic Web Programming 12
  • 13. the basic layout Panel groups Located on the right side contain related panels docked together Can hide panels (through menu bar by checking or un-checking) 10/17/2012 ITWP1000 Basic Web Programming 13
  • 14. previewing a web page Dreamweaver makes it easy to preview your Web page in a browser Click the Preview/Debug in browser icon Select the browser you want to use to preview your Web page Can add multiple browsers to the list Choose Edit Browser List from the submenu Browser must be installed on the computer Web page opens up in a browser window 10/17/2012 ITWP1000 Basic Web Programming 14
  • 15. Dreamweaver and FTP Dreamweaver has FTP capabilities Can set up different sites by using the Site Manager located in the top menu bar Site > Manage Sites 10/17/2012 ITWP1000 Basic Web Programming 15
  • 18. Dreamweaver help Dreamweaver Development Center http://www.adobe.com/devnet/dreamweaver.html 10/17/2012 ITWP1000 Basic Web Programming 18
  • 19. Visit Dreamweaver online 10/17/2012 ITWP1000 Basic Web Programming 19