Dreamweaver Basics.

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

DREAMWEAVER Welcome to our website!
Chapter 3 – Web Design Tables & Page Layout
Using Dreamweaver MX. Slide 1 Standard toolbars and menus Time indicator: gives an approximation of download time of the page Properties panel.
Working with Tables for Page Design – Lesson 41 Working with Tables for Page Design Lesson 4.
KompoZer. This is what KompoZer will look like with a blank document open. As you can see, there are a lot of icons for beginning users. But don't be.
Intermediate Level Course. Text Format The text styles, bold, italics, underlining, superscript and subscript, can be easily added to selected text. Text.
 Steps how to design a web page using Microsoft Frontage Steps how to design a web page using Microsoft Frontage  Video related to the topic Video related.
Chapter 3 Tables and Page Layout
 Adding Background image  Creating internal links  Creating external links  Save your document as a webpage(.mht) file.
Start -> All Programs -> Classes -> Web Expressions -> Dreamweaver.
ETT 429 Spring 2007 Web Design I.
Using Dreamweaver getting started 1)Start in your “My Documents” folder 2)Create a new folder called “website” 3)Create a sub folder called “images” 4)Start.
Chapter 3. Table have many uses in a HTML design but are mostly used for the organization of your web site. Tables also give vertical and horizontal structure.
Web Design HTML, Frontpage, DreamWeaver μέρος β ΠΡΥ019 - Πληροφορική Δρ.Βάσος Βασιλείου.
© 2012 Boise State University1 WordPress Training February 14, 2013.
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.
Website Design CLA – Transportation. Defining a Site Select: Site – New - Site Click Next.
Web Technologies Website Development Trade & Industrial Education
© 2012 Boise State University1 WordPress Training February 14, 2013.
CIS 451: HTML Frames Adapted from materials developed by Dr. Soe (updated January, 2009)
Adding User Interactivity – Lesson 51 Adding User Interactivity Lesson 5.
Web Design (5) Navigation (1). Creating a new website called ‘Navigation’ In Windows Explorer, open the folder “CU3A Web Design Group”; and then the sub-folder.
Intro to Dreamweaver Web Design Section 7-1 Part or all of this lesson was adapted from the University of Washington’s “Web Design & Development I” Course.
DREAMWEAVER Adding photos and other tips!. Making photo gallery  Gather ALL the photos you need into your images folder. (remember to copy the URL so.
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.
Interface.  Menu  Document  Insert  Panel Management.
Making a Game Linking Slides. To link slides: 1.Prepare your storyboard 2.Complete all slides 3.Link the slides.
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.
Chapter 10 Fireworks: Part II The Web Warrior Guide to Web Design Technologies.
Dreamweaver Unit A. Project Files l Download files from l Search using l Download the data disk.
Fall 2005 Using FrontPage to Enhance Blackboard - Darek Sady1 Using FrontPage to Enhance Blackboard 1.Introduction 2.Starting FrontPage 3.Creating Documents.
Domain 3 Understanding the Adobe Dreamweaver CS5 Interface.
Creating Links – Lesson 31 Creating Links Lesson 3.
Chapter 5 Quick Links Slide 2 Performance Objectives Understanding Framesets and Frames Creating Framesets and Frames Selecting Framesets and Frames Using.
Table Row Table Data ( Header & Data) Data Cell Padding TABLE.
Accessible Word and PDF documents
CH. 7 Web Page Design –Page Layout with Frames Mr. Ursone.
Start Dreamweaver program From file menu click new Blank page appears.
Creating Links. The Anchor Element: The anchor tag can be used in three different ways: 1.External link – to link to a web page outside your own website.
January 2006Colby College ITS Setting Up Course Pages.
Paper 3 Unit 15 – Web Authoring Software Choices Graphics Exporting Graphics Creating CSS RGB Colour CSS – Body, Table and TD Border Collapse Tables -
Links in HTML What you need to know….. Hyperlinks or links Millions of linked web pages make up the World Wide Web Used to connect a web page to another.
Introducing Dreamweaver. Dreamweaver The web development application used to create web pages Part of the Adobe creative suite.
1 Creating the Home Page. 2 Creating a Table Table attributes  Two rows and two columns  No border  Left-aligned Change the vertical alignment of the.
Home page Web page link 1 Web page link 2Web page link 3Web page link 4.
Web Site Development - Process of planning and creating a website.
XP New Perspectives on Macromedia Dreamweaver MX 2004 Tutorial 5 1 Adding Shared Site Elements.
Hyperlinks Links for Other Pages. Hyperlink (aka Link) Text (or image) user can click Takes user to different location In general, location can be: On.
Making the website. Get your folders sorted first Create a new folder in “N” called “My hockey website” Create folders inside called “Documents”, “images”
1 After completing this lesson, you will be able to: Create and edit hyperlinks in worksheets. Save worksheets and workbooks as Web pages. Send workbooks.
With Microsoft FrontPage 2000
Intro to Dreamweaver Web Design Section 8-1
Creating Links – Lesson 3
Dreamweaver – Project #1
Table of Contents Creating Frames Frameset Tag and its attributes
Dreamweaver CS4 Skills PLAN – PLAN – PLAN first
Chapter 2 Adding Web Pages, Links, and Images
Table of Contents Creating Frames Frameset Tag and its attributes
Cheat Sheet CSCI 100 JW Ryder
Table of Contents Creating Frames Frameset Tag and its attributes
Web Content Management
Cheat Sheet CSCI 100 JW Ryder
Consult America Technology Consulting Services
Introduction to the ISB Intranet
Making a website.
4.00 Apply procedures to add content by using Dreamweaver. (22%)
Presentation transcript:

Dreamweaver Basics

Start -> Dreamweaver

VIEW Code and/or Design NOT LIVE View

View Rulers in Pixels

Display Code, Split, Design

Preview in Browser

Windows

Page Properties Help (F1)

Link Options

At this point Save As -- home (lowercase h) in M:\Home Even before you add content

Setting Up Tables according to your design

Split and Merge Cells to fit your design Each object should have it’s own cell Split or Merge Cells

Split and Merged Cell Examples

Place a Table inside a cell of another Table for more layout detail

File -> Save periodically

Links hyperlink anchor Link Name Browse for file Or type URL

Controlling Link Display In the Target pop-up menu, select the window in which the file should open in the Target text box. Use properties panel Attribute Values Value Description _blank Opens the linked document in a new window or tab _self Opens the linked document in the same frame as it was clicked (this is default) _parent Opens the linked document in the parent frame _top Opens the linked document in the full body of the window

Inserting an Image

Inserting an Image

Preview WebPage (click here or F12) Will ask you to Save

Consider using a Photoshop image(s) for all/much of your webpage with Image Mapping