Hub You
#1 in Business Subscribe Email Print

You are here: Home > Internet and Businesses Online > Internet Marketing > How to Enhance an Online Marketing Campaign with Adobe Illustrator, Photoshop CS2, and Dreamweaver 8

Tags

  • duplicated
  • symbol palette
  • banner resized
  • stars again

  • Links

  • Lowest First Mortgage Rates
  • Information Product Sales for Affiliates
  • Public Relations for United States Post Office
  • Hub You - How to Enhance an Online Marketing Campaign with Adobe Illustrator, Photoshop CS2, and Dreamweaver 8

    Advertising - The Power of the Written Word over the Spoken Word
    There are some things which, on account .of the delicacy of treatment, the accuracy, etc, required, cannot be trusted to the most sensitive piece of machinery, but must be finished by the hand of a skilled craftsman. There are many things in the world of selling which are too delicate for the mass treatment accorded them by the advertising man, and which require the touch of the salesman to bring to the desired conclusion.Advertising is limited by its own advantages to definite functions in certain fields. Its usefulness varies with the character of the product, the customer, or the purchase unit. It varies with distribution, the character of the buying habit, and the extent of the territory. Above all, it varies with the attitude of mind of the consumer toward the products' associations.No two cases will be exactly alike, but all will come under some one or two general classes which define the status of the advertising in relation to the personal selling. There are some cases where machine work is of so little value that it could be dispensed with almost without a ripple. There are similar cases in selling where the personal selling represents such an important factor in relation to the total operation that advertising can be dispensed with, and the difference hardly noted; there are other cases where advertising does all or most of the work, so that the personal selling effort is of minor importance in comparison with the whole merchandising requirement. In other words, sometimes the product sells itself, other times a simple ad will suffice, and other times will take a salesperson talking to the potential cust
    w background layer and filled it with an eye-catching yellow. From the layers-palette menu, I selected "Flatten Image" to merge the layers. I then cropped the headline to a 468x68-pixel banner using the Crop Tool. I cropped the headline so as to leave a good bit of yellow background around the text. When the crop was finally executed, the banner resized automatically to the dimensions I had entered into the tool's width and height fields.

    There are a couple of tricks that make precise crop selections easier. While holding down both the left mouse button and the space bar, the mouse can be used to move the crop selection into position. After the crop selection has been made, but before the selection is applied, the arrow keys can be used to nudge the crop selection precisely where desired.

    After flattening and cropping the banner, only one layer, the background layer, remained in the Layers palette. The special styles I wanted to apply to the banner cannot be done on the background layer, so I duplicated the layer. I could then apply additional layer styles to the banner. I renamed the duplicate layer as banner. Double clicking on the banner-layer thumbnail gave me access to the Layer Style dialog. I selected "Bevel and Emboss" from the Styles options. Clicking on "Bevel and Emboss" from among the available style options brought up another dialog box with a multitude of adjustments that I could apply to the bevel I wanted to use. After setting the adjustments, I applied the bevel to the banner. As a final touch, and also from the Layer Style dialog, I selected the "Stroke" option and applied a 1-pixel stroke (border) around the banner. This can be important because parts of the bevel can get lost in the background. I selected the color for the stroke from a sample taken from the bevel itself.

    After working through the design phase of the project, I found finishing the web page was easy. I used Dreamweaver 8 to create the HTML code necessary to insert and position the graphics. I also assigned the target URL to the headline and breakout-opportunity graphics.

    At this time, I coded the text and HTML for component 5. Aside from typing in the text, the coding consisted of assigning links to the anchor text.

    The last step was to upload the web page to the web site and the banner to

    Transforming Your Sales Force by Creating Specific Expectations
    I just finished a phone call with a potential client who had called to discuss a problem. His 18 person sales force was paid on straight commission. All had been with the company for 8 - 15 years and were earning healthy incomes. His problem was that he couldn't get them to do what he wanted them to do. Here's the example he shared.He wanted the salespeople to call on new prospects to expand the company's base. Instead of just seeing established customers, he asked them to call on prospects, and report back to him on the progress they were making.There were almost no results. Instead he got comments like: "I'm not going to do this, I'm not a new salesperson." Or, "That's just more paperwork." This list could go on and on. The salespeople resented being asked to do something they saw as outside of their responsibilities, and the manager was extremely frustrated.This is a classic example of the chronic malady I call a lack of "directability."The problem is that management has not cleared up this murky difference of opinion.It may be, of course, that the salespeople choose to ignore management's direction. That's a different but associated problem. It really doesn't come into play until the expectations are made clear.For example, one of my clients moved his company to a CRM system. He gave the salespeople six months to learn to type, offered to pay for a typing class for them, and mandated that on a date approximately six months from now, the company would totally implement the CRM system. That meant that every sales person would be expected to use it to record sales calls, customer info
    An online marketing campaign is analogous to a military campaign: resources have to be assembled and then applied to an objective. In the case of an online marketing campaign, the objective is to capture sales. The resources that can be used in a marketing campaign include banner ads and web pages. Other resources--such as traffic exchanges, blogs, ezines, and forums--can be used to help interested prospects find the banners and targeted web pages on the Internet. This article discusses how I designed a banner ad and a web page for an online marketing campaign. The design tools I used for the project were Adobe Illustrator, Photoshop CS2, and Dreamweaver 8. Hereafter, I will refer to the design project as the "project."

    The first challenge of the project was to develop a theme for the banner ad and web page. I developed the theme after thinking about the analogies between marketing and military campaigns and about the people who conduct them.

    An often-heard complaint of initiates struggling to achieve e-commerce success is, "I'm tired of making money for uplines and nothing for myself."

    When I hear such frustration expressed, I am reminded of one person's famous refusal to give up in a fight. General Anthony C. McAuliffe, refusing to surrender during the WWII Battle of Bastogne, said, "Us surrender? Aw, nuts!" This statement was formalized in the final answer to the enemy as, "Nuts!" McAuliffe's answer could just as well serve as an apt exclamation for online marketers who work hard, do all of the right things, make very little e-commerce cash, but refuse to give up the fight for success. Nuts!

    When soldiers are surrounded and defending an objective, one option they have is the "breakout." Likewise, novice online marketers--and sometimes veteran marketers, too--look for a better marketing opportunity as a way to "breakout."

    In keeping with these ideas, what kind of an opportunity would lead a striving marketer to a breakout? A 5-star opportunity, of course. In the US military, there is no higher rank than 5-stars; and in online marketing, there is no better opportunity.

    I defined the core design components of the project as follows:

    1. "NUTS! BREAKOUT NOW!" -- the headline and banner,
    2. "TIRED OF EARNING A PAYCHECK FOR SOMEBODY ELSE?" -- the sub headline,
    3. "Make Money Now Online" -- the breakout opportunity, and
    4. a 5-star graphic (suggesting a 5-star opportunity).

    I added a 5th component later: I added statement recommending the 5-star opportunity. The statement also included links to additional information.

    I used Illustrator to create the first four components. I then opened the Illustrator artwork with Photoshop CS2 and made separate graphics from each. I created the banner ad from the headline. Component 5 was created in Dreamweaver8 during the creation of the HTML web page, although I did do a mockup in Illustrator, first. There are many visual images on my web site showing how the five components were created.

    Adobe Illustrator makes working with text especially easy; so, I decided to use Illustrator to create the major textual and graphical elements. Starting with the headline, I opened Illustrator and added a new layer for "NUTS!" Each new element on the artboard was created in its own layer.

    Since "NUTS!" is such an important visual component of the project, the text had to be eye-catching--big, bold, and colorful. Placing the letters along a curved path would also help to catch the immediate attention of even a casual web surfer. I used Illustrator's Ellipse Tool to draw a curved path for the text. After drawing the path, I was ready to use the Type-on-a-Path Tool to place the text along the path: stroke and fill were disabled. From the Type/Font menu, I reviewed the available fonts and selected 36 pt Goudy Stout; and, using a red fill for the text, I typed the text along the curved path. I used the Selection Tool to position and rotate the text as I wanted. Using a ruler guide helps while positioning objects on the artboard.

    I created the quotation marks for "NUTS!" on a separate layer so I could place them around the text with non-standard positioning. After typing the first quotation mark, I duplicated it with a copy and paste. I transformed the duplicate into the right quotation mark with a vertical reflection. I roughly positioned the quotation marks using the Selection Tool and used the arrow keys to position them precisely. Next, I created the text for "BREAKOUT NOW!"

    "BREAKOUT NOW!" consisted of two components: the text and a graphical underline. For the text, I selected 36 pt Impact and filled it blue. I created the underline by simply drawing a thin, appropriately-sized rectangle with the Rectangle Tool and filling it with blue. In order to move the text and graphic as a block, I used the Selection Tool to select both and then used the Object/Group menu option to group them together.

    Using the Selection Tool, I moved both the breakout text and the underline into position next to "NUTS!" The combination of text and graphic gave the breakout part of the headline the appearance of a URL link: later, I would associate the entire headline with the URL of the targeted web page. I selected all five headline elements--right and left quotation marks, NUTS!, BREAKOUT NOW!, and the underline) and grouped them together so I could move the headline as a block.

    After grouping the elements, I placed a drop shadow under the headline in order to make it stand out even more (Effect/Stylize/Drop Shadow...). I protected my work on the headline by locking the layer. This is indicated by a small padlock on the headline layer in the Layers palette. Locking a layer prevents accidental alteration as the work continues.

    I created the sub headline using 18 pt Goudy Stout, filling the text black. I used the standard Type Tool for this and moved the text into place with the Selection Tool.

    The breakout opportunity, "Make Money Now Online," was created in a similar manner as the "BREAKOUT NOW!" of the headline. It consisted of text (36 pt verdana) and a graphical, rectangular underline. The text and underline graphic was placed into position using the Selection Tool.

    The 5-star graphic was created by first creating a pentagon to use as a guide for star placement. I created a new layer and used the Polygon Tool to make the pentagon--what other polygon could be more appropriate for this project? Next, I created a new layer, above the pentagon, for the stars. From the symbol palette, I opened the symbol library and selected a star from the 3D Symbols palette and dragged it onto the artboard.

    After applying a drop shadow to one star (Effect/Stylize/Drop Shadow...), I copied/pasted the star four more times onto the star layer. Using the pentagon on the layer below as a guide, I positioned the stars. Again, I used the arrow keys for precise positioning. I selected all of the stars with the Selection Tool and grouped them from the Object/Group menu. This grouping allowed me to move the stars as a block in order to place them below the breakout text.

    At this point, the major elements of the design were complete. In order to visualize what the component-5 text would look line in a web page, I added mockup text. I saved the project as nuts.ai. The remaining work on the graphic design was done in Photoshop CS2.

    I opened the nuts.ai file in Photoshop and immediately saved the file as nuts.psd. After duplicating the background layer, I turned the layer off and continued working from the copy. I renamed the duplicate layer as "nuts." The design elements appeared on the layer with a transparent background.

    Starting with the headline, I cropped each element using Photoshop's Crop Tool. I saved each crop using the File/Save for Web... menu option. Because of the drop shadow in the headline and stars graphics, I saved these two elements with the same cream-colored background I would be using for the web page. This insured that the graphics would seamlessly blend with the web page background. It was not necessary to worry about the size of the crop: I cropped each element so as to leave a little bit of the background around the edges.

    In order to achieve the smallest file sizes for the graphics, I saved the graphics as PNG-8 files. During the save process, I adjusted the bit depth of each graphic for the smallest file size while maintaining good image quality. Photoshop's Save-for-the-Web utility is great for visually optimizing graphics for the web. For the web page, I had the following files:

    • the headline -- nuts-breakout.png (6KB),
    • the sub headline -- tired.png (3KB),
    • the breakout -- mmnolink.png (2KB), and
    • the graphic -- stars.png (6KB).

    I was confident the graphics would load quickly in a web browser because of their small file sizes. Why did I use graphics for text? I wanted to make sure that the layout would be viewed--with the same fonts and font styles--exactly as I designed it.

    For the banner ad, and before leaving Photoshop, I first saved the file as banner.psd. At all times, it is important to preserve source files and to work on copies or renamed files. I added a new background layer and filled it with an eye-catching yellow. From the layers-palette menu, I selected "Flatten Image" to merge the layers. I then cropped the headline to a 468x68-pixel banner using the Crop Tool. I cropped the headline so as to leave a good bit of yellow background around the text. When the crop was finally executed, the banner resized automatically to the dimensions I had entered into the tool's width and height fields.

    There are a couple of tricks that make precise crop selections easier. While holding down both the left mouse button and the space bar, the mouse can be used to move the crop selection into position. After the crop selection has been made, but before the selection is applied, the arrow keys can be used to nudge the crop selection precisely where desired.

    After flattening and cropping the banner, only one layer, the background layer, remained in the Layers palette. The special styles I wanted to apply to the banner cannot be done on the background layer, so I duplicated the layer. I could then apply additional layer styles to the banner. I renamed the duplicate layer as banner. Double clicking on the banner-layer thumbnail gave me access to the Layer Style dialog. I selected "Bevel and Emboss" from the Styles options. Clicking on "Bevel and Emboss" from among the available style options brought up another dialog box with a multitude of adjustments that I could apply to the bevel I wanted to use. After setting the adjustments, I applied the bevel to the banner. As a final touch, and also from the Layer Style dialog, I selected the "Stroke" option and applied a 1-pixel stroke (border) around the banner. This can be important because parts of the bevel can get lost in the background. I selected the color for the stroke from a sample taken from the bevel itself.

    After working through the design phase of the project, I found finishing the web page was easy. I used Dreamweaver 8 to create the HTML code necessary to insert and position the graphics. I also assigned the target URL to the headline and breakout-opportunity graphics.

    At this time, I coded the text and HTML for component 5. Aside from typing in the text, the coding consisted of assigning links to the anchor text.

    The last step was to upload the web page to the web site and the banner to t

    Autoresponders are Essential in Web Business
    Not only that, but the autoresponder records your name and details into a database so that you can be sent information on any new products you might be interested in. It also sends you an email once a month inviting you check on special offers. This autoresponder that handled your enquiry so efficiently has done the same, almost instantaneously, for another thousand enquiries.Do you think a human being could have answered so many online enquiries so efficiently in a few seconds? Of course not! Now think on why you have to have a quality autoresponder. Autoresponders are a necessity for any online business.What options are open to you if you are looking for an autoresponder? The first is to use a website hosting company that offers a package that includes an autoresponder with their email service. Several good web hosts offer this, and if you are paying over $20 monthly for your website, you should have an autoresponder included. If not, then request one or change.You can also purchase an autoresponder, in which case there are a few very good ones on the market. What you should be provided with in a quality autoresponder are, obviously, the ability to reply to a request for information, to deliver an order for electronically transferable goods, to accept details from opt-in forms in exchange for a newsletter or free offers and to deliver these offers and newsletters at pre-programmed times and dates while recording the details provided in the form, to deliver mass emails to email lists at pre-programmed times and so on and so on.An autoresponder is essential when your customer base is world-wid
    ub headline,
  • "Make Money Now Online" -- the breakout opportunity, and
  • a 5-star graphic (suggesting a 5-star opportunity).
  • I added a 5th component later: I added statement recommending the 5-star opportunity. The statement also included links to additional information.

    I used Illustrator to create the first four components. I then opened the Illustrator artwork with Photoshop CS2 and made separate graphics from each. I created the banner ad from the headline. Component 5 was created in Dreamweaver8 during the creation of the HTML web page, although I did do a mockup in Illustrator, first. There are many visual images on my web site showing how the five components were created.

    Adobe Illustrator makes working with text especially easy; so, I decided to use Illustrator to create the major textual and graphical elements. Starting with the headline, I opened Illustrator and added a new layer for "NUTS!" Each new element on the artboard was created in its own layer.

    Since "NUTS!" is such an important visual component of the project, the text had to be eye-catching--big, bold, and colorful. Placing the letters along a curved path would also help to catch the immediate attention of even a casual web surfer. I used Illustrator's Ellipse Tool to draw a curved path for the text. After drawing the path, I was ready to use the Type-on-a-Path Tool to place the text along the path: stroke and fill were disabled. From the Type/Font menu, I reviewed the available fonts and selected 36 pt Goudy Stout; and, using a red fill for the text, I typed the text along the curved path. I used the Selection Tool to position and rotate the text as I wanted. Using a ruler guide helps while positioning objects on the artboard.

    I created the quotation marks for "NUTS!" on a separate layer so I could place them around the text with non-standard positioning. After typing the first quotation mark, I duplicated it with a copy and paste. I transformed the duplicate into the right quotation mark with a vertical reflection. I roughly positioned the quotation marks using the Selection Tool and used the arrow keys to position them precisely. Next, I created the text for "BREAKOUT NOW!"

    "BREAKOUT NOW!" consisted of two components: the text and a graphical underline. For the text, I selected 36 pt Impact and filled it blue. I created the underline by simply drawing a thin, appropriately-sized rectangle with the Rectangle Tool and filling it with blue. In order to move the text and graphic as a block, I used the Selection Tool to select both and then used the Object/Group menu option to group them together.

    Using the Selection Tool, I moved both the breakout text and the underline into position next to "NUTS!" The combination of text and graphic gave the breakout part of the headline the appearance of a URL link: later, I would associate the entire headline with the URL of the targeted web page. I selected all five headline elements--right and left quotation marks, NUTS!, BREAKOUT NOW!, and the underline) and grouped them together so I could move the headline as a block.

    After grouping the elements, I placed a drop shadow under the headline in order to make it stand out even more (Effect/Stylize/Drop Shadow...). I protected my work on the headline by locking the layer. This is indicated by a small padlock on the headline layer in the Layers palette. Locking a layer prevents accidental alteration as the work continues.

    I created the sub headline using 18 pt Goudy Stout, filling the text black. I used the standard Type Tool for this and moved the text into place with the Selection Tool.

    The breakout opportunity, "Make Money Now Online," was created in a similar manner as the "BREAKOUT NOW!" of the headline. It consisted of text (36 pt verdana) and a graphical, rectangular underline. The text and underline graphic was placed into position using the Selection Tool.

    The 5-star graphic was created by first creating a pentagon to use as a guide for star placement. I created a new layer and used the Polygon Tool to make the pentagon--what other polygon could be more appropriate for this project? Next, I created a new layer, above the pentagon, for the stars. From the symbol palette, I opened the symbol library and selected a star from the 3D Symbols palette and dragged it onto the artboard.

    After applying a drop shadow to one star (Effect/Stylize/Drop Shadow...), I copied/pasted the star four more times onto the star layer. Using the pentagon on the layer below as a guide, I positioned the stars. Again, I used the arrow keys for precise positioning. I selected all of the stars with the Selection Tool and grouped them from the Object/Group menu. This grouping allowed me to move the stars as a block in order to place them below the breakout text.

    At this point, the major elements of the design were complete. In order to visualize what the component-5 text would look line in a web page, I added mockup text. I saved the project as nuts.ai. The remaining work on the graphic design was done in Photoshop CS2.

    I opened the nuts.ai file in Photoshop and immediately saved the file as nuts.psd. After duplicating the background layer, I turned the layer off and continued working from the copy. I renamed the duplicate layer as "nuts." The design elements appeared on the layer with a transparent background.

    Starting with the headline, I cropped each element using Photoshop's Crop Tool. I saved each crop using the File/Save for Web... menu option. Because of the drop shadow in the headline and stars graphics, I saved these two elements with the same cream-colored background I would be using for the web page. This insured that the graphics would seamlessly blend with the web page background. It was not necessary to worry about the size of the crop: I cropped each element so as to leave a little bit of the background around the edges.

    In order to achieve the smallest file sizes for the graphics, I saved the graphics as PNG-8 files. During the save process, I adjusted the bit depth of each graphic for the smallest file size while maintaining good image quality. Photoshop's Save-for-the-Web utility is great for visually optimizing graphics for the web. For the web page, I had the following files:

    • the headline -- nuts-breakout.png (6KB),
    • the sub headline -- tired.png (3KB),
    • the breakout -- mmnolink.png (2KB), and
    • the graphic -- stars.png (6KB).

    I was confident the graphics would load quickly in a web browser because of their small file sizes. Why did I use graphics for text? I wanted to make sure that the layout would be viewed--with the same fonts and font styles--exactly as I designed it.

    For the banner ad, and before leaving Photoshop, I first saved the file as banner.psd. At all times, it is important to preserve source files and to work on copies or renamed files. I added a new background layer and filled it with an eye-catching yellow. From the layers-palette menu, I selected "Flatten Image" to merge the layers. I then cropped the headline to a 468x68-pixel banner using the Crop Tool. I cropped the headline so as to leave a good bit of yellow background around the text. When the crop was finally executed, the banner resized automatically to the dimensions I had entered into the tool's width and height fields.

    There are a couple of tricks that make precise crop selections easier. While holding down both the left mouse button and the space bar, the mouse can be used to move the crop selection into position. After the crop selection has been made, but before the selection is applied, the arrow keys can be used to nudge the crop selection precisely where desired.

    After flattening and cropping the banner, only one layer, the background layer, remained in the Layers palette. The special styles I wanted to apply to the banner cannot be done on the background layer, so I duplicated the layer. I could then apply additional layer styles to the banner. I renamed the duplicate layer as banner. Double clicking on the banner-layer thumbnail gave me access to the Layer Style dialog. I selected "Bevel and Emboss" from the Styles options. Clicking on "Bevel and Emboss" from among the available style options brought up another dialog box with a multitude of adjustments that I could apply to the bevel I wanted to use. After setting the adjustments, I applied the bevel to the banner. As a final touch, and also from the Layer Style dialog, I selected the "Stroke" option and applied a 1-pixel stroke (border) around the banner. This can be important because parts of the bevel can get lost in the background. I selected the color for the stroke from a sample taken from the bevel itself.

    After working through the design phase of the project, I found finishing the web page was easy. I used Dreamweaver 8 to create the HTML code necessary to insert and position the graphics. I also assigned the target URL to the headline and breakout-opportunity graphics.

    At this time, I coded the text and HTML for component 5. Aside from typing in the text, the coding consisted of assigning links to the anchor text.

    The last step was to upload the web page to the web site and the banner to

    What Are Electronic Checks?
    What are Electronic Checks?Electronic checks or echecks include the following applications: • WEB (Internet based) • ARC (mailed payment check conversion) • POP (check conversion-POS) • RCK (NSF check recovery) • TEL (telephone) • PPD (consumer pre auth recurring one-time debit) These applications are called eChecks because the merchant or biller uses a check as a source document for the consumer’s account information (RCK, POP, ARC) or the consumer is prompted to use their check as a reference to provide their account information (WEB, TEL). eChecks are used by merchants and billers as optional payment methods that are faster, more convenient and more secure than traditional check processing, which benefits both the company and the consumer.Echeck Merchant AccountsEchecks merchant accounts can be established for standard ecommerce merchants and high risk merchants. The echeck payment processing gateway is integrated with the ecommerce site. Often times the credit card processing gateway will include an echeck module. If both echeck and credit card transactions are processed through the same ecommerce gateway, the merchant benefits from centralized reporting and easy merchant account transaction reconciliation.When a buyer checks out, electronic checks are one of the payment options. The other popular payment option, of course, is payment with credit cards. When echeck is the chosen method, the consumer buyer enters the same type of information as with credit card processing. The difference is that the consumer enters the routing and account
    selected 36 pt Impact and filled it blue. I created the underline by simply drawing a thin, appropriately-sized rectangle with the Rectangle Tool and filling it with blue. In order to move the text and graphic as a block, I used the Selection Tool to select both and then used the Object/Group menu option to group them together.

    Using the Selection Tool, I moved both the breakout text and the underline into position next to "NUTS!" The combination of text and graphic gave the breakout part of the headline the appearance of a URL link: later, I would associate the entire headline with the URL of the targeted web page. I selected all five headline elements--right and left quotation marks, NUTS!, BREAKOUT NOW!, and the underline) and grouped them together so I could move the headline as a block.

    After grouping the elements, I placed a drop shadow under the headline in order to make it stand out even more (Effect/Stylize/Drop Shadow...). I protected my work on the headline by locking the layer. This is indicated by a small padlock on the headline layer in the Layers palette. Locking a layer prevents accidental alteration as the work continues.

    I created the sub headline using 18 pt Goudy Stout, filling the text black. I used the standard Type Tool for this and moved the text into place with the Selection Tool.

    The breakout opportunity, "Make Money Now Online," was created in a similar manner as the "BREAKOUT NOW!" of the headline. It consisted of text (36 pt verdana) and a graphical, rectangular underline. The text and underline graphic was placed into position using the Selection Tool.

    The 5-star graphic was created by first creating a pentagon to use as a guide for star placement. I created a new layer and used the Polygon Tool to make the pentagon--what other polygon could be more appropriate for this project? Next, I created a new layer, above the pentagon, for the stars. From the symbol palette, I opened the symbol library and selected a star from the 3D Symbols palette and dragged it onto the artboard.

    After applying a drop shadow to one star (Effect/Stylize/Drop Shadow...), I copied/pasted the star four more times onto the star layer. Using the pentagon on the layer below as a guide, I positioned the stars. Again, I used the arrow keys for precise positioning. I selected all of the stars with the Selection Tool and grouped them from the Object/Group menu. This grouping allowed me to move the stars as a block in order to place them below the breakout text.

    At this point, the major elements of the design were complete. In order to visualize what the component-5 text would look line in a web page, I added mockup text. I saved the project as nuts.ai. The remaining work on the graphic design was done in Photoshop CS2.

    I opened the nuts.ai file in Photoshop and immediately saved the file as nuts.psd. After duplicating the background layer, I turned the layer off and continued working from the copy. I renamed the duplicate layer as "nuts." The design elements appeared on the layer with a transparent background.

    Starting with the headline, I cropped each element using Photoshop's Crop Tool. I saved each crop using the File/Save for Web... menu option. Because of the drop shadow in the headline and stars graphics, I saved these two elements with the same cream-colored background I would be using for the web page. This insured that the graphics would seamlessly blend with the web page background. It was not necessary to worry about the size of the crop: I cropped each element so as to leave a little bit of the background around the edges.

    In order to achieve the smallest file sizes for the graphics, I saved the graphics as PNG-8 files. During the save process, I adjusted the bit depth of each graphic for the smallest file size while maintaining good image quality. Photoshop's Save-for-the-Web utility is great for visually optimizing graphics for the web. For the web page, I had the following files:

    • the headline -- nuts-breakout.png (6KB),
    • the sub headline -- tired.png (3KB),
    • the breakout -- mmnolink.png (2KB), and
    • the graphic -- stars.png (6KB).

    I was confident the graphics would load quickly in a web browser because of their small file sizes. Why did I use graphics for text? I wanted to make sure that the layout would be viewed--with the same fonts and font styles--exactly as I designed it.

    For the banner ad, and before leaving Photoshop, I first saved the file as banner.psd. At all times, it is important to preserve source files and to work on copies or renamed files. I added a new background layer and filled it with an eye-catching yellow. From the layers-palette menu, I selected "Flatten Image" to merge the layers. I then cropped the headline to a 468x68-pixel banner using the Crop Tool. I cropped the headline so as to leave a good bit of yellow background around the text. When the crop was finally executed, the banner resized automatically to the dimensions I had entered into the tool's width and height fields.

    There are a couple of tricks that make precise crop selections easier. While holding down both the left mouse button and the space bar, the mouse can be used to move the crop selection into position. After the crop selection has been made, but before the selection is applied, the arrow keys can be used to nudge the crop selection precisely where desired.

    After flattening and cropping the banner, only one layer, the background layer, remained in the Layers palette. The special styles I wanted to apply to the banner cannot be done on the background layer, so I duplicated the layer. I could then apply additional layer styles to the banner. I renamed the duplicate layer as banner. Double clicking on the banner-layer thumbnail gave me access to the Layer Style dialog. I selected "Bevel and Emboss" from the Styles options. Clicking on "Bevel and Emboss" from among the available style options brought up another dialog box with a multitude of adjustments that I could apply to the bevel I wanted to use. After setting the adjustments, I applied the bevel to the banner. As a final touch, and also from the Layer Style dialog, I selected the "Stroke" option and applied a 1-pixel stroke (border) around the banner. This can be important because parts of the bevel can get lost in the background. I selected the color for the stroke from a sample taken from the bevel itself.

    After working through the design phase of the project, I found finishing the web page was easy. I used Dreamweaver 8 to create the HTML code necessary to insert and position the graphics. I also assigned the target URL to the headline and breakout-opportunity graphics.

    At this time, I coded the text and HTML for component 5. Aside from typing in the text, the coding consisted of assigning links to the anchor text.

    The last step was to upload the web page to the web site and the banner to

    Strategic Marketing Tips From Your Strategic Thinking Business Coach
    Being strategic and thinking strategically in developing your marketing plan means you understand the needs and desires of your clients and customers, and you show them how your product/service satisfies those needs. You must know: what value your product or service offers and what benefits it provides; what differentiates you and your product/service from the competition; who are your stakeholders, which may include: your suppliers, your bank, your subcontractors or vendors, your associates, your staff, your clients or customers, and of course the general public; where your clients and customers are located geographically; and what are the most effective distribution channels to deliver your product or service? When developing a strategic marketing plan, your strategic thinking business coach provides the following ten (10) strategic marketing tips.Strategic Marketing Tip #1: Develop a strategic plan with a clearly defined and focused vision and mission for your business, along with core values and goals As the foundation for all your business, marketing and other plans.Strategic Marketing Tip #2: Develop a Strategic Action Plan that breaks down your goals into tasks with assigned leaders and completion dates.Strategic Marketing Tip #3: Develop strong relationships with your stakeholders. People want to do business with people they know or with whom they have a positive relationship.Strategic Marketing Tip #4: Be positive, persistent and patient.Strategic Marketing Tip #5: Focus your primary marketing efforts on existing clients and customers since they are already doing busines
    I selected all of the stars with the Selection Tool and grouped them from the Object/Group menu. This grouping allowed me to move the stars as a block in order to place them below the breakout text.

    At this point, the major elements of the design were complete. In order to visualize what the component-5 text would look line in a web page, I added mockup text. I saved the project as nuts.ai. The remaining work on the graphic design was done in Photoshop CS2.

    I opened the nuts.ai file in Photoshop and immediately saved the file as nuts.psd. After duplicating the background layer, I turned the layer off and continued working from the copy. I renamed the duplicate layer as "nuts." The design elements appeared on the layer with a transparent background.

    Starting with the headline, I cropped each element using Photoshop's Crop Tool. I saved each crop using the File/Save for Web... menu option. Because of the drop shadow in the headline and stars graphics, I saved these two elements with the same cream-colored background I would be using for the web page. This insured that the graphics would seamlessly blend with the web page background. It was not necessary to worry about the size of the crop: I cropped each element so as to leave a little bit of the background around the edges.

    In order to achieve the smallest file sizes for the graphics, I saved the graphics as PNG-8 files. During the save process, I adjusted the bit depth of each graphic for the smallest file size while maintaining good image quality. Photoshop's Save-for-the-Web utility is great for visually optimizing graphics for the web. For the web page, I had the following files:

    • the headline -- nuts-breakout.png (6KB),
    • the sub headline -- tired.png (3KB),
    • the breakout -- mmnolink.png (2KB), and
    • the graphic -- stars.png (6KB).

    I was confident the graphics would load quickly in a web browser because of their small file sizes. Why did I use graphics for text? I wanted to make sure that the layout would be viewed--with the same fonts and font styles--exactly as I designed it.

    For the banner ad, and before leaving Photoshop, I first saved the file as banner.psd. At all times, it is important to preserve source files and to work on copies or renamed files. I added a new background layer and filled it with an eye-catching yellow. From the layers-palette menu, I selected "Flatten Image" to merge the layers. I then cropped the headline to a 468x68-pixel banner using the Crop Tool. I cropped the headline so as to leave a good bit of yellow background around the text. When the crop was finally executed, the banner resized automatically to the dimensions I had entered into the tool's width and height fields.

    There are a couple of tricks that make precise crop selections easier. While holding down both the left mouse button and the space bar, the mouse can be used to move the crop selection into position. After the crop selection has been made, but before the selection is applied, the arrow keys can be used to nudge the crop selection precisely where desired.

    After flattening and cropping the banner, only one layer, the background layer, remained in the Layers palette. The special styles I wanted to apply to the banner cannot be done on the background layer, so I duplicated the layer. I could then apply additional layer styles to the banner. I renamed the duplicate layer as banner. Double clicking on the banner-layer thumbnail gave me access to the Layer Style dialog. I selected "Bevel and Emboss" from the Styles options. Clicking on "Bevel and Emboss" from among the available style options brought up another dialog box with a multitude of adjustments that I could apply to the bevel I wanted to use. After setting the adjustments, I applied the bevel to the banner. As a final touch, and also from the Layer Style dialog, I selected the "Stroke" option and applied a 1-pixel stroke (border) around the banner. This can be important because parts of the bevel can get lost in the background. I selected the color for the stroke from a sample taken from the bevel itself.

    After working through the design phase of the project, I found finishing the web page was easy. I used Dreamweaver 8 to create the HTML code necessary to insert and position the graphics. I also assigned the target URL to the headline and breakout-opportunity graphics.

    At this time, I coded the text and HTML for component 5. Aside from typing in the text, the coding consisted of assigning links to the anchor text.

    The last step was to upload the web page to the web site and the banner to

    How to Curb Antique Shop Theft Inexpensively
    If you have ever had your antique shop or mall ripped off, you understand that it's very hard to detect. There are simply so many items to keep track of, and an item can be missing literally for months and you may not realize it.Curb theft dramtically by using a simple and inexpensive technique.We all understand that perception is vitally important to human behavior, so why are we so fearful to use perception to our advantage when it comes to protecting our assets? Here's a step-by-step approach to shrinking theft by changing a customers perception of the security in your store.1. Select and purchase "dummy" video cameras. They do exist, and they can be used in combination with regular video cameras to give the illusion that your store is under constant surveillance. Put them in place all over the shop or mall in conspicuous places. The very sight of a security camera will often cause a thief to think twice before grabbing something.2. Put security signage in place around the store. These simple signs will remind people that you take security seriously, and that thieves will be prosecuted. You can find a sample of this simple sign through the link at the bottom of this article.3. Take your security very seriously. Never joke, or tell anyone that your dummy cameras exist. If you do catch someone stealing an object, make sure that you contact the proper authorities. As Barney Fife of Andy Griffith fame always said, "nip it in the bud!" Your attitude toward shoplifters should be firm and resolute. This sets a precedent for everyone who enters your establishment.Simple and
    w background layer and filled it with an eye-catching yellow. From the layers-palette menu, I selected "Flatten Image" to merge the layers. I then cropped the headline to a 468x68-pixel banner using the Crop Tool. I cropped the headline so as to leave a good bit of yellow background around the text. When the crop was finally executed, the banner resized automatically to the dimensions I had entered into the tool's width and height fields.

    There are a couple of tricks that make precise crop selections easier. While holding down both the left mouse button and the space bar, the mouse can be used to move the crop selection into position. After the crop selection has been made, but before the selection is applied, the arrow keys can be used to nudge the crop selection precisely where desired.

    After flattening and cropping the banner, only one layer, the background layer, remained in the Layers palette. The special styles I wanted to apply to the banner cannot be done on the background layer, so I duplicated the layer. I could then apply additional layer styles to the banner. I renamed the duplicate layer as banner. Double clicking on the banner-layer thumbnail gave me access to the Layer Style dialog. I selected "Bevel and Emboss" from the Styles options. Clicking on "Bevel and Emboss" from among the available style options brought up another dialog box with a multitude of adjustments that I could apply to the bevel I wanted to use. After setting the adjustments, I applied the bevel to the banner. As a final touch, and also from the Layer Style dialog, I selected the "Stroke" option and applied a 1-pixel stroke (border) around the banner. This can be important because parts of the bevel can get lost in the background. I selected the color for the stroke from a sample taken from the bevel itself.

    After working through the design phase of the project, I found finishing the web page was easy. I used Dreamweaver 8 to create the HTML code necessary to insert and position the graphics. I also assigned the target URL to the headline and breakout-opportunity graphics.

    At this time, I coded the text and HTML for component 5. Aside from typing in the text, the coding consisted of assigning links to the anchor text.

    The last step was to upload the web page to the web site and the banner to the traffic exchange. Or was this the last step? Nope! I tested the web page in Internet Explorer, Firefox, and Netscape to be sure that the web page would display properly in at least these three browsers.As I coded the web page in Dreamweaver 8, I often checked the code by using the "Preview/Debug in browser" feature. So, the uploaded page looked right and worked right.

    In the end, "NUTS!" is a very simple and direct web page. It conveys the sales message in such a way that even a casual web surfer can absorb it at a glance and click through to the targeted web page to buy or to get additional information. Likewise, the banner stands out from the crowd to surfers on a busy traffic exchange.

    For a little R&R after launching the marketing campaign, I re-opened nuts.ai in Illustrator. I created a new background layer and filled it with a colorful gradient, using the Gradient Tool. From the Stroke palette, I created a 9-pixel "frame" around the artwork with a black, Miter-Join stroke. I exported the file as nuts.tif and printed the file onto Velvet Fine Art Paper. Web pages like the "NUTS!" web page can make eye-catching posters.

    Copyright © 2007 Royce Tivel
    How to Enhance an Online Marketing Campaign with Adobe Illustrator, Photoshop CS2, and Dreamweaver 8, March 6, 2007.

    HTTP = HTML link (for blogs, profiles,phorums):
    <a href="http://www.iadvice.info/article/65843/iadvice-How-to-Enhance-an-Online-Marketing-Campaign-with-Adobe-Illustrator-Photoshop-CS2-and-Dreamweaver-8.html">How to Enhance an Online Marketing Campaign with Adobe Illustrator, Photoshop CS2, and Dreamweaver 8</a>

    BB link (for phorums):
    [url=http://www.iadvice.info/article/65843/iadvice-How-to-Enhance-an-Online-Marketing-Campaign-with-Adobe-Illustrator-Photoshop-CS2-and-Dreamweaver-8.html]How to Enhance an Online Marketing Campaign with Adobe Illustrator, Photoshop CS2, and Dreamweaver 8[/url]

    Related Articles:

    Find Free Resumes Online

    Small Business Survival in Business Cycle

    Flat Rate Conference Call Service Options

    Bookmark it: del.icio.us digg.com reddit.com netvouz.com google.com yahoo.com technorati.com furl.net bloglines.com socialdust.com ma.gnolia.com newsvine.com slashdot.org simpy.com shadows.com blinklist.com