Chapter 8 HTML Editors Text Editors Text editors

Text Editors • Text editors don't have word processing features like formatting text and

Text Editors (cont’d…) • Programming Editors – Designed for writing code in specific languages

WYSIWYG Editors • WYSIWYG – (What You See Is What You Get) – What

WYSIWYG Editors (cont’d…) • Word Processing Applications – They do the job, but generate

WYSIWYG Editors (cont’d…) • NVU – An enhanced version of Netscape Composer, which is

NVU Screen Image Copyright © 2006 Pearson Addison-Wesley. All rights reserved. 7

WYSIWYG Editors (cont’d…) • Basic Formatting – Similar to word processing, Highlight and change

WYSIWYG Editors (cont’d…) • Using a Table for Layout – Use a table to

WYSIWYG Editors (cont’d…) • Table and Cell Alignment – Table, table properties – Cells

NVU Table Example Copyright © 2006 Pearson Addison-Wesley. All rights reserved. 11

WYSIWYG Editors (cont’d…) • Macromedia Dreamweaver – When websites become more complex, you need

WYSIWYG Editors (cont’d…) • Basic Formatting • Property inspector • Paragraph format, color, font,

WYSIWYG Editors (cont’d…) • Adding an Image • Images folder • Drag and select

WYSIWYG Editors (cont’d…) • Microsoft Front. Page • Front. Page and Dreamweaver have similar

Slides: 15

Download presentation

Chapter 8 HTML Editors

Text Editors • Text editors don't have word processing features like formatting text and spellcheck • Notepad is the Windows text editor • Textpad, Notetab, and Edit. Pad are others Copyright © 2006 Pearson Addison-Wesley. All rights reserved. 2

Text Editors (cont’d…) • Programming Editors – Designed for writing code in specific languages – Color coded tags, scripts, browser preview • Ex: HTML-KIT – Described in last class – Skip Coffee. Cup (p. 228 -245) Copyright © 2006 Pearson Addison-Wesley. All rights reserved. 3

WYSIWYG Editors • WYSIWYG – (What You See Is What You Get) – What you see on the screen is what will appear on the printer (or on the Web) Copyright © 2006 Pearson Addison-Wesley. All rights reserved. 4

WYSIWYG Editors (cont’d…) • Word Processing Applications – They do the job, but generate a lot of extra code – Demonstration: Microsoft Word, File, Save as Web Page Copyright © 2006 Pearson Addison-Wesley. All rights reserved. 5

WYSIWYG Editors (cont’d…) • NVU – An enhanced version of Netscape Composer, which is not included in Netscape 8 – Free, Suitable for single pages and mediumsized Web sites – Download it from www. nvu. com – Works on Windows, Mac, or Linux Copyright © 2006 Pearson Addison-Wesley. All rights reserved. 6

WYSIWYG Editors (cont’d…) • Basic Formatting – Similar to word processing, Highlight and change • Tabs available: – Normal – HTML Tags – Source – Preview Copyright © 2006 Pearson Addison-Wesley. All rights reserved. 8

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 – Align an image with a list of items – Cell width changes as you add text Copyright © 2006 Pearson Addison-Wesley. All rights reserved. 9

WYSIWYG Editors (cont’d…) • Table and Cell Alignment – Table, table properties – Cells tab – Preview • Hyperlinks – Highlight text and click the Links tool Copyright © 2006 Pearson Addison-Wesley. All rights reserved. 10

WYSIWYG Editors (cont’d…) • Macromedia Dreamweaver – When websites become more complex, you need to maintain consistency among many pages – Use a template – Use synchronization (recent updates are stored locally and updated to the server automatically by FTP) Copyright © 2006 Pearson Addison-Wesley. All rights reserved. 12

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. 13