Web Design with HTML and CSS

36

Web editors versus WYSIWYG tools

Web Design with HTML and CSS Digital Classroom

This lesson provides a general overview of web design tools and also includes step-by-step

exercises. The web editors used in this lesson are available as fully functional trial versions

at no cost. If you haven’t decided which tools to use, you’ll want to download and install

the software tools used in this lesson. You’ll need a text editor, such as TextWrangler (Mac)

available at http://www.barebones.com/products/textwrangler or Visual Web Developer Express available

at http://www.microsoft.com/express/Web. You’ll also need a program with a visual design surface such

as Dreamweaver, available at http://www.adobe.com/cfusion/tdrc/index.cfm?product=dreamweaver, or

Expression Web available at http://www.microsoft.com/expression/try-it.

Web editors versus WYSIWYG tools

HTML and CSS use text as their foundation. Because of this, even the most simple text

editor, such as TextEdit on the Mac or Notepad on the PC, is capable of creating web

pages. These basic text editing tools, however, lack features that help with web design and

development such as checking code syntax, organizing your site folders, and uploading fi les

to web servers. In addition to text editors, there are also fully featured web editors and design

tools, such as Adobe Dreamweaver and Microsoft Expression Web. These are WYSIWYG

tools (“What You See Is What You Get”) that provide a visual layout environment, code

editing, along with website management tools. Robust text editors and coding tools that

handle web markup and programming languages such as HTML, CSS, JavaScript, and

PHP provide another set of tools for creating websites. In this overview you’ll look at the

advantages and disadvantages of each category of web design tools.