网页原型设计工具设计

There are several ways to handle the graphics required for a Website. The first, and easiest, is to simply steal — er, "borrow" — them from other sites. Honest designers and cyberbanditos alike use this method, in lesser or greater form. In some cases, it’s not a problem. Either the Website owners don’t mind, or they’ve used graphics from freebie sites. In other cases, it’s no different than stealing a loaf of bread from the corner store. When in doubt, you should probably err on the side of caution and avoid using any graphics that aren’t explicity for public use (I’m currently preparing a column for SitePoint on this very topic, by the way). But no matter how you look at it, the copyright issues basically mean that your selection’s limited to images that other people have already used.

有几种方法可以处理网站所需的图形。 第一种，也是最简单的方法，就是从其他站点简单地窃取(即“借用”)它们。 诚实的设计师和网络匪徒都以或多或少的形式使用这种方法。 在某些情况下，这不是问题。 网站所有者不介意，或者他们使用了免费赠品网站中的图形。 在其他情况下，这与从街角商店偷一条面包没什么不同。 如有疑问，您可能应该谨慎行事，并避免使用任何不明确供公众使用的图形(顺便说一句，我目前正在为此主题准备SitePoint的专栏)。 但是，无论您如何看，版权问题基本上都意味着您的选择仅限于其他人已经使用过的图像。

The second method is to either have professional or amateur graphic designers make the graphics for you, or to download pre-made images from graphics sites that supply them specifically for this purpose. The third is to make them yourself. Here’s where many people who want a Website of their own fall short. Either they’re confused by sophisticated (read: "hard-to-use") commercial programs, or they’re foiled by the limitations of cheaper, less effective packages.

第二种方法是让专业或业余图形设计师为您制作图形，或者从专门为此目的提供图形的图形站点下载预制图像。 第三是让他们自己。 这是许多人想要自己的网站的地方。 要么它们被复杂的(读作：“难以使用”)商业程序所迷惑，要么被便宜，效果不佳的软件包的局限所挫败。

Two shareware programs on the market, My Web Toolbox 3.3 and Trellian Button Factory 2.02, fill part of the need. They provide an inexpensive way to create buttons and similar graphics for Websites. Neither one is as comprehensive, sophisticated, or expensive as the Photoshops, Paint Shop Pros, and Flashes of the world, and neither one attempts to be. Instead, they strive to do one particular thing, and do it well. How well they succeed, at least in my opinion, is considered here.

市场上有两个共享软件程序，即My Web Toolbox 3.3和Trellian Button Factory 2.02，可以满足部分需求。 它们提供了一种便宜的方法来为网站创建按钮和类似图形。 没有人能像世界上的Photoshop，Paint Shop Pro和Flash一样全面，复杂或昂贵，也没有人能做到。 相反，他们努力去做一件特定的事情，并且做得很好。 至少在我看来，这里考虑了它们的成功程度。

Note: These reviews appeared in earlier and slightly different forms as Newsletter #13 for my Web site, Troubleshooting and Resource Guide for Windows 95/98/ME, at www.toejumper.net. The newsletter was forwarded to both software creators for their responses, which have been incorporated here.

注意：这些评论以较早且略有不同的形式出现在我的网站上的新闻通讯＃13，Windows 95/98 / ME故障排除和资源指南中， 网址为www.toejumper.net 。 该新闻通讯已转发给两位软件创建者以征求他们的反馈，这些反馈已合并到此处。

My Web Toolbox 3.3 30美元 (My Web Toolbox 3.3 $30)

www.australianwineandbeer.com/mwt/toolbox.htm

www.australianwineandbeer.com/mwt/toolbox.htm

My Web Toolbox is the work of an Australian software creator, Ian Timmins. Ian markets MWT through a wine and beer site, which may be one reason why he doesn’t receive as much exposure as he might. That’s unfortunate, because MWT is a little gem of a program. He’s currently considering cranking up his attempts to market the program, and has one eye out for suitable business partners (a word to the wise, if you will).

我的网络工具箱是澳大利亚软件开发商Ian Timmins的作品。 伊恩(Ian)通过葡萄酒和啤酒网站推销MWT，这可能就是为什么他没有得到尽可能多的曝光的原因之一。 不幸的是，因为MWT只是程序的一个小地方。 他目前正在考虑加大对该程序的市场推广力度，并且正在寻找合适的业务合作伙伴(如果可以的话，这是明智的选择)。

To quote the creator, "The concept behind my button option is to offer a limited range of styles, but to make sure those styles can be created quickly and simply." Indeed the range of styles available in MWT is limited, but the creation of buttons and banners couldn’t be easier. I reviewed version 3.2, but version 3.3 is now available, and supports frames for animated banners. As noted on the site, MWT doesn’t create the actual animated graphics; you need a separate program for that function. Only GIF files can be animated, and MWT doesn’t support GIFs, for reasons detailed below.

引用创建者的话：“我的按钮选项的概念是提供有限的样式，但要确保可以快速简便地创建这些样式。” 实际上，MWT中可用样式的范围是有限的，但是创建按钮和横幅的过程再简单不过了。 我查看了3.2版，但现在可以使用3.3版，它支持动画横幅的框架。 如网站上所述，MWT不会创建实际的动画图形； 您需要该功能的单独程序。 仅GIF文件可以动画，而MWT不支持GIF，原因如下。

Installation

安装

MWT is quite well-featured for such a small download, and it’s easy to use as well. The program itself opens in a small toolbar that can be docked anywhere on the screen, keeping it out of the way until needed. It can also be reduced to an icon in the System Tray. MWT is simple to install and barely impacts your system: the program doesn’t intrude on the registry, the system configuration, or anything else. And, to uninstall it, simply delete the program from your hard drive. I appreciate this feature. I get irritated with programs that strew registry entries through your system, intrude on your Start Menu, rewrite your configuration files, and so forth. It isn’t necessary. As Ian says, "[P]robably my greatest hate with most shareware is when it deposits rubbish in the registry, which, usually, is never removed. I simply won’t run shareware now that requires installing." I like the way this man thinks.

MWT的下载量如此之小，它的功能非常强大，并且易于使用。 该程序本身在一个小的工具栏中打开，该工具栏可以停靠在屏幕上的任何位置，直到需要时才将其挡开。 也可以将其缩小为系统任务栏中的图标。 MWT易于安装，几乎不会影响您的系统：该程序不会侵入注册表，系统配置或其他任何内容。 并且，要卸载它，只需从硬盘驱动器中删除该程序。 我很欣赏这个功能。 我对那些在您的系统中散布注册表项，侵入您的“开始”菜单，重写您的配置文件等等的程序感到恼火。 没必要 正如伊恩(Ian)所说，“ [可能]我对大多数共享软件的最大讨厌之处在于，它会将垃圾存储在注册表中，通常这种垃圾永远不会被删除。我现在根本就不需要运行需要安装的共享软件。” 我喜欢这个人的想法。

What it Does

它能做什么

MWT creates, edits, and modifies images (buttons and banners) for Websites. Unfortunately, the program only creates BMP and JPG files, not GIFs. This is a loss, but the reasoning has to do with Unisys’s purported ownership of the GIF format and the possible legalities affecting programs that create GIF files without paying ransom to Unisys. The disadvantage of using BMP files on Websites is twofold: they tend to be much larger than comparable JPG and GIF files, and Netscape is twitchy about supporting them.

MWT为网站创建，编辑和修改图像(按钮和横幅)。 不幸的是，该程序仅创建BMP和JPG文件，而不创建GIF。 这是一种损失，但推理与Unisys声称的GIF格式所有权以及可能的合法性有关，这些合法性影响了创建GIF文件的程序而无需向Unisys支付赎金。 在网站上使用BMP文件的缺点是双重的：它们通常比可比的JPG和GIF文件大得多，而Netscape则不愿支持它们。

The MWT toolbar consists of twenty buttons, with more possibly being added in the future. Each button has its own function, and most are self-explanatory. The color selections are quite extensive, with the option to choose from 24-bit, HTML, browser-specific, and full-spectrum palettes. The icon button lets you view and create icon images. Conversion from BMP to JPG and vice versa is a one-button operation, as is:

MWT工具栏由二十个按钮组成，将来可能会添加更多按钮。 每个按钮都有其自己的功能，并且大多数都是不言自明的。 颜色选择非常广泛，可以选择24位，HTML，特定于浏览器的图像和全光谱调色板。 使用图标按钮可以查看和创建图标图像。 从BMP到JPG的转换是一键式操作，反之亦然：

• font selection and preview, 字体选择和预览，
• special character display, 特殊字符显示
• capturing and copying all or part of a screen, 捕获并复制整个或部分屏幕，
• slicing images into smaller chunks, 将图像切成小块，
• value conversion (binary, octet, decimal, and hex), and 值转换(二进制，八位字节，十进制和十六进制)，以及
• viewing files in ASCII and/or hex format. 查看ASCII和/或十六进制格式的文件。

The modification of previously created images isn’t quite as simple as creating your own buttons from "scratch" (which is actually creating buttons from templates), but there’s nothing difficult about doing either one. The only drawbacks to creating new buttons are the small number of templates available — basically ten basic shapes that can be altered more or less as desired — and the limitations on the size of buttons. Added attractions include the ability to create banners, composite images, and colorized HTML fonts (including spectrum and random colorizations). The templates are all rectangular or square, though the actual graphical designs are often circular, oval, and so forth. Background colors must be chosen carefully to closely match the Web page they will go on, as no transparency option is available (no GIFs, no transparency). You do have the ability to import your own background image for the button, and this might be a better way to integrate the buttons into your site (Ian says that he believes BMP files can be made transparent, by masking the bottom left pixel).

修改以前创建的图像并不像通过“从头开始”创建自己的按钮(实际上是从模板创建按钮)那样简单，但是做一个都不困难。 创建新按钮的唯一缺点是可用模板数量少-基本上十种基本形状可以根据需要进行或多或少的更改​​-以及按钮大小的限制。 增加的吸引力包括创建横幅，合成图像和彩色HTML字体(包括光谱和随机着色)的功能。 模板都是矩形或正方形的，尽管实际的图形设计通常是圆形，椭圆形等。 由于没有透明性选项(没有GIF，没有透明性)，因此必须仔细选择背景色以使其与将要运行的网页紧密匹配。 您确实可以为按钮导入自己的背景图像，这可能是将按钮集成到站点中的一种更好的方法(Ian说，他相信可以通过遮住左下角的像素使BMP文件变得透明)。

The Wrap-Up

总结

Overall, MWT is a small but excellent program that concentrates on a single task — button creation — and does it very well. That’s not exactly true: as Ian points out, "More users actually use the program for the colour selection options, rather than the button creation option. In fact, button creation came late in the development of the program (which started out simply as a colour selection program). But then the colour selection options aren’t restricted in the shareware version, whereas button creation is."

总体而言，MWT是一个小型但出色的程序，它专注于单个任务(按钮创建)，并且做得很好。 事实并非如此：正如Ian指出的那样：“更多的用户实际上将程序用于颜色选择选项，而不是按钮创建选项。实际上，按钮创建是在程序开发的后期出现的(起初是作为颜色选择程序)。但是在共享软件版本中，颜色选择选项不受限制，而按钮创建受到限制。”

More options than you would expect are available, and the additional capabilities of screen capturing, HTML colorization, and banner creation only add to this program’s value. The limited number of button templates is a concern, but not enough to warrant my steering you away from this program. My suggestion is to grab it and register it now, before some commercial entity scarfs up Ian’s little creation, adds some bells and whistles, and jacks the price up.

提供了比您预期更多的选项，并且屏幕捕获，HTML着色和横幅创建的附加功能只会增加该程序的价值。 数量有限的按钮模板是一个问题，但不足以保证我将您带离该程序。 我的建议是在某些商业实体掩盖Ian的小作品，增加一些风声和口哨声并抬高价格之前，立即进行注册并注册。

Trellian Button Factory 2.02 45美元 (Trellian Button Factory 2.02 $45)

www.trellian.com/tbf/

www.trellian.com/tbf/

Trellian is a well-known software development company, also based in Australia. Besides the Button Factory, they also market other Web tools, including an FTP client, a search engine submission utility, and an ecommerce platform. TBF is available as a free demo version, and as a fully functional registered version. The demo version times out after 30 days and does not allow you to save any images; in this sense, it is more of a trialware than a full shareware program. As the name says, this program does nothing but create buttons for Websites. It gives you plenty of styles and options to choose from, though as with My Web Toolbox, you’re limited to the templates provided (and this program provides a tremendous number). Trellian was also provided with the newsletter version of this review, and their response was simply, "Sounds good!"

Trellian是一家著名的软件开发公司，也位于澳大利亚。 除了Button Factory，他们还销售其他Web工具，包括FTP客户端，搜索引擎提交实用程序和电子商务平台。 TBF有免费的演示版和功能齐全的注册版。 演示版本在30天后超时，并且您无法保存任何图像； 从这个意义上讲，它更像是试用软件，而不是完整的共享软件程序。 顾名思义，该程序除了为网站创建按钮外什么也不做。 它提供了许多样式和选项供您选择，尽管与“我的网站工具箱”一样，您仅限于提供的模板(此程序提供了大量的模板)。 Trellian还获得了此评论的新闻稿，他们的回答很简单，“听起来不错！”

Installation

安装

TBF installs quickly, using a standard installation wizard, and can be uninstalled through the Add/Remove applet. Opening TBF gives you a full screen with a Daily Tip (which can be disabled) and two toolbars that feature many of the standard buttons we’ve grown accustomed to — New, Open, Cut, Copy, Paste, etc. TBF is not nearly as self-explanatory as My Web Toolbox, and may prove intimidating to the novice Web designer. To my eye, it has some of the look and feel of the big boys, particularly Paint Shop Pro – and those experienced with PSP, Photoshop, or another such program will feel more at home. Virtually no offline help is available: a link to the Online Manual sends you to a Trellian Website that provides a good amount of help. I strongly advise new users to go through this material first, as there’s plenty of helpful info and tips here, though not all of the options are satisfactorily explained. The toolbars at the top are somewhat dockable, though they can’t be dragged and dropped just anywhere. Additionally, a Properties menu is available by right-clicking, or through the top menu.

使用标准安装向导可以快速安装TBF，并且可以通过“添加/删除”小程序来卸载。 打开TBF可为您提供全屏的每日提示(可以禁用)和两个工具栏，其中包含许多我们已经习惯的标准按钮-新建，打开，剪切，复制，粘贴等。与“我的网站工具箱”一样不言自明，并且可能会对新手网站设计者构成威胁。 在我看来，它具有一些大男孩的外观和感觉，尤其是Paint Shop Pro –并且那些在PSP，Photoshop或其他类似程序上有经验的人会觉得更自在。 几乎没有脱机帮助：在线手册的链接将您带到Trellian网站，该网站提供了大量帮助。 我强烈建议新用户首先阅读此材料，因为这里有很多有用的信息和提示，尽管并不是所有选项都可以令人满意地解释。 顶部的工具栏可以停靠，尽管它们不能拖放到任何地方。 此外，通过右键单击或通过顶部菜单，可以使用“属性”菜单。

What it Does

它能做什么

Most of your work will be done in the main, blank space, called "the work bench." The program is template-driven; all of your work will be based on one template or another. You’ve got lots of options to change and modify the templates — size, shape, border, background color, etc. — from both the toolbar and the Properties menu, which are accessible by right-clicking. The templates themselves are varied and quite beautiful, with some very sophisticated graphic designs available (if I count correctly, this version comes with 125 selections). In addition to the fancier choices, some plainer, more basic templates are provided, including ones that are designed to fit in well with standard Windows, Mac, Linux, and Unix graphical schemes.

您的大部分工作将在主要的空白区域(称为“工作台”)中完成。 该程序是模板驱动的； 您的所有工作都将基于一个或另一个模板。 您可以从工具栏和“属性”菜单中找到许多更改和修改模板的选项，包括大小，形状，边框，背景色等，这些都可以通过右键单击来访问。 模板本身是多种多样的，并且非常漂亮，还提供了一些非常复杂的图形设计(如果我算的话，这个版本有125种选择)。 除了更好的选择之外，还提供了一些更简单，更基本的模板，其中包括一些设计用于与标准Windows，Mac，Linux和Unix图形方案完美结合的模板。

The easiest way to create a button is to open the Image Library (through Window, Show Library, which displays the entire library’s contents in a narrow right-side pane) and drag a selected button style onto the work bench. Once on the work bench, a button template can be modified and resized as desired. A full-color palette makes color choices very extensive and easy to work with. The program lacks a multiple undo, so you can only go back one step in the creation process. You can, however, use the Delete button to get rid of creations that you don’t want and start over with a fresh template.

创建按钮的最简单方法是打开图像库(通过窗口，显示库，该窗口在狭窄的右侧窗格中显示整个库的内容)，然后将选定的按钮样式拖到工作台上。 进入工作台后，可以根据需要修改按钮模板并调整其大小。 全彩色调色板使颜色选择非常广泛且易于使用。 该程序缺少多次撤消，因此您只能在创建过程中返回上一步。 但是，您可以使用“删除”按钮删除不需要的创作，并从新模板开始。

All the images are rectangles or squares, though many of the designs themselves are ovals, circles, arrows, and so on. You’ll have to assign a background color that closely matches your Web pages’ background color or image in order for the button to blend in, or import the same background image that you use in your Web pages. Note that the background color choice is reflected over the entire work bench, so don’t let that throw you.

所有图像都是矩形或正方形，尽管许多设计本身都是椭圆形，圆形，箭头等。 您必须分配一种与您的网页的背景色或图像紧密匹配的背景色，以便该按钮能够混合或导入与您在网页中使用的背景色相同的背景色。 请注意，背景颜色的选择会反映在整个工作台上，因此不要让它丢给您。

Like My Web Toolbox, TBF does not support GIFs. It does, however, support BMP, JPG, PNG, and PPM (Portable Pixelmap File) formats, along with the proprietory TBF format (primarily useful for saving works in progress). Since the program does not support GIFs, backgrounds can’t usually be transparent (PNG images can be variably transparent, but it isn’t a simple matter of clicking a button; see the PNG home site at www.libpng.org/pub/png/ for more information). I imagine Trellian’s rationale for not supporting the GIF format is similar to that of MWT’s creator. There is a transparency option in Properties, but this doesn’t make a color transparent in the accepted sense of the word; instead, it blanks out the entire template, leaving only the text and the background color.

像“我的网站工具箱”一样，TBF不支持GIF。 但是，它确实支持BMP，JPG，PNG和PPM(便携式像素图文件)格式，以及专有的TBF格式(主要用于保存进行中的作品)。 由于该程序不支持GIF，因此背景通常通常不是透明的(PNG图像可以可变地透明，但是单击按钮并不是一件简单的事；请访问PNG主页，网址为www.libpng.org/pub/ png /了解更多信息)。 我认为Trellian不支持GIF格式的理由与MWT的创建者相似。 “属性”中有一个透明度选项，但这不会使颜色在公认的单词意义上透明； 相反，它会清空整个模板，只保留文本和背景色。

It took me a while to figure out how to alter the text in a template. The instructions provided in the Online Manual are wrong, wrong, wrong — according to the instructions and the provided image, there’s a text box in the Toolbar that you can enter your new text into. Nope. However, what does work is to highlight the image and then double-click on it. Your image "disappears" and a blank, white field appears into which you can type your new text. Clicking outside the text field/image brings the image back, with your new text included. It is quite easy to change and resize your text, and you have a large number of fonts to choose from. As far as I can tell, the New Text option gives you a button with no graphics inside except for the basic background color — a useful choice for Web designers who know what to do with such an option (and similar to the Transparency option detailed above). TBF does not provide for banner creation per se, but with the Resize option, I see no reason why you can’t make a button big enough to serve as a banner image.

我花了一段时间才弄清楚如何更改模板中的文本。 在线手册中提供的指示是错误，错误，是错误的-根据指示和提供的图像，工具栏中有一个文本框，您可以在其中输入新文本。 不。 但是，有效的方法是突出显示图像，然后双击它。 您的图像“消失”，并且出现空白的空白字段，您可以在其中键入新文本。 在文本字段/图像之外单击将带回图像，其中包括新文本。 更改和调整文本大小非常容易，并且您可以选择多种字体。 据我所知，“新文本”选项为您提供了一个按钮，除了基本的背景颜色外，该按钮内部没有任何图形-对于知道如何使用此选项的Web设计人员来说，这是一个有用的选择(类似于上面介绍的“透明性”选项) )。 TBF本身不提供横幅创建，但是使用“调整大小”选项，我看不出为什么您不能将按钮做得足够大以用作横幅图像。

TBF gives you a straightforward way to create clickable image maps, as outlined in the Manual. However, from what I can tell, you can only assign a single URL to a particular image — no slicing an image into chunks and assigning different URLs to each piece.

如《手册》所述，TBF为您提供了一种创建可点击图像图的简单方法。 但是，据我所知，您只能将单个URL分配给特定图像-不能将图像切成块并为每个图像分配不同的URL。

Saving a creation is a bit tricky; choosing Save As only allows you to save the button as a .TBF file. If you highlight the button and choose File, Export, you can choose from the other four formats. Again, a study of the Online Manual is helpful here. Some of the fancier options, such as choosing grid size, creating new frames, etc., aren’t well explained; you’ll either have to figure them out on your own or extrapolate their meaning from your knowledge of other graphics programs.

保存创意有点棘手； 选择另存为仅允许您将按钮另存为.TBF文件。 如果突出显示该按钮并选择“文件”，“导出”，则可以从其他四种格式中进行选择。 再次，对在线手册的研究在这里很有帮助。 一些较高级的选项，例如选择网格大小，创建新框架等，并没有得到很好的解释。 您要么必须自己弄清楚它们，要么根据对其他图形程序的了解来推断它们的含义。

The Wrap-Up

总结

In summation, Trellian’s Button Factory is an excellent program that can create sophisticated Web buttons quickly and with minimal effort. The learning curve is steeper than with My Web Toolbox, but the program gives you some functions and options that MWT lacks. I’m not altogether happy with the sometimes counter-intuitive way the program is set up to operate, and I’m disappointed in the Online Manual’s lack of documentation on a number of features. However, the program does what it sets out to do very well. The huge variety of button templates and sophisticated array of tools makes the Button Factory a worthwhile purchase for serious Web designers.

总而言之，Trellian的Button Factory是一个优秀的程序，它可以快速，轻松地创建复杂的Web按钮。 与My Web Toolbox相比，学习曲线要​​陡峭，但是该程序为您提供了MWT缺少的一些功能和选项。 我对程序运行时有时会违反直觉的方式感到完全不满意，并且对《在线手册》缺少许多功能的文档感到失望。 但是，该程序可以很好地完成设置。 按钮模板的种类繁多和复杂的工具使Button Factory对于认真的Web设计人员来说是值得购买的。

翻译自: https://www.sitepoint.com/web-design-tools-down-under/

网页原型设计工具设计