Create head content and set page properties Create, import, and format text Add links to Web pages Use the History panel and Code Inspector Modify and.

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 3 – Web Design Tables & Page Layout

Learning the Basics – Lesson 1

Web Site Development Test 2 Working in DreamWeaver.

Who Wants to be a Millionaire? Web Page Development Dreamweaver Chapter 2.

Tutorial 2: Formatting Text. Objectives Session 2.1 – Learn the functions of the Common toolbar – Change the size of text – Discern which fonts to use.

Create a table Resize, split and merge cells Insert and align graphics within table cells Insert text and format cell content Maintain Web site Working.

Macromedia Dreamweaver 4 Foundation Level Course.

Macromedia Dreamweaver MX 2004 Design Professional Web Page DEVELOPING A.

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.

Macromedia Dreamweaver MX 2004 Design Professional Tables WORKING WITH.

Macromedia Dreamweaver 4 Advanced Level Course. Add Rollovers Rollovers or mouseovers are possibly the most popular effects used in designing Web pages.

ETT 429 Spring 2007 Web Design I.

Tutorial 3: Adding and Formatting Text. 2 Objectives Session 3.1 Type text into a page Copy text from a document and paste it into a page Check for spelling.

With Alex Conger – President of Webmajik.com FrontPage 2002 Level I (Intro & Training) FrontPage 2002 Level I (Intro & Training)

Introduction to HTML. What is a Web site? A collection of "pages" or files linked together and available on the World Wide Web What do you need to create.

Designing a Classroom Web Site Using NVU Beginning Level.

Section 7.1 Identify presentation design principles Use a custom template Add pages to a navigation structure Section 7.2 Identify color scheme guidelines.

© 2011 Delmar, Cengage Learning Chapter 2 Developing a Web Page.

Adobe Dreamweaver CS3 Revealed CHAPTER ONE: GETTING STARTED WITH DREAMWEAVER.

Microsoft Expression Web - Illustrated Unit B: Creating a Web Site.

Web Design Dreamweaver Semester 2 ATBs. ATB #1 What is a web site?

Copyright © Texas Education Agency, All rights reserved. 1 Web Technologies Website Development with Dreamweaver.

Chapter 3 Dreamweaver: Part I The Web Warrior Guide to Web Design Technologies.

Website Design CLA – Transportation. Defining a Site Select: Site – New - Site Click Next.

INTRODUCTION TO DREAMWEAVER 8. What we already know…  Design basics  Contrast  Repetition  Alignment  Repetition  HTML.

Tutorial 4: Using CSS for Page Layout. 2 Objectives Session 4.1 Explore CSS layout Compare types of floating layouts Examine code for CSS layouts View.

Planning a Web Site Unit Two Planning Steps 1. Determine the audience & objectives. 2. Sketch a storyboard or flowchart of the pages. 3. Create a folder.

© Cheltenham Computer Training 2001 Macromedia Dreamweaver 4 - Slide No 1 Macromedia Dreamweaver 4 Advanced Level Course.

Developing a Web Page. Unit Objectives Plan the page layout Create the head content Set web page properties Create and format text Add links to web pages.

Web Technologies Website Development Trade & Industrial Education

HTML HyperText Markup Language Constantly evolving - extra facilities being added regularly Java applets and JavaScript used to increase functionality.

CIS 205—Web Design & Development Dreamweaver Chapter 2.

Macromedia Dreamweaver 8-- Illustrated Introductory 1 Macromedia Dreamweaver 8 Unit C Developing a Web Page.

Chapter 2 Developing a Web Page. Chapter 2 Lessons Introduction 1.Create head content and set page properties 2.Create, import, and format text 3.Add.

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.

Copyright © 2008 Pearson Prentice Hall. All rights reserved. 1 Exploring Microsoft Office Word 2007 Chapter 8 Word and the Internet Robert Grauer, Keith.

WELCOME EF 105 Spring EF 105 Computer Methods in Engineering Problem Solving Week 2: FrontPage Introduction to Software Use to create Web Pages.

Website Development with Dreamweaver

XP Dreamweaver 8.0 Tutorial 3 1 Adding Text and Formatting Text with CSS Styles.

Copyright © 2013 MyGraphicsLab / Pearson Education STRUCTURE AND HTML TAGS MyGraphicsLab: Adobe Dreamweaver CS6 ACA Certification Preparation for Web Communication.

Dreamweaver Chapter 1 Mr. Ursone Document Window.

Dreamweaver MX Unit B CIS 205—Web Site Design and Development.

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.

Web Page Creation Part I ST: Introduction to Web Interface Design Prof. Angela Guercio.

Adobe Dreamweaver CS3 Revealed CHAPTER FOUR: WORKING WITH LINKS.

Macromedia Dreamweaver 8-- Illustrated Introductory 1 Macromedia Dreamweaver 8 Unit D Formatting Text and Using Cascading Style Sheets.

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.

Adobe Dreamweaver CS3 Revealed CHAPTER THREE: WORKING WITH TEXT AND IMAGES.

Macromedia Dreamweaver 8 Revealed LINKS WORKING WITH.

Chapter 1 Creating a Dreamweaver Web Page and Local Site

4 Chapter Four Introduction to HTML. 4 Chapter Objectives Learn basic HTML commands Discover how to display graphic image objects in Web pages Create.

L. Anne Spencer (c) 2001 Basic Web Design Document, text, & layout formatting tags & attributes.

Macromedia Dreamweaver 8 Revealed WEB PAGE DEVELOPING A.

Adobe Dreamweaver CS3 Developing a Web Page. Planning the Page Layout Use White SpaceUse White Space Limit media objectsLimit media objects KISSKISS Use.

Introducing Dreamweaver. Dreamweaver The web development application used to create web pages Part of the Adobe creative suite.

1 Creating Links Lesson 2. 2 In the center column type : Home | Order Now | Contact Us This is the navigation button which will link to the other pages.

Introduction lab1. Suzanne J. Sultan 2 What is HTML? The definition of HTML is Hyper Text Markup Language. HTML is a computer language devised to allow.

Building a Website: Layout Fall Overall Structure: Home Page Title Section Title Frame Picture UNCP Math Menu Content Footer Contact Information.

Creating Web Pages with Links, Images, and Embedded Style Sheets

COMP 143 Web Development with Adobe Dreamweaver CC.

HTML And the Internet. HTML and the Internet ► HTML: HyperText Markup Language  Language in which all pages on the web are written  Not Really a Programming.

Creating Web Pages in Word. Sharing Office Files Online Many Web pages are created using the HTML programming language. Web page editors are software.

Chapter 2 Developing a Web Page.

Learning the Basics – Lesson 1

Chapter A - Getting Started with Dreamweaver MX 2004

Chapter A - Getting Started with Dreamweaver MX 2004

Dreamweaver – Project #1

5.00 Apply procedures to organize content by using Dreamweaver. (22%)

4.00 Apply procedures to add content by using Dreamweaver. (22%)

Presentation transcript:

Create head content and set page properties Create, import, and format text Add links to Web pages Use the History panel and Code Inspector Modify and test Web pages Unit Lessons

Understanding Page Layout Use White Space Effectively Limit Multimedia Elements Keep it Simple Use an Intuitive Navigation Structure Apply a Consistent Theme Developing a Web page

Creating Head Content Title - browser title bar fig B-2 Keywords - search Description - search results fig B-4 keywords description title

Create Head Content… … …..

Web Page Properties Background color Font color Link colors (unvisited, visited, active)

Web-Safe Colors 216 colors RGB Hexidecimal values

Background color

Create, Import and Format Text Adding text to a Dreamweaver page… Type in Dreamweaver Copy/Paste [Ctrl+C] and [Ctrl+V] Import Word HTML

Web fonts Browsers use visitor’s fonts Font combinations Serif and Sans Serif t T Graphic text for funky fonts

Text Property Inspector Font, Size, Color, Style, Alignment

Font Size “3” - Default browser size “1” through “7”, or “-7” through “+7”

Web filenames Do not use: Spaces Special characters Punctuation Capital letters

Add Links to Web Pages

Link properties Link names - informative Hyper text - topic Graphic Formatting properties - consistent Address or path - relative vs absolute

Broken Links Typos Pages move Sites move Sites expire

Add a Link Browse or Point

Link (mailto:) Fig B-20

Site Map Home page Linked pages

History Panel …functions Undo Redo Replay Save As Command

History Panel …properties 50 steps Preferences adds more Increasing steps uses memory

Code Inspector Code View in a floating window

Reference Panel Open from Code Inspector or Reference Panel Html tag example info

Comments Discerns code Not visible in browser

Date Object

Comment and Date HTML Comment tag used for date

Test Pages …in Preview Proofreading Window size Links

Test window sizes within Dreamweaver

Test Pages …in field Monitors size and resolution Platforms unix, mac, pc Browsers explorer, netscape, aol

Unit Tasks Create head content Set page properties Import and Format text Add links Use History Panel Use Code Inspector Test Web pages