Computer Tips

 
Visit us often.  Computer tips updated daily.  Click here to--> "Tell a friend" so they can get updated computer tips, too.  Please visit our clients, as they support the computer tips page.

If you would like to submit a tip send us an email with your tip to info@businesswebsitelinks.com.
  ______________________________________________________________

Eliminate accessibility issues by avoiding this commonly misused tag

• The <blockquote> tag is commonly misused to indent text. Its primary function is actually to classify a block of text as a quotation. So, if you’re using <blockquote> for indenting your text, be warned. Browsers will display the text as merely indented, while screen readers will render the text as a quotation, thus confusing the users who rely on such mechanisms to access your site’s content.

Save page loading time by sitting at a shorter table

• From a design standpoint, you may often like to include the contents of a page within a single table. However, doing so can slow down the time it takes for your Web page to appear to your viewers. Surely you've noticed pages where nothing happens and then all of the sudden, the entire page appears. That's because the contents within the table won't be displayed until the entire table is downloaded.
• To rectify the situation, try splitting the page into separate tables. That way, the top tables will appear for the viewer to browse while the other tables render.

Follow this quick usability rule to save users from unnecessary frustration

• You may have heard of the three clicks rule:
  • Don't make the user click more than three times to get anywhere important.
  • But, if you really want happy users, follow the information parity rule:
  • Don't require any more clicks or other information from the user than a logician would require to deduce exactly where the user wants to go.
• For instance, suppose your website sells bus and boat tours to various destinations. If the user selects Hawaii, presumably you only offer boat trips, not bus trips. So, don't send him to a menu where he has to click on a link that says By Boat. Just send him through to the Hawaii Boat Trip page, since that's the only possible option.
• Of course, you may wonder what the big deal is if the user only has to click three or fewer times. The problem is that users can be annoyed if they think that the clicks or information being requested are unnecessary. All the rationalization in the world means little if the user intuitively knows there's a better way.

Make your CSS code more compact by turning properties off instead of on

• Many of us are used to turning properties on in standard web coding languages. As a result, you may use these same coding practices with CSS. For instance, if you want a three-sided border around all <div> elements, you might set the border property for three sides individually, like so:
  • div {border-left:solid; border-right:solid; border-bottom:solid}
• In CSS, however, because of the cascade effect, it's often more efficient to turn properties off, as in:
  • div {border:solid; border-top:none}
• While our simple example might make it seem like a small benefit, in larger stylesheets it can make the difference between compact and bloated declaration sections.

Control the style of links with CSS pseudo-classes

• For anchors, CSS offers the pseudo-classes :hover, :visited, and :link. These classes let you style the three stages of a link. Use :link to style the link before the user activates it. Use :hover to style the link when the cursor hovers over it, and use :visited to style the link after the user visits it. Typically, you'll use all three classes in tandem, like so:
  • a{border:solid}
    a:visited {border-color:blue;}
    a:link {border-color:blue;}
    a:hover {border-color:red;}
• In IE browsers, though, the :hover pseudo-class won't work unless it follows the :visited class. For maximum browser compatibility, it's smart to place :hover at the end.

6 expert tips for creating HTML emails

• Since most modern email clients have the ability to display emails as full HTML documents instead of plain text, there's no reason not to take advantage of this option. When you do create HTML emails, however, keep these following tips in mind:
  • 1. The offer's landing pages should be designed in a clean, yet inviting way. Don't get too carried away with graphics. Make sure your design maps to the medium.
  • 2. Integrate the look and feel of your website into the message's design. The more your email ties in with your website, the more comfortable and familiar it appears to its recipients.
  • 3. Keep it simple. Concentrate on one topic at a time, and avoid complex HTML tags, Flash, nested tables, or JavaScript.
  • 4. Send multiple formats. You should have a version created just for AOL, a text version, and an HTML version.
  • 5. Use tables to organize information. Stack multiple tables to keep things neat; don't nest tables within tables. Also, while many email clients accept HTML emails, they may not fully support CSS.
  • 6. Email should be opt-in, not unsolicited. Also, explain why the customer is receiving the email, and offer him the opportunity to opt out.

Create more accessible web pages by controlling negative space

• Using negative space properly is vital to print design, but many web designers seem to have forgotten this timeless rule. When text and images are jammed together, it makes the site less useable. By properly applying negative space to your web designs, you'll be able to improve your design and make it easier for the user to enjoy your content.
• To help you better employ negative space in your web designs, we'll:
  • Review the valuable concept of designing with negative space.
  • Explain how negative space can improve the overall appearance and accessibility of your websites.
  • Provide you with a few tips on how to easily add negative space to your designs.
  • Read More About This Tip Click Here > Web Design Tips

Effectively communicate by learning to write for the web

• While we'd like to think that people come to your site just to see the snazzy design, the truth is most people come to your site for the content. By learning how to write good content, you can make sure that your viewer is satisfied and that her information needs are met.
  To help you effectively communicate to your audience through writing, we'll:
  • Review some simple steps you can follow to make sure your writing attracts readers.
  • Examine how web writing is different than any other medium so you can clearly convey your ideas to readers.
  • Show you how you can unify writing and design to avoid confusion for the reader.
  • Read More: Web Design Tips

Know the relationships between major search engines

• The search-engine landscape shifts more frequently than the Billboard music charts. Not only do new search engines like Google rise to prominence, but the relationships between various search engines change constantly. Rather than create their own databases of web content, many companies now buy their results from other companies—even from competitors. Paid search services like Overture and Google AdWords (where companies pay to appear in search results) further complicate the situation.
• Understanding where search results originate is important when you’re trying to get your site listed. A great tool for understanding search relationships is Search-This’ Search Engine Decoder, located at www.search-this.com/search_engine_decoder.asp.
• The decoder displays 19 different companies and organizations involved in web searching. When you click on one of the entities, color-coded arrows appear, indicating how that entity is related to the others. You can then determine where you need to submit your site in order to get it listed in your favorite search engine.

Build a strong foundation in web layout trends to attract viewers

• What began over a decade and a half ago as an interesting experiment has evolved into a major worldwide communication tool. As the functionality of the World Wide Web matures, so too have the viewers who use it. By staying current with ever evolving layout trends, you can keep viewers happy and coming back for more.
• To help you design for ever changing web trends, we'll:
  • Use a hypothetical case to demonstrate the importance of understanding web trends.
  • Explain the origins of the World Wide Web and how evolving web technology has played a part in shaping expectations of viewers.
  • Look at the present state of the web and the trends that affect today's web layout designs.
  • Read More: Web Design Tips

Tip: Consider Flash when you need audio on your website

• Sooner or later, you’re going to be asked to create a site that uses audio of some sort—whether it be the spoken word or musical arrangements. The problem you’ll then have to consider is what format you’ll use. Might we suggest Flash?
• Flash is the only cross-platform solution that will allow the largest majority of users to share the same experience. It doesn’t require the viewer to purchase anything to listen to the items on your site and it doesn’t require a special server configuration.
• Sure, you could argue that Real Player or QuickTime are specifically designed for streaming sound on a website. The problem is they still don’t reach the level of ubiquity that Flash enjoys. If we’re to believe the folks at Macromedia, Flash Player is reportedly installed on 95 percent of all computers. Although this number is probably a little higher than reality, the software does indeed have a large chunk of the rich media market. And since it supports MP3s without an external player, it’s even more powerful.
• To convert the sounds into a SWF format, you’ll need a small utility called Boomer that allows you to convert WAV and MP3 files by simply dropping the file onto the utility. Boomer, which sells for $49.95, is available from CrazyIvan at www.gfx2swf.com.

Tip: Use xsl:value-of to retrieve attribute values for output

• A valuable method for retrieving attribute values to output their contents is with the xsl:value-of element. For example, your XML document has an element called biblioref, which has a sequence attribute:
  • <para>This is a bibliography reference.<biblioref sequence="1">.</para>
• You want to output that attribute as a superscripted number in HTML on your web page:
  • This is a bibliography reference.1
  •  
  • Use xsl:value of in your XSLT stylesheet to retrieve and output the attribute, like so:
    • <xsl:template match="biblioref">
    • ^{• <xsl:value-of select="@sequence"/>
    •}
    • </xsl:template>
• This XSLT rule says to match the biblioref tag, output the open ^{tag, output the value of the sequence attribute, and then output the close} tag.

Tip: Don't forget customer service on your eCommerce site

• One of the most important aspects to keep in mind when running an eCommerce site is customer service. Without it you risk losing both new and repeat customers. In fact, close to 20 percent of all customers use customer service before making a purchase. When we speak of customer service, you probably envision a dimly lit room full of people answering a bank of phones and diligently typing out messages on their computer keyboards. While that may be the case for some sites, don't forget that often customer service need be little more than a well-written list of frequently asked questions, known in the Web biz as FAQ. This collection of documents should represent 95 percent of all possible answers a customer might have before or after ordering your product or service. In fact, a good way of creating these documents is by compiling the actual questions of your current customers.
• You should also consider implementing an online forum that's staffed by a customer service representative. The answer to a single question in a forum can often help a number of customers. Also, don't forget to routinely peruse the forum for possible additions to the FAQ. While you can also use email as a source for customer service, it includes a number of drawbacks. For starters, it doesn't work well with the instant gratification that the Web shopper is looking for. If a customer has a question about a product or service and can't find it on your site, she may go elsewhere to satisfy her needs.
• Further, even with an auto-responder that informs the customer that her message was received and will be replied to shortly, the customer is likely to be a bit skeptical that a human will actually read, much less respond to, her inquiry. If you do choose to include email in your customer service arsenal, consider setting up a form to collect the question. That way you can increase the possibilities that the customer will include all the pertinent details.
• Finally, you should consider real-time chats as a way to guide customers through the purchase process. It provides them with answers in a timely manner and is relatively simple for you to implement. And often, rather than going into detail, a sharp customer service rep can route them to the pertinent section of the FAQ.
• Remember that your goal is to build a relationship of knowledge and trust with your customers. By blending several sources of customer service, you can do just that.

Tip: Transform element names without losing attribute values

• It's possible to transform your element names without losing the attribute values associated with the original tag name. For instance, if you want to change the following element:
  • <name id="z0001">...</name>
• into this new element:
  • <EmployeeName id="z0001">...</EmployeeName>
• but retain the "id" attribute and its value, you can add a template rule to your XSLT stylesheet like so:
  • <xsl:template match="name">
  • <EmployeeName id="{@id}">
  • <xsl:apply-templates/>
  • </EmployeeName>
  • </xsl:template>
• This template matches on the <name> tag and replaces it with an <EmployeeName> tag. The "id" attribute does have to be added manually, but the attribute *value* is carried over from the original attribute. That's what the "{@id}" does. It identifies the value of the initial "id" attribute and applies it to the specified location.
• This is true even if you decide to change the attribute name like so:
  • <xsl:template match="name">
  • <EmployeeName code="{@id}">
  • <xsl:apply-templates/>
  • </EmployeeName>
  • </xsl:template>
• In this template, the "id" attribute name is changed to "code", but the value of the original attribute is retained. So,
  • <name id="z0001">...</name>
• becomes:
  • <EmployeeName code="z0001">...</EmployeeName>

Tip: Save page loading time by sitting at a shorter table

• From a design standpoint, you may often like to include the contents of a page within a single table. However, doing so can slow down the time it takes for your Web page to appear to your viewers. Surely you've noticed pages where nothing happens and then all of the sudden, the entire page appears. That's because the contents within the table won't be displayed until the entire table is downloaded.
• To rectify the situation, try splitting the page into separate tables. That way, the top tables will appear for the viewer to browse while the other tables render.

Tip: Find the web tools you need to enhance your web presence

• In our ongoing effort to help you find the tools you need to simplify the website creation process, we stumbled across some web building tools worth checking out.
• Caspio
  • Caspio Bridge eliminates the need for a strong programming background to build complicated web forms, data searches, reports and web applications. It lets you create web database applications with the use of step-by-step, point-and-click wizards. (www.caspio.com)
• Newgie, LLC
  • Newgie has a free service that makes it easy to import updated news headlines into websites. When the Newgie JavaScript code is placed on a website, the latest headline news is automatically streamed onto the website. You can choose from a variety of topics. (www.newgie.com)

Tip: Direct non-technical folks to this easy service for updating web pages

• Sometimes friends, acquaintances, or fellow employees hear that you’re a web developer and ask for your assistance. But you may find that all they really want you to do is make trivial edits to their web pages that someone else had originally created for them. If you’re not looking for extra work—or are annoyed by too many such requests—you may want to help these folks become more self-sufficient.
• To do so, you might recommend that they try web design programs such as Microsoft Front Page and Adobe GoLive. However, if they need extra assistance or don’t want to purchase software, another option for them is Edit.com (http://www.edit.com). This site gives them a very simple GUI approach for editing their page in a browser—and it even handles uploading the changes to the web server. Edit.com offers pay-as-you-go, monthly, and yearly payment plans, as well as custom web development services.

Tip: Know when NOT to include a unit of measurement with CSS

• It isn’t always necessary to include a unit of measurement when coding CSS values. Whenever you have a value of zero—whether it’s pixels, points, cm, mm, or ems—you can simply leave the measurement unit out of the code. For example, the style definition for the body tag shown here:
  • body {width:100%; height:100%;margin: 0px 0px 0px 0px;}
  •  
  • can be written like this instead:
  • body {width:100%; height:100%;margin: 0 0 0 0;}
• With the value of zero, nothing equals nothing, no matter what the unit of measurement.

Tip: Use FILExt to figure out that mysterious file extension

• Chances are you’ve been emailed an attachment with a file extension you’ve either never seen before or are a bit suspicious of. Since file attachments can carry computer viruses, it’s a good idea to make sure you know what kind of file you’re launching before you click on it. A good place to check is at FILExt (www.filext.com), which has a database of thousands of file extensions and detailed information on what they do and which applications are needed to launch them. For example, let’s say your friend emailed you a picture, but it has the file extension .fpx. A quick look on FILExt Web site reveals that this file extension denotes a FlashPix format, which is an early image format for Kodak digital cameras. So, instead of blindly clicking on the file and hoping for the best, you now know this file is most likely safe.

Tip: Browse for audio files on FindSounds.com

• Most Web users are experts at searching for information on the Web and some even know how to use specialized sites for searching images, but did you know you could also search for sounds? Using the free search service at www.findsounds.com, you can find sound files for almost anything you can think of, from animal noises to musical instrument samples. You can search by sound type, file format, sound quality, or file size, so you have plenty of ways to customize a search and find the perfect sound. Take note that this isn’t a file-sharing site for finding MP3 files of the latest chart toppers, but it’s a place to find sound effects for your next Microsoft PowerPoint presentation or multimedia project.

Tip: Find out who has a link to your home page

• Ever wonder who’s linked to your Web site? Just go to www.altavista.com/web/webmaster. As you can see, this page uses the powerful engine technology of AltaVista to perform some helpful searches. The first search simply displays all the links that AltaVista has to the pages in your Web site. The second option allows you to locate pages that link to your site.
• The only drawback is that these searches only reveal referring pages registered to the AltaVista search engine. This isn’t really that bad, considering that AltaVista is one of the more encompassing search engines available.

Tip: Test your Flash movies on low-end machines for backward compatibility (Flash MX/MX 2004)

• Throughout the process of creating your Flash movie, you undoubtedly test it to check your progress. But don’t forget that not everyone is sporting top-of-the-line multi-gigahertz processing power over a T3 line. There really are folks out there still using dial-up on 10-year-old computers. So, get your hands on an older machine and test how it renders your Flash movies. This will give you a better indication of how your movie will render to those who still receive their internet information at a snail’s pace.

Tip: Create evenly sliced slices in Photoshop (7/CS/CS2)

• If you’re a Photoshop slicer and dicer, there may come a time when you’ll want all of your slices in an image to be equal. For our example, we’ll slice an entire image into 25 equal slices.
  To create equal slices:
  • 1. Open an image in Photoshop.
  • 2. Select the Slice tool from the Toolbox.
  • 3. Create one initial slice on your image that is the total size you want all of the subsequent slices to encompass.
  • 4. Choose the Slice Select Tool which is just beneath the Slice Tool in the Toolbox.
  • 5. Click on the Divide Slice button on the tool options bar to display the Divide Slice dialog box.
  • 6. Select the Divide Horizontally check box, and enter 5 in the slices down evenly spaced text box.
  • 7. Select the Divide Vertically check box, and enter 5 in the slices across, evenly spaced checkbox.
  • 8. Click OK and your image will be sliced into 25 evenly spaced slices.

Tip: Look up special characters, symbols, and entities for XML and web pages

• Parsed character entities are often useful to represent special symbols in HTML and XML. For example, you can use the named character entity &trade; to represent the trademark symbol (™). The following line illustrates an entity declaration for the trademark character in a DTD for XML code:
  • <!ENTITY trade "&#38;#x2122;"> <!-- TRADEMARK SIGN -->
• In this example, the name of the entity is trade. The hexidecimal value of this entity is 2122. Complex schemas and DTDs often include hundreds of entity declarations for special characters and symbols that you’re liable to use in XML instances.
• At the end of the next paragraph, if the characters in the parentheses don’t come out right in InDesign, make them into an upside-down question mark and a square box. You may want to make the box wider than I have here, since what I was able to produce in Word looks more like a rectangle than a square.
• You may come across character entities in your code that you need to identify or troubleshoot. For example, special characters that don’t render properly by an application often come out as upside-down question marks (¿) or square boxes ().
• To troubleshoot problems with special characters, a number of resources are available to you on the internet. The Unicode website (www.unicode.org) offers resources and information for thousands of different languages and symbols.
• If you’re having problems with a character rendering properly, you can troubleshoot in a number of different ways—for example:
  • You can open the XML file in a Unicode-aware text editor. Is the symbol declared and referenced as a named character entity (&trade;) or the encoded character (™)?
  • Open the XML file in a hexadecimal editor and locate the problem character. Record the hex value for the character that isn’t rendering properly and look it up online. Is the hex value correct?
    We suggest you use named entities in your source XML because it allows you greater control of the encoding in your output.
    For more resources, point your favorite web browser to www.zvon.org and click on Character Search. The Zvon Character search allows you to search for special symbols in a number of ways, including entity, hexadecimal, or decimal values.

Tip: Mondays equal money days for online shopping sites

• If you aren’t seeing a flood of online shoppers at your website on Monday afternoons, you should be. A recent study reveals that Mondays are the busiest online shopping days for the third year in a row. The study, conducted by Atlas Solutions, looked at consumers’ online shopping behaviors at 96 leading eCommerce sites during holiday seasons.
  The study concludes the following best practices for online marketers:
  • Create a Monday afternoon campaign online to match the previous weekend’s in-store promotion.
  • Target the workweek lunch hour (noon to 3 p.m. EST) because that is typically when consumers buy.
  • Anticipate higher click volumes during Monday afternoons and be sure that any related marketing campaigns remain focused on converting browsers to buyers.
• Read the complete study at http://atlassolutions.com/pdf/2004-2005HolidayDMI.pdf. For similar marketing studies, go to http://atlassolutions.com/insights.

Tip: Use Flash for better looking text in Dreamweaver (MX /MX 2004)

• When designing web pages, take into consideration your text appearance. For logos and other text that use special or specific fonts, images are best for consistency among web browsers. A great option in Dreamweaver is to create Flash text objects. To do this, first make sure you save your file. Next, click on the Media tab on the Insert toolbar and then click the Flash Text button. Whatever fonts you have in those pieces of text will be what are displayed in your users' browser.

Tip: Insert a jump menu in Macromedia Dreamweaver (MX/MX2004)

• Macromedia calls menus containing a list of URL's jump menus. To create one, select Insert > Form (Form Objects in MX) > Jump Menu. You might wonder why the Jump Menu option is included in the Forms section. This is because earlier versions of Netscape won't recognize the element as a pop-up menu unless it's included in a form.

Tip: Using Snippets in Adobe GoLive (6/CS/CS2)

• Snippets are pieces of a web page that you can use over and over again throughout your website. Examples of snippets are a company logo, address, a piece of JavaScript, or a table of data. Since these objects rarely or never change, why copy and paste them each time you create a new page? By turning these objects into snippets, you can reuse them throughout the site simply by dragging them onto a page. Keep in mind if you edit a snippet after you've placed it in several web pages, the changes won't affect the pages on which the snippet was already used.

Tip: Be concise and to the point when writing for the web

• Say only what you need to. There's no reason to use several paragraphs when a single well-written sentence can convey a thought. Also, as a designer, don't be afraid to use images, colors, and design elements to help convey a message. This also brings up an interesting design point. To be effective, the design of your site shouldn't strongly dictate the amount of content needed in each section. When possible, the content and design should be able to stand independently of each other.

Tip: Create a quick glow effect with the Soften Fill Edges feature in Flash (MX/MX2004)

• You can use the Soften Fill Edges feature to make a glow effect. First, launch Flash and create a new movie. Type a word on the Stage and make it large enough so it's easy to work with. Next, copy your text by selecting it and choosing Edit > Copy. Then, paste it exactly where you copied it by selecting Edit > Paste In Place. Change the color of your text to something that looks radioactive, like a bright orange or green, and break your text apart by pressing [Ctrl]B ([command]B on the Mac) twice to fully transform your text into shapes. Then, open the Soften Fill Edges dialog box (Soften Edges in version 5) by selecting Modify > Shape > Soften Fill Edges. The values you choose depend on the size of your text. For our 72-pixel text, we set the Distance text box to 10 px, the Number Of Steps text box to 20, and selected the Direction Expand option button. You want the glow to extend far enough from your object to be easily visible, with enough steps to create a soft edge. Click OK to apply the effect and then select Edit > Deselect All to remove the highlighting.

Tip: Designing for space using white space

• It's important to remember that white space (also known as negative space) isn't just a background or afterthought--it's an important part of the design. By reducing the superfluous elements on your web page, you also strengthen the visual impact of your message--you actually get your point across better with fewer words and images. When you pay attention to the spatial relationship between elements, you can make your page flow better, actually leading the viewer's eye from section to section. This space isn't just the area between graphics; it's also the letter and paragraph spacing, margins--everything on the page.

Tip: Precisely place items on your layout grid for accuracy in Adobe GoLive (6/CS)

• The Layout Grid feature in GoLive has always allowed you to create very precise table layouts. With GoLive 6 and CS, the Layout Grid now has an extra bonus which adds more control over your layout. The feature makes it even easier to assemble your designs just how you envision them. It makes it easier to place content exactly where you want on the layout grid.
• To begin using this feature, click and hold the Layout Grid tool from the Objects palette until it turns into a hand. Then, drag the grid onto your web page. Once the layout grid is in place, click on it and use the arrow mouse pointer to target an intersection. Click on the intersection and notice the flashing insertion point. Now, when you double-click on an object in the Objects palette, the top-left corner of the new object will align with the flashing insertion point. What an easy and precise way to place your web content on a web page!

Tip: Determine the size of your movies before you export them (Flash 5/MX/MX 2004)

• Ever wonder how large your Flash movie is before you export it?  To find out what elements are being included in the file and their size, save the file and then choose File > Publish Settings.  Next, select the Flash tab in the Publish Settings dialog box and select the Generate Size Report check box in the Options section.  Then, click the Publish button.  Flash will automatically create a report in the same directory as the Flash file.  In that text file, you'll find that it lists each element included in the exported file as well as its size.

Tip: Pique people's interest when writing for the web

• Once a viewer has visited your site, try to keep him there. Use headings that draw the reader into the web page. Don't be afraid to be clever with your headlines. Also, make the headings descriptive. For example, "Improve your image by integrating dynamic data into your web design" will tell the reader more and draw him in more than simply "Designing dynamically."

Tip: Test your movies using the slowest common denominator (Flash 5/MX/MX/MX 2004)

• If you're designing a relatively complex Flash movie, you want to make sure you've optimized both the download requirements and the processor requirements.  For example, you don't want a file to begin playing and then include an action that requires increased processor power.  That might cause the movie to stutter or stop playing altogether.
• Although you can get a good idea of how long it will take to download a file, it's difficult to determine how it will play on an older computer.  So, what's the solution?  Test your Flash movies on that old computer sitting in your closet.  That way, you can make sure you won't be taxing the computers of your targeted audience.

Tip: Judiciously remove Flash symbols (5/MX)

• Normally, when working on a Flash presentation, you try several different graphic symbols along the way.  The problem is that you probably never remove the unused symbols from the file, fearing that you'll accidentally delete a symbol that you've used.  To avoid this Flash faux pas, simply choose Select Unused Items from the Library panel's pop-up menu.  It selects only those symbols that weren't used so you can quickly delete them.

Tip: Toggle easily between modes in Dreamweaver MX

• Here's something not everyone knows about or will easily discover in Dreamweaver MX. There's an inconspicuous little button in the Properties inspector that can help those who work with CSS (Cascading Style Sheets). When you have the Property Inspector open, select some text by highlighting it. Then, click on the "A" on the inspector. This button is called the Toggle CSS/HTML Mode button. The Property inspector changes modes so that only CSS styles can be added to the text, rather than the standard font tags, sizes, and so on. This is an easy way to work for developers creating sites with only CSS elements.

Tip: Use CSS and Dreamweaver to highlight text (4/MX)

• Want to highlight a line or two of text so that viewers will quickly take note?  Cascading Style Sheets (CSS) make it very easy to add this visual cue to a page.  To do so in Dreamweaver, open a document that contains text you want to highlight and then choose Window > CSS Styles to display the Design panel.  In that panel, select CSS Style (if it's not already selected), and then choose New CSS Style from the Design panel's pop-up menu.
• Name the new style .highlighter and keep the other default options by clicking the OK button.  Now, in the CSS Style Definition dialog box, choose Background from the Category list and choose a yellow color from the Background Color swatch pop-up (or you can choose a color that goes better with your color scheme).  Then, just click the OK button.  With the style created, all you need to do to add the effect is select the text with the mouse pointer and choose Highlighter from the CSS menu.  When you do, the text looks just like someone's highlighted it with a highlighter marker.

Tip: Find out who has a link to your home page

• Ever wonder who's linked to your Web site?  Just go to http://www.altavista.com/web/webmaster.  As you'll find, this page uses the power engine technology of Alta Vista to perform four very helpful searches.  The first option simply displays all the links that Alta Vista has to the pages of your web site.  The second option allows you to located pages that link to your site.  The third option allows you to locate sites similar to your own, using the name of the domain, along with keywords specific to your site.
• The only drawback is that these searches will obviously only reveal referring pages registered to the Alta Vista is one of the most encompassing search engines available today.

Tip: Display the text first

• It's always a good idea to specify the dimensions of all the graphics you have on a page.  For instance, instead of just naming the graphic, be sure to include its height and width.  That way, the text will load immediately, allowing the viewer to begin reading while the graphics download.

Tip: Soak up the knowledge with Macromedia On Demand

• In several tips, we've rallied around Flash, explaining what a great tool it is to use to design instructional material.  However, what we didn't comment on was the fact that Macromedia, for whatever reason, chose not to use it on their site to promote their own products.  Fortunately, they've come around.  You can now review the capabilities of each product direct from their Web site by pointing your browser to http://www.macromedia.com/macromedia/events/online/ondemand.  Once you register as a Macromedia user, you can view informative multimedia presentations about the abilities of each of their major products.

Tip: Don't forget your Web site when you're doing your spring cleaning!

• A sparse server is a fast server and the fewer files you have on the server, the less space you have to pay for.  That's why it's important to routinely review your Web site to look for cobwebs and dust bunnies.  To make sure you're running lean and mean, consider the following as a standard regimen:
  • * Synchronize your Web site using the features in either Macromedia Dreamweaver or Adobe GoLive.
  • * Make a backup of your current Web site on CD or DVD.
  • * Review the site and remove old, unused files.
  • * Browse through the site and locate items that need to be changed.  Areas of concern should be the Contact Us or About Us page, any copyright or dated notice, or outdated meta tags.
  • After cleaning up your document, check for any directories that you've emptied.  Chances are, these folders can be deleted without causing future problems.

Tip: VB .NET restricts textbox height changes to multi-line textboxes only

• If you liked drawing textboxes of any size and shape on your VB 6 form, you'll have to take an extra step to do the same in VB NET.  It locks the standard textbox height at 20 pixels.  If you want to change the height, you'll have to set the textbox Multiline property to True.

Tip: Timesaving keyboard shortcuts for GoLive CS (Microsoft Word, Adobe Golive CS)

• GoLive CS has hidden shortcuts that aren't documented in the Help files. Here's one that may help you. When pasting, stylized text from Microsoft Word to GoLive, hold down the [Shift] key while choosing Edit > Paste from the menu bar. Text styles such as font-size, font-family, and margin are retained.

Tip: Basic rules of Web survival

• If you were asked to concisely say what a Web site should be, what would you say?  Though it can be many things to many people, a Web site should be easy to find, simple to navigate, easy to read, quick to download, consistent, and informative.  Everything else is just icing on the cake.
• Review your site and see if these characteristics apply to it.  If not, you can either argue with our simplification, or get working on your site.  We hope you won't be too busy!

Tip: Troubleshooting FTP Connections (Adobe GoLive 7/CS)

• In GoLive, if you're having problems connecting to a server, check to see if Passive Mode is turned on in the server settings. To do this, select Edit > Serve (GoLive > Server on the Mac) and select the Passive Mode check box in the FTP Options area. This usually solves the connection troubles, especially if you can connect to the server but can't see the file list.

Tip: The difference between Java and JavaScripts (N/A)

• For those who aren't familiar with programming and are strictly WYSIWYG web designers, did you ever wonder what the difference between Java and JavaScripts are? Unlike Java, JavaScripts are composed of code embedded in a web page. They're scripted actions used for image effects or Dynamic HTML (DHTML) functions. Java applets are actually programs that are run on the web server with output sent to a web browser.

Tip: How to get a great feel for Web Design

• If you're looking for a great way to introduce someone to Web design--sort of give her a jumpstart to design, there's no better way than to give her a copy of Lynda Weinman's "Designing Web Graphics" (ISBN #1-56205-532-1).  When it was first released in 1996, the book was the end-all, be-all of Web design.  Although Web design has changed dramatically over the last five years or so, the concepts introduced in her book have not.

Tip: Be organized when you separate tweened instances (Macromedia Flash MX/MX 2004)

• When separating tweened instances onto their own layers, you may end up with a large amount of layers on the Timeline. Use a Layer folder to help organize the layers. Click the Insert Layer Folder button on the Timeline to create a new folder. Then, drag all the similar layers on the Timeline into that folder. This allows you to expand and contract the folders in your Timeline and, in turn, will keep everything organized and manageable. The appearance of the layers on the Stage won't be affected when using layer folders.

Tip: Consider the link color

• The standard Web convention for links says that unvisited links are blue and visited links are purple.  The problem is that blue and purple are really too close in color for many people to discern.  Not only that, but blue really doesn't say "Hey, I'm over here!!!"  For that, you need red.  If you don't believe us, take a look at virtually any magazine.  Red is the primary color for drawing attention to something (think lipstick). It's a color we connect with being hot!
• When you're designing, try changing the unvisited link to red and keep purple as the visited color, a cool, neutral color.  We think you'll find the results quite effective.

Tip: Set autoresponders for online business owners

• If you're the web designer for an online business, it's wise to set up automatic response forms (autoresponders). That way, when a user sends mail or a survey, he gets an immediate confirmation that his message was received and a staff member will respond as soon as possible. This lets the customer know that the email was received and also assures him that his question will be addressed. In turn, the customers will be happy and less impatient when the staff member does get back to them.

Tip: Checking for broken links (Macromedia Dreamweaver MX 2004)

• Do you ever find yourself manually going through your web pages to check for broken links? This is an obsolete, not to mention time-consuming way to repair broken links. To check a site for broken links, make sure that the site you want to work on is open in Dreamweaver. Then, select Sites > Manage Sites, choose the site name from the Manage Sites dialog box, and click Done. Now, go back to the Site menu and choose Check Links Sitewide. The Link Checker panel opens at the bottom of the page under the Property Inspector. Here, filenames with broken links, pages, images, or other items display. This is great if you want to clean up old images or other elements you're no longer using on your site.

Tip: Comment on everything!

• One of the wisest things you can do, especially if you design in a workgroup, is to comment your code.  If you attach a script, include a comment.  If you encounter a problem and create a workaround to correct it, include a comment.  If you include anything in a Web page that's not 100 percent straightforward, comment it.

Tip: Creating a submit button from a graphic in Dreamweaver (MX/MX 2004)

• Tired of the old gray Submit button? You can easily replace it with a graphic of your choice--just follow these steps. First, select Insert > Form Objects > Image Field. Next, locate the image you want to use and click OK. If Dreamweaver asks you if you want to add a form tag, click Select. Then, open the Property inspector and change the ImageField text to Submit. Select the image to display it on the page and you're all set. Your graphic now works the same as a standard Submit button.

Tip: How to manage your FAQs

• If you hate updating FAQs on site, you can save yourself time by downloading FAQ Manager from www.ascadnetworks.com/cgi/faq.shtml.  It's a very well-executed CGI script that allows you to quickly build a FAQ and update it through simple to use Web forms.  Although the standard FAQ form isn't the most attractive, you can edit it to make it blend in nicely with the rest of your pages.  the script is free but for support and additional features, they ask you to register the software for a nominal $10 fee.  The script is very easy to install-all you have to do is confirm the path to PERL and load it onto your server.

Tip: Scrub your paths with Firework's Path Scrubber tool (MX/MX 2004)

• The Path Scrubber tool is designed for use with strokes with pressure effects applied such as Airbrush or Calligraphy. It's also handy for editing paths created using a pressure sensitive drawing tablet. To edit a stroke with a pressure effect, first select the stroke. Then, choose either the Path Scrubber Additive or Path Scrubber Subtractive tool from the Tools panel. These tools reside in the Freeform tool's flyout menu. Depending on which tool you choose, the path either expands or contracts as you drag across it. You can also hold the [Alt] key ([option] on Mac) to toggle between these two tools.

Tip: Understanding the Trace Bitmap settings (Flash MX/MX 2004)

• Tracing a bitmap converts a bitmap image into vector artwork. The biggest benefit of this method is reduced file size, as vector information takes up much less space than bitmap information. However, neglecting to set the Trace Bitmap options correctly can result in poor image quality and over-complex renderings. Here's a quick overview of what each of the Trace Bitmap settings control:
• Color Threshold: The range that two pixels are considered different colors. Higher Color Threshold values decrease the number of colors, lower values increase the color range.
• Minimum Area: The minimum number of surrounding pixels considered when assigning color to a pixel. Try to keep this number as high as possible to create larger areas of color.
• Curve Fit: The degree of "smoothness" when the bitmap is traced. Higher values create smoother drawings; lower values create more detailed tracings.
• Corner Threshold: Determines the sharpness of the traced edges.

Tip: Add a free translation utility to your site

• If you want your site to reach as many people as possible, you may want to give foreign visitors a quick and easy way to translate it into their language. Since writing your own multi-language site can be time-consuming, AltaVista provides the Babel Fish Translation utility, which you can get for free at www.altavista.com/help/free/free_searchbox_transl.
•  This site features two options. The first is a translation tool you can include on your Web page to allow your users to translate text between various languages. The site provides a script tag with the src attribute pointing to a script that uses document.write() to add the tool's user interface to your site in the form of a table.
• The second option provides a script that writes an image map to your Web page, allowing users to click on a national flag to translate your page into their own language. Note that for this second option to work, AltaVista's code must be able to access your site. So, if you're running a local intranet site, you'll need to find another way to ensure that everyone understands each other.

Tip: How to design to avoid spam

• Get a lot of spam since you design Web sites?  Here's how to protect everyone on your site from getting the extra, unwanted mail.
• Get unlimited email accounts:
  • Most Web hosting services provide an option to allow for unlimited email from that domain.  This option is a great tool in managing spam.  the key is to set up the mail so that anything incorrectly addressed to the domain is forwarded to your email address.  Then, when you need to use your email address to register fro a Web service, use an address like nameoftheservice@yourdomain.com.  Since there wouldn't be an account for that address, it would automatically be routed to your standard email address.  When you begin seeing email addressed to nameoftheservice@yourdomain.com, you'll not only know that the email address has been nabbed up by those pesky marketers but also know where they got the address from.  You can then set up a rule in your mail client to remove the mail before it ever begins to bloat your mailbox.
• Be careful registering:
  • Although you might not really think about security being a problem when you register a domain, you need to remember that the contact information, including your email address, is available to anyone who wants it.  That's why you get emails with your domain name in the subject, offering you great deals on body modification, questionable pharmaceuticals, and solutions for your apparent loneliness.  When you register a site, use the technique outlined above or use a portable email address like MSN, Hotmail, or Yahoo.
• Keep your address off your Web site:
  • We're constantly preaching to always include a contact page for every site where individuals can ask questions about the company or compliment you on your particular sense of style in designing the site.  And that means that you have to include an address for the mai.
  • Problem is search engines designed for spammers visit sites and automatically extract any email addresses they consider valid, whether the addresses are simply in mailto format or in Web forms.  Just use a little code of your own.  The script show below will display the message Contact Us! on the Web page but the harvesting software won't recognize the address, since it's combined from different variable names on the fly.
  • <script language=javascript>
  • <!--
  • var theuser = "yourname";
  • var thehost = "yourdomain.com";
  • var themessage = "Contact Us!";
  • document.write(""@" + thehost + ">" + themessage +"")
  • //-->
  • </script>
• Mailing with forms:
  • If you use forms on your site for email, you'll need to modify the script shown above a bit.  Just use the document.write function to form the input information, as shown below.  Again, once you made the necessary changes, you can save this script for use within your Web authoring application
  • <script language=javascript>
  • <!--
  • var theuser = "yourname";
  • var thehost = "yourdomain.com";
  • var themessage = theuser + "@" + thehost;
  • document.write("<input type=hidden name=email value=" + theuser + "@" + thehost" + ">";
  • document.write(theuser + "@" + thehost);
  • //-->
  • </script>

Tip: Going from Dreamweaver to GoLive? Here are a few things to watch out for.

• Locked files:
  • You'll need to delete the locked files, those that were secured during the Check In/Check Out process of Dreamweaver.  To do so, choose Edit > Find in GoLive and select the In Site tab.  Then, choose Name from the first pop-up menu and Ends With from the second.  Then, enter lck in the Find field and click the Find button.  When a file is located, click the Trash Can on the toolbar and proceed to the next file by clicking the Find Next button.
• When you set up Dreamweaver to include design notes for your notes, the information is stored in XML files with the .mno extension.  Unfortunately, while you can read these notes as simple files in GoLive, you won't be able to import them directly into the files.
• Although both applications allow you to add behaviors to pages and page elements, any behaviors added within a Dreamweaver document and opened with GoLive will appear as custom JavaScripts.  You also won't be able to update or track them as you would in GoLive.  Therefore, you'll probably want to eventually remove the Dreamweaver code and replace it with the similar behaviours from GoLive.
• To use library items originally created from within Dreamweaver in GoLive, you'll need to convert them to GoLive Components.  To do so, open each library item (they'll have the .lbi extension) and then choose File > Save As > Save Component.  Then, in the Save dialog box, rename the file, replacing the .lbi extension with .html.

Tip: Place a search on your website for free

• Adding a search engine to your website can cost a small fortune if you don't shop around. Fortunately, we have two solutions for obtaining a free search. Atomz Corporation, www.atomz.com, offers the Atomz Express Search. It's a free commercial solution that you can implement in just a few minutes. To learn more about the Atomz Express Search check out www.atomz.com/applications/search/trial.htm. Another free search solution is on Bravenet's site at www.bravenet.com/webtools/search2/index.php. You can try either of these resources for free and if later you wish decide that you need a larger search you can upgrade.

Tip: Creating preset CSS styles in GoLive 5/6

• If you invariably use the same general set of CSS styles when creating Web pages in GoLive, you can save them as the default CSS set.  Just navigate to the program folder and then within it Settings/DocumentStore/examples and open the file name simple.css.
• Now edit the styles to suit your default preferences, adding or replacing styles where necessary.  Then, choose File > New Special > Cascading Style Sheet.  Now, the next time you launch the application, your preferred CSS definitions will appear as default.

Tip: Quickly validate radio buttons with JavaScript

• When you create a form with radio buttons, you may not always want to specify a default checked field.  For instance, if you crate an on-line questionnaire, you probably don't want the browser to automatically check one of the options.  Even so, you'll no doubt want the user to select a t east one of the choices before submitting the form.  As a result, you'll need a way to make sure this is the case.  The JavaScript function in the XHTML page provided below offers the perfect solution to do just that.  This code will validate radio buttons when submitted.
  • <head>
  • <script language="JavaScript" type="text/javascript">
  • function Validate(frm, btnName) {
  • var btn = frm[btnName]
  • var valid
  • for (var x=0;x<btn.length;x++){
  • valid = btn[x].checked
  • if (valid) {break}}
  • if (!valid) {
  • alert("Please select an answer.")}}
  • </script></head>
  • <form>
  • <input type="radio" name="question1" id="1b1" value="1">Always</input>
  • <input type="radio" name="question1" id="1b3" value="3">Sometimes</input>
  • <input type="radio" name="question1" id="1b5" value="5">Never</input>
  • <div><input type="button" value="Submit Answer" onclick="validate(this.form, 'question1')"/>
  • </div></form>

Tip: Follow the three clicks rule

• Any important piece of information should never be more than three clicks away from anywhere else on your website. The most important information on your site, such as contact information, shouldn't be more than one click away. When planning your website, follow the three clicks rule and your viewers will easily navigate without skipping the important stuff!  

Tip: Follow the three clicks rule

• Any important piece of information should never be more than three clicks away from anywhere else on your website. The most important information on your site, such as contact information, shouldn't be more than one click away. When planning your website, follow the three clicks rule and your viewers will easily navigate without skipping the important stuff!  

Tip: The difference between the Marquee tools in Adobe Photoshop and Macromedia Fireworks (Photoshop 7/CS, Fireworks MX/MX 2004)

• One of the most common errors that people make when switching from Photoshop to Fireworks is that they use the one of the Marquee tools in Fireworks to create a selection and then try to fill the selection with a color. This may work in Photoshop but it doesn't work in Fireworks. Instead of using the Marquee tool, which only creates selections, use one of Firework's Object tools, such as the Rectangle, Rounded Rectangle, Ellipse, or Polygon tools to create actual objects that can be filled.  

Tip: Does your font work in Flash 5/MX?

• Sometimes the font you're using in your Flash file can't be embedded into a Flash movie.  Since Flash does this automatically, it might seem impossible to know if a font is going to look good until the file is published.  but you can preview the appearance of a font by selecting View > Antialias Text.  If your text looks pixilated, Flash has a problem with that font and it won't be exported with the movie.  If it looks crisp and clean, you have no problem.

Tip: Automatically modifying the modify date

• Do you ever want to automatically add a modification date to a Web Page?  It's easy--just locate the area where you want to place the modification note and insert the following script:
  • <script language="JavaScript">
  • document.write("The last time we got off our duffs and updated this page was on " + document.lastModified)
  • </script>
• Obviously, you can change the text within the script to match your witty personality.  Then, each time you save the page, the lastModified element is changed.  Be forewarned that this won't work too well in pages that use server-side includes (SSI), since these pages are "updated" each time they're served to a browser.

Tip: Get a list of all the keyboard shortcuts in Dreamweaver MX

• Dreamweaver MX has scores of keyboard shortcuts to help increase your productivity and speed your workflow.  To get a copy of the list, go to www.macromedia.com/support/dreamweaver/documentation/dwmx_shortcuts and download the PDF file for either Macintosh or Microsoft Windows.  How else would you find out that you can refresh the local pane by pressing [shift][F5]?

Tip: What are mirror sites?

• A mirror site is basically an exact copy of an existing site that resides on a different server than the original site. Mirror sites are used for testing, providing faster access to different locations, and spreading long download time around to more than one site. Many popular sites have mirror sites positioned around the world so that viewers visiting their site can have speedier access no matter where they are.

Tip: Read the Reference palette in Dreamweaver 4/MX

• As a nice addition to Dreamweaver since version 4, Macromedia added the complete collection of O'Reilly Reference guides.  However, for those of us with old eyes (or bleary eyes due to the events the night before), the type in the Reference palette is pretty small.  But fortunately, you can enlarge both the palette and the text itself.  To enlarge the palette all you have to do is drag it open as you would any other window.  Then, to enlarge the text, choose Large Font from the Reference palette's pop-up menu.

Tip: Palette or Toolbox, which do you prefer? (Adobe GoLive CS)

• The Objects palette in GoLive CS looks more like a toolbox than in older versions. If you prefer the way it looked in previous versions, click the Toggle Orientation button in the bottom-left corner of the palette.  

Tip: Setting the size of your viewer's browser window

• Rather than tell a viewer the best window size for your browser, you can set it yourself.  That way, when the page loads, the web browser automatically resizes to the desired size.  To pull of this neat little trick, just add a simple little comment to the BODY tag.

Tip: Can't find a font?

• What do you do if you have a client that is in love with a font, insists on using it on their website and you don't have the font on your computer? With www.1001freefonts.com, this isn't a problem. It's a great resource for free downloadable fonts. It has tools to convert PC fonts to Macintosh files. It also has links to pixel fonts used for Macromedia Flash users. Best of all, it has an application where you can create your own font or edit an existing TrueType Font.

Tip: A good place to go when you have the blues

• Set the mood for your website by using colors that influence our emotional and mental states. Many believe that yellow is associated with optimism and sunshine, blue with relaxation and peace, red with passion and excitement, and earth-tones with practicality and responsibility. PANTONE Colorstrology offers information about the emotional and spiritual powers of color for personal exploration and empowerment. Check it out online at www.colorstrology.com.

Tip: Developing a standard naming convention

• As you go about designing a site, a file or graphic's name is often just the first thing that pops into your head.  But you'll be better served by establishing and adhering to a standard naming convention.  For instance, you could append a bn or ad prefix to a graphic to indication that it's a banner ad.  If you use thumbnails of images, you can use a tn prefix to identify the graphic.
• The same goes for filenames.  Establish a method of identifying a file by its name.  For example, if you run a Web site like ours, you could develop a naming convention based on date for each page.  The first three letters could signify the journal name, the next two numbers represent the year, the next number could denote the month, and the final number could correspond to the article number.
• Using a naming convention is essential if you collaborate with other designers on projects.  Without one, you'll spend an inordinate amount of time locating files.

Tip: Let history repeat itself in Macromedia Dreamweaver 4/Mac OS X

• When making a few routine changes to a Dreamweaver document, you can replicate your steps in other files by using the History panel.  Just select the steps and click on the Copy Selected Steps To The Clipboard icon at the bottom of the panel.  Then, open the next document and select Edit > Paste.  When you do the steps will appear in the History panel and Dreamweaver will perform the actions.  Also, keep in mind that if you're going to use the steps several times, it's probably best to save them as an action.

Tip: Adding a text wrap feature in your Web tool

• Though most Web tools don't have a full-fledged text wrap feature so the graphics flow nicely around an image, you can emulate one.  Once you've placed the graphic on the page, enter 5 in both the V Space and H Space fields in the application's Properties panel.  The text will then give the photo a little space around each side, just like a text wrap in a desktop publishing application.

Tip: Get rid of those unnecessary Microsoft FrontPage files

• When working on your Web server, you might encounter some strangely named folders that you didn't create--usually beginning with _vti_.  These are folders and files that sometimes get dropped into your folder by a well-meaning Web server administrator (without these files, FrontPage wouldn't function).  However, if you aren't using the application, they do nothing more than clog up your server and your asset panels in Adobe GoLive or Macromedia Dreamweaver.  Save yourself some hassle and just delete them.

Tip: Edit a library item in a Dreamweaver 4/MX document

• If you frequently reuse page elements such as images, text, or other objects, then you'll want to store those items in libraries.  You can create a library item from any element in the "body" section of a document.  To edit a library item for a specific page after you've already added it to a document, you must first break the link between the item in the document and the library itself.  To do so, select the desired library item in the current document and then click Detach From Original in the Properties inspector.  When you do, the selected instance of the library item becomes blocked to updates when the original library item changes.

Tip: Remove a color from Dreamweaver's Swatches panel (MX/MX 2004)

• To delete a color from the Swatches panel, you must first open the Swatches panel.  To do this, select Window > Swatches and move your mouse pointer over the color swatch that you wish to delete.  Hold down the [Ctrl] key ([command] on Macintosh).  A Scissors icon appears as the mouse pointer.  Continue holding the [Ctrl] key ([command] on Macintosh) and click to delete the color.

TO VISIT BUSINESS WEBSITE LINKS' INTERNET DIRECTORY
CLICK HERE---->INTERNET DIRECTORY ONLINE.COM