Chapter 1: Setting up a Master

Chapter 1: Setting up a Master Toolbox 27 Figure 1-21: Using Detagger to remove HTML tags. tip HTML Tidy is built into a wide range of shareware code editors and utilities. Be sure to check the sourceforge Web site for additional resources. In Figure 1-22, I m using TidyGUI, a simple GUI interface to Tidy, to clean a document. Secret #15: Compression Utilities Compression utilities are one of the most critical tools you ll need. And, with today s more efficient compression, not only are you able to compress files for more efficient e-mail, FTP, Web site downloads and storage, but you can extract them easily, too. One of the biggest issues in compression is cross-platform compatibility. In the past, most UNIX and related operating systems used certain compression formats, Macintosh used others, and Windows still others. Sending files back and forth or making them available in compressed formats onWeb sites always means making sure you ve got software capable of cross-platform compression and extraction. For Windows, the most widely used package for this is WinZip (www.winzip .com/), a low-cost shareware utility that creates and extracts a wide number of compression formats that are used across platforms (see Figure 1-23).

Note: If you are looking for good and high quality web space to host and run your application check Lunarwebhost Unix Web Hosting services

26 Part I: Tools, Planning, and Content

26 Part I: Tools, Planning, and Content Secret #13: Tag Strippers Another important utility that you llwant to have is an HTML tag stripper. Utilities of this type let you take an HTML or related Web document and strip all the code out of it, leaving you with just the text. In some cases, commercial Web design software contains such utilities. Examples include Macintosh BBEdit (mentioned in the previous Code Editor section), Homesite, and ColdFusion Studio. In the case of Dreamweaver for both Macintosh and Windows, you can add an extension such as Tag Stripper, (www.massimocorner.com/dw/commands/tag_stripper.mxp), which will do the trick for you. Check your favorite editor for this feature. Even if you have features of this nature within your main software, you still might want to have a lightweight, fast, standalone stripper available. What s more, tag strippers tend to offer more advanced features anyway, such as maintaining logical formatting of text, converting tables into tab-delimited format, and changing HTML entities to proper text characters. Table 1-7 shows a variety of helpful, lowcost tag strippers. Table 1-7: Helpful Tag Stripper Software Software Platform and Usage Availability Detagger Windows Low-cost shareware, www.jafsoft .com/detagger/ HTTC HTML to Text Converter Windows, Linux Free under GNU license, www. franksworld.net/httc/ Html2text Linux; command line in English and German Open source freeware, http:// userpage.fu-berlin.de/ ~mbayer/tools/ html2text.html HTML Markdown Macintosh Classic Low-cost shareware, www. printerport.com/klephacks/ markdowndocs.html Figure 1-21 shows me stripping an HTML page using Detagger. Secret #14: HTML Tidy Just as a handy tag stripper gets rid of tags, conversion software such asHTMLTidy can be really useful. Not only does Tidy convert text to HTML, but it also converts HTML to XHTML or to XML. It also validates your markup and fixes additional markup problems. A very sophisticated tool, it s available for every platform and is freely distributed via http://tidy.sourceforge.net/.

Note: If you are looking for good and high quality web space to host and run your application check Lunarwebhost Cheap Web Hosting services

Chapter 1: Setting up a Master

Chapter 1: Setting up a Master Toolbox 25 Secret #12: Rename Utilities For the manyWeb designers working on aWindows platform, easy ways to rename numerous files locally can be problematic. Let ssay you want to take a directory full of files with the suffix .html, retain the files unique prefixes, and change the suffix globally to .php. To do this directly on an open-source operating system from the command line is very simple, but forWindows and Macintosh (except if you use the command line in OS X) you need a rename utility to perform the task effectively. For Windows and Mac OS X, a low-cost, shareware program that ll help you perform rename tasks on your local machine is A Better File Rename. Not only does it do the job, but the company that makes the product, PublicSpace, also has a specialWeb master program allowing you to link to the company and get the software free. Or, if you run a site where you can place their ad banner, you can get more than one product free. Figure 1-20 shows a rename process using A Better File Rename. Figure 1-20: Working with A Better File Rename to batch rename files locally. note To download A Better File Rename, see www.publicspace.net/ ABetterFinderRename/. For the Web master program, visit www.publicspace.net/ webmasters/index.html.

Note: If you are looking for good and high quality web space to host and run your application check Lunarwebhost Cheap Web Hosting services

24 Part I: Tools, Planning, and Content

24 Part I: Tools, Planning, and Content Secret #11: Screen Capture Utilities By far, some of the most helpful utilities I ve ever used are those that assist with screen capturing. Such utilities are invaluable when creating Web site portfolios, sharing mockups with co-workers and colleagues, and so on. While screen captures can be done with almost any imaging program, such as Photoshop, screen capture utilities let you hone in on specific portions of the screen and capture menus, dialogs, and toolbars with ease. This can be very helpful and save a lot of time instead of cropping full-screen images, you can instantly get what you need and, in most cases, output it to numerous useful file formats. Many excellent screen-capture utilities are available for all platforms, but the three most reportedly beloved are as follows: For Windows, SnagIt by TechSmith is an amazing utility that I find myself using almost daily. You can find this low-cost shareware at www.techsmith.com/products/snagit/. Find low-cost shareware ScreenShot Pro, for Mac and Mac OS X at www.code-line.com/software/screenshotpro.html. OSX is packaged with two screen-capture utilities, one within the operating system itself, and the other a feature called Grab. For Linux, the KDE desktop environment has screen shot utilities built in (www.kde.org/), and The Gimp, discussed in the bitmap imaging section earlier, does a great job with screen captures. Figure 1-19 shows me preparing to capture a screen using SnagIt. Figure 1-19: Working with SnagIt to create screen shots.

Note: If you are looking for good and high quality web space to host and run your application check Lunarwebhost PHP Web Hosting services

Chapter 1: Setting up a Master

Chapter 1: Setting up a Master Toolbox 23 As with all software and utilities, some of the available Web animation utilities are commercial, and some are completely free. Table 1-6 provides a variety of popular options from which to choose. Table 1-6: Popular Web Animation Utilities Software Platform and Usage Availability Ulead Gif Animator Windows; very popular with many designers Commercial, low-cost product with 30-day demo, www.ulead .com/ga/runme.htm GIF Construction Set One of the oldest GIF animators around for Windows Low-cost shareware, www.mindworkshop.com/ alchemy/gifcon.html GIF Builder Very popular for Mac OS 9 and earlier Low-cost shareware, www.mac.org/graphics/ gifbuilder/ GIF Builder for OS X Mac OS X (will run on Mac OS 8 and above) Freeware, www.macupdate.com/info .php/id/235 GIF Merge Linux and related platforms http://the-labs.com/ GIFMerge/ The majority ofWeb designers, however, tend to use Adobe ImageReady for animations. ImageReady (shown in Figure 1-18) ships with Photoshop and is available for Windows and Macintosh. Figure 1-18: Creating a GIF animation in Adobe ImageReady.

Note: If you are looking for good and high quality web space to host and run your application check Lunarwebhost PHP Web Hosting services

22 Part I: Tools, Planning, and Content

22 Part I: Tools, Planning, and Content Two such bitmap programs are: Mayura Draw is a shareware vector drawing program for Windows, at $39.00 per license. Used mostly by scientists and engineers for technical illustrations, Mayura Draw can be an invaluable and inexpensive tool in your design toolbox (see Figure 1-17). Sketch is a freely distributed open source drawing program for Linux, with a Windows port version called Skencil. Figure 1-17: Using Mayura Draw for vector-based design. tip Web designers and developers using Linux platform and open source software for designing graphics should check out LinuxArtist.Org, at www.linuxartist.org/2d.php. For additional free vector drawing software resources, see http:// bourbon.usc.edu:8001/tgif/vector.html. Secret #10: Web Animation Utilities Outside of animation for advertising, GIF animations have somewhat fallen out of favor for use on professional Web sites except for those instances where very subtle effects are desired. Of course, much of this has to do with the proliferation of Macromedia Flash (which has also influenced Web advertising). Nevertheless, GIF animations are sill desired in some cases, so make sure you have one on hand.

Note: If you are looking for good and high quality web space to host and run your application check Lunarwebhost PHP Web Hosting services

Chapter 1: Setting up a Master

Chapter 1: Setting up a Master Toolbox 21 note For information on Adobe Photoshop, please visitwww.adobe.com/. Macromedia Fireworks can be found at www.macromedia.com/. Corel products are showcased at www.corel.com/, and JASC s Paint Shop Pro is available at www.jasc.com/. The Gimp for UNIX and Windows can be found at www.gimp.org/, and The Gimp for Mac OS X is at www.macgimp.org/. Secret #9: Vector Image Programs For those of you who create logos, refine type, and enjoy drawing, the two most common drawing programs are Adobe Illustrator and Macromedia Freehand (shown in Figure 1-16). Vector-based images differ from bitmap graphics in that they contain the mathematical information necessary to allow them to be scaled without loss of quality. They are extremely useful for creating curves and shapes. Of course, you will need to rasterize your final work by converting it to bitmap formats, such as GIF or JPEG, if you re going to use your illustration on the Web, but you can achieve far more complex drawing tasks in a vector-based program. Figure 1-16: Drawing geometric shapes in Macromedia Freehand. As with bitmap programs, there are a few shareware and open source gems that shouldn tbe overlooked, especially for those on a limited budget, who have lighterweight needs for vector drawing.

Note: If you are looking for good and high quality web space to host and run your application check Lunarwebhost Java Web Hosting services

20 Part I: Tools, Planning, and Content

20 Part I: Tools, Planning, and Content Figure 1-14: Fireworks is extremely popular for bitmap production. Figure 1-15: Designing graphics using The Gimp, a freely distributed open-source imaging program.

Note: If you are looking for good and high quality web space to host and run your application check Lunarwebhost Unix Web Hosting services

Chapter 1: Setting up a Master

Chapter 1: Setting up a Master Toolbox 19 do not scale well because data becomes lost as you attempt to enlarge a pixel-based image. note Many bitmap-based imaging programs, such as Photoshop, do contain some support for vector-based graphics, which you ll read about in the next secret. Still, they are primarily used for the creation of raster graphics. One thing that s no secret is how ubiquitous Photoshop is for Windows and Macintosh users. And while every professional Web designer should really be familiar with and use Photoshop (shown in Figure 1-13), some other bitmap imaging programs also enjoy fairly widespread use. Figure 1-13: Working on a client site in Photoshop. For Macintosh and Windows, Macromedia Fireworks (shown in Figure 1-14) is a very popular bitmap imaging program, and JASC s Paint Shop Pro has a certain cult-like following among Windows-based Web design enthusiasts. Corel offers a complete drawing program with its Draw suite, but its use seems very limited among people working on the Web. A surprise for bitmap imaging needs is The Gimp. The Gimp stands for GNU Image Manipulation Program and is an open source bitmap drawing software program that works on UNIX and related systems, as well as having versions for the Macintosh and Windows (see Figure 1-15). The Linux and Windows versions of Gimp are freely distributed. You can also run Gimp under OSX for free, although the MacGimp version runs around $20 to download (a far cry from the hundreds to even thousands of dollars other bitmapping programs will cost you).

Note: If you are looking for good and high quality web space to host and run your application check Lunarwebhost Linux Web Hosting services

18 Part I: Tools, Planning, and Content

18 Part I: Tools, Planning, and Content Figure 1-11: The CSS 2 side panel, close-view. Figure 1-12: The CSS panel with the specification open in the browser window.

Note: If you are looking for good and high quality web space to host and run your application check Lunarwebhost Java Web Hosting services