Chapter 8 HTML Editors Copyright © 2006 Pearson Addison-Wesley. All rights reserved. 8-2 Text Editors No single method Notepad Textpad, Notetab, and.

Slides:



Advertisements
Similar presentations
Web Center Certification Sitemap / Formatting Content Web Center Certification Training Intuit Financial Services University.
Advertisements

Copyright © 2008 Pearson Education, Inc. Publishing as Pearson Addison-Wesley Chapter 3 Cascading Style Sheets Programming the World Wide Web Fourth edition.
1 © Netskills Quality Internet Training, University of Newcastle From My Home Page to FrontPage An Overview of Authoring Tools Patris van Boxel Netskills.
DREAMWEAVER Welcome to our website!
Computers: Tools for an Information Age Writing Your Own Web Page: Using HTML and Web Authoring Tools.
HTML Tags and Their Functions
Chapter 3 – Web Design Tables & Page Layout
Word Lesson 7 Working with Documents
Review Chapter 11 - Tables © 2010, 2006 South-Western, Cengage Learning.
Microsoft Word By: Phuong Nguyen.
Designing Websites Using HTML and FrontPage A Typical Webpage View Source A webpage is a text file containing instructions to tell a computer how the.
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.
Working with Graphics – Lesson 21 Working with Graphics Lesson 2.
Learning the Basics – Lesson 1
Macromedia Dreamweaver MX 2004 – Design Professional Dreamweaver GETTING STARTED WITH.
Pasewark & Pasewark Microsoft Office XP: Introductory Course 1 INTRODUCTORY MICROSOFT WORD Lesson 8 – Increasing Efficiency Using Word.
Project 8 Creating Style Sheets.
XP Information Technology Center - KFUPM1 Microsoft Office FrontPage 2003 Creating a Web Site.
Designing Websites Using HTML and FrontPage A Typical Webpage View Source A webpage is a text file containing instructions to tell a computer how the.
Chapter 3 Tables and Page Layout
ETT 429 Spring 2007 Web Design I.
Chapter 19 – Macromedia Dreamweaver MX 2004
CPSC 203: Introduction to Computers Tutorials 03 & 29 by Jie (Jeff) Gao.
With Alex Conger – President of Webmajik.com FrontPage 2002 Level I (Intro & Training) FrontPage 2002 Level I (Intro & Training)
Creating a Web Page HTML, FrontPage, Word, Composer.
CPSC 203 Introduction to Computers Lab 39, 40 By Jie (Jeff) Gao.
 Using Microsoft Expression Web you can: › Create Web pages and Web sites › Set what you site will look like as you design it › Add text, images, multimedia.
Create a Website Session I Key Components Hands-on HTML.
Web Design HTML, Frontpage, DreamWeaver μέρος β ΠΡΥ019 - Πληροφορική Δρ.Βάσος Βασιλείου.
Web Design Dreamweaver Semester 2 ATBs. ATB #1 What is a web site?
 2001 Deitel & Associates, Inc. All rights reserved. 1 Chapter 12 – Microsoft FrontPage Express Outline 12.1Introduction 12.2Microsoft FrontPage Express.
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
Copyright © 2008 Pearson Prentice Hall. All rights reserved. 1 Exploring Microsoft Office Word 2007 Chapter 8 Word and the Internet Robert Grauer, Keith.
Using FrontPage Express. Slide 1 Standard toolbars and menus Time indicator: gives an approximation of download time of the page.
1 Macromedia Dreamweaver Outline Introduction Macromedia Dreamweaver Text Styles Images and Links Symbols and Lines Tables Forms Scripting in Dreamweaver.
Web Design-Lecture2-QN-2003 Web Design Microsoft FrontPage®
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.
Website Development with Dreamweaver
XP Dreamweaver 8.0 Tutorial 3 1 Adding Text and Formatting Text with CSS Styles.
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.
Lecture 2 Building Web Pages 1 Lecture 2  Building Web pages  Languages and programs  HTML - Hyper Text Markup Language  Netscape’s Composer  MicroSoft.
Domain 3 Understanding the Adobe Dreamweaver CS5 Interface.
With Microsoft Office 2007 Intermediate© 2008 Pearson Prentice Hall1 PowerPoint Presentation to Accompany GO! with Microsoft ® Office 2007 Intermediate.
XP New Perspectives on Microsoft Office FrontPage 2003 Tutorial 1 1 Microsoft Office FrontPage 2003 Tutorial 1 – Creating a Web Site.
Chapter 1 Creating a Dreamweaver Web Page and Local Site
Ali Alshowaish. What is HTML? HTML stands for Hyper Text Markup Language Specifically created to make World Wide Web pages Web authoring software language.
Who Wants to be a Millionaire? LIFELINES 1.50/50 2.Poll the audience 3.Ask Another Student.
Tutorial 3 Adding and Formatting Text with CSS Styles.
Chapter 1 Getting Started With Dreamweaver. Exploring the Dreamweaver Workspace The Dreamweaver workspace is where you can find all the tools to create.
Project 1 Dreamweaver Provides. Automatic Web Page Design Develop your own webpage without having to spend hours writing HTML code Web site management.
Exploring Microsoft Microsoft FrontPage Chapter 21 Exploring Microsoft FrontPage 2002 Chapter 1 Creating a Home Page: Introduction to MS FrontPage.
Introducing Dreamweaver. Dreamweaver The web development application used to create web pages Part of the Adobe creative suite.
HTML Assoc. Prof. Rozinah Jamaludin 28 January 2010.
Chapter 8 HTML Editors. Copyright © 2006 Pearson Addison-Wesley. All rights reserved. 8-2 Text Editors Text editors don't have word processing features.
Positioning Objects with CSS and Tables
Introduction to HTML Simple facts yet crucial to beginning of study in fundamentals of web page design!
Chapter 28. Copyright 2003, Paradigm Publishing Inc. CHAPTER 28 BACKNEXTEND 28-2 LINKS TO OBJECTIVES Table Calculations Table Properties Fields in a Table.
XP New Perspectives on Macromedia Dreamweaver MX 2004 Tutorial 5 1 Adding Shared Site Elements.
Create and edit web pages 4
Positioning Objects with CSS and Tables
Microsoft PowerPoint 2007 – Unit 2
Using FrontPage Express
Step 1:. Open Microsoft FrontPage application.
Positioning Objects with CSS and Tables
Presentation transcript:

Chapter 8 HTML Editors

Copyright © 2006 Pearson Addison-Wesley. All rights reserved. 8-2 Text Editors No single method Notepad Textpad, Notetab, and EditPad

Copyright © 2006 Pearson Addison-Wesley. All rights reserved. 8-3 Text Editors (cont’d…) Programming Editors – Designed for writing code in specific languages – Color coded tags, scripts, browser preview Ex: CoffeeCup HTML Editor – – Download – Look at Features

Copyright © 2006 Pearson Addison-Wesley. All rights reserved. 8-4 Text Editors (cont’d…) Adding a Hyperlink – Drag elements from one pane to another – Add a link from the campingplain.htm page to the campinginfo.htm page by dragging

Copyright © 2006 Pearson Addison-Wesley. All rights reserved. 8-5 Text Editors (cont’d…) Basic Formatting Tags 1.Create a page from scratch 2.Title the page 3. Use Tag Library to display HTML tags 4.Save 5.Preview 6.Type style sheet link tag as in Fig Add the paragraph of text as in p Format the paragraph 9.Enhance the fonts

Copyright © 2006 Pearson Addison-Wesley. All rights reserved. 8-6 Text Editors (cont’d…) Inserting an Image – Add an image to your document – Use Images folder – Explore options in Image dialog box – Look at the Thumbnail version of your image – Center the image

Copyright © 2006 Pearson Addison-Wesley. All rights reserved. 8-7 Text Editors (cont’d…) Using Tables – To place text, form items and other elements use a table – Grid of rows and a column of cells – Each cell can contain text, an image, a form item or another HTML element – Create a table that has four columns and 4 rows…

Copyright © 2006 Pearson Addison-Wesley. All rights reserved. 8-8 Text Editors (cont’d…) Adding a Remote Hyperlink – Add a remote hyperlink-- link to a page – Create a link back to the main page – Insert Tags – Add a comment tag to identify author – Finally, link campingplain.htm page to the swimming.htm page – As can be seen programming editors help

Copyright © 2006 Pearson Addison-Wesley. All rights reserved. 8-9 WYSIWYG Editors WYSIWYG – (What you see is what you get) Used for years with respect to application packages such as word processing and spreadsheet packages. It means that you see the complete document, including formatting, as it would look when it is printed or displayed

Copyright © 2006 Pearson Addison-Wesley. All rights reserved WYSIWYG Editors (cont’d…) Word Processing Applications – They do the job, but generate a lot of code Netscape Composer – Free, Suitable for single pages and medium-sized Web sites Basic Formatting – Similar to word processing, Highlight and change

Copyright © 2006 Pearson Addison-Wesley. All rights reserved WYSIWYG Editors (cont’d…) Using a Table for Layout – Use a table to align an image with a list of items – Table will keep elements together in a block and can be flexible – Use Netscape composer to align an image with a list of items – Cell width changes as you add text

Copyright © 2006 Pearson Addison-Wesley. All rights reserved WYSIWYG Editors (cont’d…) Table and Cell Alignment – Table, table properties – Cells tab – Preview

Copyright © 2006 Pearson Addison-Wesley. All rights reserved WYSIWYG Editors (cont’d…) Hyperlinks – Adding a remote hyperlink – Adding a local hyperlink

Copyright © 2006 Pearson Addison-Wesley. All rights reserved WYSIWYG Editors (cont’d…) Macromedia Dreamweaver when websites become more complex Use a template Use synchronization (recent updates are stored locally and updated to the server) Install and open Dreamweaver

Copyright © 2006 Pearson Addison-Wesley. All rights reserved WYSIWYG Editors (cont’d…) Basic Formatting Property inspector Paragraph format, color, font, alignment and others Properties of the image See the design panel Style sheet Formatting

Copyright © 2006 Pearson Addison-Wesley. All rights reserved WYSIWYG Editors (cont’d…) Adding an Image Images folder Drag and select Align Adding a Table Add store hours, Save, Preview

Copyright © 2006 Pearson Addison-Wesley. All rights reserved WYSIWYG Editors (cont’d…) Remote and Local Hyperlinks in Dreamweaver – Add a remote hyperlink – Add a local hyperlink – Add a title and comment – Preview in Web Browser

Copyright © 2006 Pearson Addison-Wesley. All rights reserved WYSIWYG Editors (cont’d…) Microsoft FrontPage FrontPage and Dreamweaver have similar features Similar to Microsoft Office