HTML and Web Design Secrets P2

Chia sẻ: Tran Thach | Ngày: | Loại File: PDF | Số trang:10

Thêm vào BST

Báo xấu

129
lượt xem 35
download

Download Vui lòng tải xuống để xem tài liệu đầy đủ

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

Chủ đề:

Bình luận(0) Đăng nhập để gửi bình luận!

Lưu

Nội dung Text: HTML and Web Design Secrets P2

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.
Chapter 1: Setting up a Master Toolbox 21 For information on Adobe Photoshop, please visitwww.adobe.com/. note 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 Free- hand (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 lighter- weight needs for vector drawing.
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. Web designers and developers using Linux platform and open source tip 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.
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 Commercial, low-cost product popular with many with 30-day demo, www.ulead designers .com/ga/runme.htm GIF Construction Set One of the oldest GIF Low-cost shareware, animators around for www.mindworkshop.com/ Windows alchemy/gifcon.html GIF Builder Very popular for Mac Low-cost shareware, OS 9 and earlier www.mac.org/graphics/ gifbuilder/ GIF Builder for OS X Mac OS X (will run on Freeware, Mac OS 8 and above) www.macupdate.com/info .php/id/235 GIF Merge Linux and related http://the-labs.com/ platforms GIFMerge/ The majority of Web designers, however, tend to use Adobe ImageReady for anima- tions. 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.
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.
Chapter 1: Setting up a Master Toolbox 25 Secret #12: Rename Utilities For the many Web designers working on a Windows 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 for Windows 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 per- form 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 spe- cial Web 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 ﬁles locally. To download A Better File Rename, see www.publicspace.net/ note ABetterFinderRename/. For the Web master program, visit www.publicspace.net/ webmasters/index.html.
26 Part I: Tools, Planning, and Content Secret #13: Tag Strippers Another important utility that you’ll want 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. Ex- amples 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 log- ical 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, low- cost 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 Windows, Linux Free under GNU license, www. Converter franksworld.net/httc/ Html2text Linux; command line Open source freeware, http:// in English and userpage.fu-berlin.de/ German ∼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 as HTML Tidy 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/.
Chapter 1: Setting up a Master Toolbox 27 Figure 1-21: Using Detagger to remove HTML tags. HTML Tidy is built into a wide range of shareware code editors and utilities. tip 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 to- day’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 on Web 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).
28 Part I: Tools, Planning, and Content Figure 1-22: Tidy literally “tidies up” your documents. Figure 1-23: Creating a zip format for downloadable media ﬁles. For Macintosh, a commonly used package is StuffIt, which is also available for Win- dows and Linux. It’s an excellent commercial choice—it’s low-cost, cross-platform compatible, and easy to use. You can find it at www.stuffit.com/. For a good graphical interface that provides multicompression, multiextraction on Linux, gnochive is available for free at http://gnochive.sourceforge.net/.
Chapter 1: Setting up a Master Toolbox 29 Secret #16: Audio and Video Players Audio players are necessary for Web designers who are both working with audio and video as well as visiting Web sites where forms of audio and video are in use. At this point, many audio players are also video players, as you’ll see. Many players are available these days. Table 1-8 provides a best-of-breed and most popular list. Table 1-8: Popular Audio Players Platform and Software Features Availability RealPlayer Windows, Mac, Plug-in Free and pay versions available for Linux. Support for all at www.real.com/ common audio and video formats with emphasis on Real streaming media and SMIL formats Apple QuickTime Windows, Mac. Support Free and pay versions available for all common audio and at http://quicktime video formats with an .apple.com/ emphasis on the QuickTime format Microsoft Windows Windows, Mac. Popular Available with Windows Media Player media player capable of Operating Systems and the IE supporting almost all Web browser and for download, audio and video formats, at www .microsoft.com/ emphasis on Windows windows/windowsmedia/ Media ﬁle format WinAmp Windows. Very popular Free and pay versions available media player with support at www.winamp.com/ for most media types An emerging alternative for multimedia is Ogg Vorbis, a project that is fully note open, nonproprietary, patent and royalty free, available at www.xiph.org/ ogg/vorbis/. Secret #17: Plug-Ins For a number of technologies, it’s helpful to have plug-ins already installed in your browsers. This helps you avoid having to download plug-ins for commonly used tasks.