Committed to Shaping the Next Generation of IT Experts. Essentials For Design Dreamweaver Level One Julian Rickards Project 1 Taking A Tour Of Dreamweaver.

Slides:



Advertisements
Similar presentations
DREAMWEAVER WORKSPACE The Document Window The Code Inspector Panel The Insert Bar The Property Inspector Panels and Panel Groups The Site Panel The Menu.
Advertisements

Chapter 1: Introduction. Contents Whats New in Dreamweaver CS4? The Dreamweaver CS4 Interface Setting Up a Site Creating a Web Page Adding Text to Your.
1 Web Site Design Overview of the Internet Cookie Setton.
Learning the Basics – Lesson 1
Dreamweaver MX 2004 “Viewing the Workspace” Mrs. Wilson.
© 2010 Delmar, Cengage Learning Chapter 1 Getting Started with Dreamweaver.
Chapter 3 Tables and Page Layout
Macromedia Dreamweaver 4 Foundation Level Course.
Explore the Dreamweaver Workspace View a Web page and use Help Plan and Define a Web site Add a Folder and Pages, and set the Home page Create and View.
Chapter 19 – Macromedia Dreamweaver MX 2004
Getting Started with Adobe Dreamweaver CS6. Unit Objectives Define web design software Start Adobe Dreamweaver CS6 View the Dreamweaver workspace Work.
Getting Started with Dreamweaver
Adobe Dreamweaver CS3 Revealed CHAPTER ONE: GETTING STARTED WITH DREAMWEAVER.
Chapter 4 Dreamweaver: Part II The Web Warrior Guide to Web Design Technologies.
Web Design Dreamweaver Semester 2 ATBs. ATB #1 What is a web site?
Getting Started with Expression Web 3
Copyright © Texas Education Agency, All rights reserved. 1 Web Technologies Website Development with Dreamweaver.
Using Dreamweaver. Slide 1 Dreamweaver has 2 screens that do different things The Document window where you create your WebPages The Site window where.
Chapter 3 Dreamweaver: Part I The Web Warrior Guide to Web Design Technologies.
Macromedia Studio 8 Step-by-Step MACROMEDIA DREAMWEAVER 8 Introduction.
© Ms. Masihi.  The Dreamweaver Welcome Screen first opens when you start Dreamweaver.  This screen gives you quick access to previously opened files,
INTRODUCTION TO FRONTPAGE. TOPICS TO BE DISCUSSED……….  Introduction Introduction  Features Features  Starting Front Page Starting Front Page  Components.
Web Technologies Website Development Trade & Industrial Education
Introducing Dreamweaver MX 2004
Tutorial 1 Getting Started with Adobe Dreamweaver CS3
Tutorial 1: Getting Started with Adobe Dreamweaver CS4.
Chapter 2 Developing a Web Page. A web page is composed of two distinct sections: –The head content –The body Creating Head Content and Setting Page Properties.
1 Macromedia Dreamweaver Outline Introduction Macromedia Dreamweaver Text Styles Images and Links Symbols and Lines Tables Forms Scripting in Dreamweaver.
Website Development with Dreamweaver
ADOBE WEAVER WEB DESIGN. START THE DW 2 WORKSPACE LAYOUT Application Bar Document Toolbar Document Window Workspace Switcher Property Inspector GroupPanel.
CIS 205—Web Design & Development Dreamweaver Chapter 1.
JAOIT 8.  Dreamweaver is a program for creating web pages and managing websites without having to type HTML code.  WYSIWYG – What you see is what you.
Session 1 SESSION 1 Working with Dreamweaver 8.0.
Web Site Design Marion Setton
Dreamweaver Basics Dayton High School Mr. Martin.
Domain 3 Understanding the Adobe Dreamweaver CS5 Interface.
Macromedia Dreamweaver 8 Revealed DREAMWEAVER GETTING STARTED WITH.
Lesson 12: Working with Code-editing Features Introduction to Adobe Dreamweaver CS6 Adobe Certified Associate: Web Communication using Adobe Dreamweaver.
IT204 - Web Scripting and Authoring I Introduction to Dreamweaver Unit 6.
Presented by Graduate Design Group 2 Meredith, Jennifer, Cammay and Diane.
Chapter 1 Creating a Dreamweaver Web Page and Local Site
Committed to Shaping the Next Generation of IT Experts. Essentials For Design Dreamweaver Level One Julian Rickards Project 4 Linking the Site.
Chapter 5 Quick Links Slide 2 Performance Objectives Understanding Framesets and Frames Creating Framesets and Frames Selecting Framesets and Frames Using.
Committed to Shaping the Next Generation of IT Experts. Essentials For Design Dreamweaver Level One Julian Rickards Project 7 Frames.
Committed to Shaping the Next Generation of IT Experts. 1 Essentials For Design Dreamweaver Level One Julian Rickards Project 3 Applying Structure To.
Committed to Shaping the Next Generation of IT Experts. Essentials For Design Dreamweaver Level One Julian Rickards Project 6 Backgrounds and Colors.
Project 1 Dreamweaver Provides. Automatic Web Page Design Develop your own webpage without having to spend hours writing HTML code Web site management.
Dreamweaver MX. 2 Tools for Code Editing (p. 366) n An HTML editor like Dreamweaver writes most of the code you need, but at times you will need to perform.
Introducing Dreamweaver. Dreamweaver The web development application used to create web pages Part of the Adobe creative suite.
Chapter 8 HTML Editors. Copyright © 2006 Pearson Addison-Wesley. All rights reserved. 8-2 Text Editors Text editors don't have word processing features.
Introduction to Dreamweaver. What is it?  An Adobe program to graphically create and manage Web sites. It often referred to as a GUI ---Graphical User.
Copyright © 2013 MyGraphicsLab / Pearson Education DREAMWEAVER INTERFACE MYGRAPHICSLAB: ADOBE DREAMWEAVER CS6.
Web and Multimedia Development Copyright © Genetic Computer School 2007WM LESSON OVERVIEW  Use of Tables  Creating Tables  Try It – 1  Creating.
Committed to Shaping the Next Generation of IT Experts. Essentials For Design Dreamweaver Level One Julian Rickards Project 2 Building Your First Web.
Before We Begin Please download the files from as we will be using them in our walkthroughs.
Microsoft Expression Web - Illustrated Unit A: Getting Started With Microsoft Expression Web.
Tutorial 1 Getting Started with Adobe Dreamweaver CS5.
Getting Started with Dreamweaver
OVERVIEW Objectives Follow a design document to create a small personal Web site Follow a design document to create pages in a large commercial Web site.
Chapter A - Getting Started with Dreamweaver MX 2004
Learning the Basics – Lesson 1
Positioning Objects with CSS and Tables
Dreamweaver – Project #1
Dreamweaver CS4 Skills PLAN – PLAN – PLAN first
Chapter 2 Adding Web Pages, Links, and Images
Dreamweaver 8: Introduction
Getting Started with Dreamweaver
Dreamweaver MX 2004 Fundamentals
3.00 Understanding the Adobe Dreamweaver interface. (12%)
Positioning Objects with CSS and Tables
Presentation transcript:

Committed to Shaping the Next Generation of IT Experts. Essentials For Design Dreamweaver Level One Julian Rickards Project 1 Taking A Tour Of Dreamweaver

Copyright (c) 2004 Prentice-Hall. All rights reserved. 2 Objectives Launch Identify components Switch layouts Designer workspace Property inspector HTML tag selector Modify interface Help

Copyright (c) 2004 Prentice-Hall. All rights reserved. 3 Visual Summary

4 Document Window Code view Designer view Split screen

Copyright (c) 2004 Prentice-Hall. All rights reserved. 5 Property Inspector text graphics tables

Copyright (c) 2004 Prentice-Hall. All rights reserved. 6 Insert Bar Web-page design functions Common Insert bar Layout Insert bar Text Insert bar

Copyright (c) 2004 Prentice-Hall. All rights reserved. 7 Launching Dreamweaver Windows and Macintosh TToolbars – docked vs. floating CCoder area

8 Launch – Choose Designer And Click OK

9 Launch – Choose Create New HTML

10 Launch – Design View This will be WYSIWIG

Copyright (c) 2004 Prentice-Hall. All rights reserved. 11 Launch – Preferences Categories Specifics

Copyright (c) 2004 Prentice-Hall. All rights reserved. 12 Launch – Change Workspace Designer Coder

Copyright (c) 2004 Prentice-Hall. All rights reserved. 13 Launch – Accept Changes And Re-launch … Start page appears Choose HTML

Copyright (c) 2004 Prentice-Hall. All rights reserved. 14 Exploring The Coder Workspace Layout Designer = WYSIWYG Coder = HTML code TTags, attributes

Copyright (c) 2004 Prentice-Hall. All rights reserved. 15 Document Window

Copyright (c) 2004 Prentice-Hall. All rights reserved. 16 Document Window – Options Click in code window to get available options

Copyright (c) 2004 Prentice-Hall. All rights reserved. 17 Document Toolbar Tool Tips

Copyright (c) 2004 Prentice-Hall. All rights reserved. 18 Insert Bar Tool Tips

Copyright (c) 2004 Prentice-Hall. All rights reserved. 19 Exploring The Designer Workspace Layout Panel groups Design button

Copyright (c) 2004 Prentice-Hall. All rights reserved. 20 Split Button

Copyright (c) 2004 Prentice-Hall. All rights reserved. 21 Refresh Design View

Copyright (c) 2004 Prentice-Hall. All rights reserved. 22 Change To Layout

Copyright (c) 2004 Prentice-Hall. All rights reserved. 23 Exploring The Property Inspector Most important panel View and change attributes Preview a Web page

Copyright (c) 2004 Prentice-Hall. All rights reserved. 24 Web Page Preview Web page preview Design view

Copyright (c) 2004 Prentice-Hall. All rights reserved. 25 Exploring HTML Using The Tag Selector Tag review PPurpose TTypes PPairs <head> and <body> <title> <style> <body><table><tr><td><p><a>

Copyright (c) 2004 Prentice-Hall. All rights reserved. 26 Tag Selector

Copyright (c) 2004 Prentice-Hall. All rights reserved. 27 Split Button

Copyright (c) 2004 Prentice-Hall. All rights reserved. 28 Table Code

Copyright (c) 2004 Prentice-Hall. All rights reserved. 29 Table Tag Selected

Copyright (c) 2004 Prentice-Hall. All rights reserved. 30 Exploring HTML Using The Tag Chooser Insert bar Property inspector Tag chooser AAll tags CCategorized OOther languages

Copyright (c) 2004 Prentice-Hall. All rights reserved. 31 Tag Chooser Window

Copyright (c) 2004 Prentice-Hall. All rights reserved. 32 Tag Editor – Address

Copyright (c) 2004 Prentice-Hall. All rights reserved. 33 Examine Address Work

Copyright (c) 2004 Prentice-Hall. All rights reserved. 34 Examine The Code

Copyright (c) 2004 Prentice-Hall. All rights reserved. 35 Configuring The Document Window Preferences  Many options Panel groups Screen resolutions Download time indicator

Copyright (c) 2004 Prentice-Hall. All rights reserved. 36 Configurations panels resolution load time

Copyright (c) 2004 Prentice-Hall. All rights reserved. 37 Expander Button

Copyright (c) 2004 Prentice-Hall. All rights reserved. 38 Exploring The Dreamweaver Help Function Windows Help screen

Copyright (c) 2004 Prentice-Hall. All rights reserved. 39 Help Screen Macintosh Help screen

Copyright (c) 2004 Prentice-Hall. All rights reserved. 40 Help – Getting Started

Copyright (c) 2004 Prentice-Hall. All rights reserved. 41 Summary Dreamweaver interface Components Tag selector and tag chooser Web page Property inspector Help

Copyright (c) 2004 Prentice-Hall. All rights reserved. 42 End-of-Project Exercises Screen ID Multiple Choice Discussion Skill Drill Work with Multiple Open Files Explore the Results Panel Group Explore a Complex Web page Explore Other Helpful Resources

Copyright (c) 2004 Prentice-Hall. All rights reserved. 43 End-of-Project Exercises (continued) CChallenge EExplore Other HTML Reference Web Sites EExplore a Web Page Using Tables for Layout EExploring a Web Page Using a Table-Free Layout PPortfolio Builder LLearn to Judge Web Sites Research and Record the URL or Web Address of at least five web sites that represent good organization and use of text, photo images and graphics Analyze and describe the key features of your research sites How do these features promote your web site?

Copyright (c) 2004 Prentice-Hall. All rights reserved. 44 What Are Your Questions