When you think about a product that you use, does an image come to mind? More than likely it does, because of the way our minds work. Taking this as a starting point when creating marketing sales copywriting; the words people that you use influence what they think and how they will respond to your message. The goal is to translate the benefits the person will receive when they use whatever product or service you are describing by creating an image in their mind.

No matter which way you slice up the pie, marketing is still about tuning into the network of human emotions which play a huge role in the purchase decision. Images that accompany advertising work best when the words are chosen with attention to this fact. There are several elements that create effective marketing sales copywriting, however what works in a print newspaper or magazine may not create the relevancy needed for the search engines.

Pay Attention to ‘Stop’ and ‘Power’ Words in Search Engine Optimization and Marketing Sales Copywriting

Aside from the domain name and TITLE tag of the website, the content that’s within the HEADING tags (H1, H2, H3 etc) get the attention of the search engine robot quickly. Using keywords here works to focus the reader’s attention as well as provides a solid piece of content for the search engines. With the attention span of the average person dwindling by the moment, it’s extremely important to choose your headline text to motivate the person to keep reading. That motivation comes from the emotional response to what they read.

For example, let’s look at two headlines :

1- “This is the Most Revolutionary Dental Product Discovery in 50 Years!”

2- “Medical Research Studies Prove Tooth Sensitivity Product Effective”

While both of these headline may grab attention, for the search engine robot, Headline Number 1 doesn’t provide enough substance. Using adjective like ‘revolutionary’ ‘exciting’ and ‘awesome’ may sound great, but how many times have you searched for a ‘revolutionary product?’ For the human visitor the words ‘revolutionary’ and ‘discovery’ could easily throw up the red flag and send their cursor to the back button of their browser.

The words used in Headline Number 2 are more relevant. Why? Because it’s more specific: the keywords ‘medical research studies’ along with ‘tooth sensitivity’ are more closely related to what people are searching for than ‘dental product.’ However avoid using this type of phrase if you cannot provide the citations to support it or the reader will feel deceived.

The other reason why Headline Number 2 will rank better is because of the evidence statement. Particularly when you are writing about anything health-related, people want to know it’s safe. When you are producing marketing sales headlines, think about the main resistance points like; safety, effectiveness or quality that are in the readers mind and find a way to address them from the beginning.

A variety of SEO experts have compiled a list of words that ‘stop’ the data processing flow; these words are valid, but filtered out by robots during their review of content. But if you think this list are primarily conjunctions like; ‘and’ ‘with’ or common words like; ‘the’ or ‘for’ prepare yourself to be surprised. If you are serious about marketing sales copywriting, be sure to visit Link Assistant. Here you will find a comprehensive and up-to-date list that includes quite a few words needed to make content easy to understand, such as;

• always
• seems
• make
• however
• could
• next
• without
• you
• value
• under
• hello

While it may be impossible to avoid every single one of these ‘stop’ words in your content, it’s a good idea to limit your use of them in Heading tags and headline text. The other set of words to be wary of are those that fall into the ‘hype’ category which are the words people have come to dislike.

Attuning your writing to the emotions that different words stimulate can help you avoid hype and embed your message in the reader’s mind. Creating marketing sales copywriting that builds search engine relevancy requires you to think, but more importantly to understand how language influences human behavior that drives decision-making.

Next up: Using Power Words in Marketing Sales Copywriting to Influence the Purchase Decision

The post How to Build Search Engine Relevancy with Marketing Sales Copywriting appeared first on Slaying Dragons in Codeland | Suneva Lightfoot's Blog.

What the heck does the term ‘kinetic typography‘ mean? While it has been defined as animating words, kinetic typography actually goes beyond this by using animation and special graphic effects to underscore the meaning of the words and then synchronizing all of this to music. In essence words and sound combine to breathe life into the message giving it the impact of imagery that places a honed beam of attention for the viewer.

Oliver Harrison get the credit for introducing this fabulous concept that brings joy and amazement to the loyal fans of typography. Here is the 1988 video:

Jesse Rosten because it’s not only educational, it makes the process of learning this typography technique enjoyable and fun.

While kinetic typography has been adopted for advertising purposes that have put it in the spotlight on mass media, it’s also found favor with designers across the board for expressing creativity pure and simple.

The New Black Typography 4-Piece Nail Polish Set Times Late Edition 3 x 0.125 oz (Image credit: The New Black)

Related articles

• Jon Contino on a Quest to be the Master of Typography
• 5 Typography Resources To Help With Your Designs
• The Late Movies: Kinetic Typography

The post Kinetic Typography: Tutorials for Adding Impact and Rhythm to Enhance Written Language appeared first on Slaying Dragons in Codeland | Suneva Lightfoot's Blog.

UPDATE:  A huge “Thank you!” goes out to Oliver Bross at MrMail.com for his steadfast support  and the Codelanders for their support and skill in restoring the amazing tutorials on the blog. The developers of these coding wonders make our jobs a lot easier and we are pleased to share them with you.

Website security has taken on a totally new meaning for online business operators as well as visitors to these websites. Beyond marketing our products and services, we have a responsibility to safeguard our customers from unpleasant encounters of the hostile kind.

I send greetings to all my friends and foes , yes Lightfoot is still here and the CodeLand19 are still standing, here today to launch our Website Security series from our brand new castle. My apologies for my absence goes out of all of the great people who subscribed to the CodeLand blog.

I suppose that we should be flattered that SOMEONE likes our work so much that they launched brute force and cross frame scripting attacks on the website, however I find it odd because I thought that myself and the CodeLand19 crew were nowhere near the fame of some bloggers on the Internet. Perhaps I was mistaken or perhaps this is the price you pay for being an active member of CodeLand.

CodeLand19 is hearty group of guys work around the Web as programmers, designers, researchers, writers and marketers, if you are interested in what we do, join in the conversation. Part of our code is to understand both sides of the Internet (white hat and black hat); it exists and should be respected, because this knowledge is how you can make the most of your online presence.

However, time and again, we encounter webmasters who shiver in their boots when they hear the phrase “Black Hat” and run screaming away from the conversation. But it simply is not enough to be careful not to use tactics that will get you kicked off the search engines; you have to understand how to deal with the fact that there are a group of people who apply these techniques and enjoy creating chaos and harm.

With that said, the other interesting note is that (as I discovered) these vagabonds are pretty in discriminate about who they choose to annoy. In any case, I refuse to become bitter about the experience: live and learn, it was time for the blog design to be refreshed anyway. But to save others from this situation, let me just share with you the valuable resources which helped overcome this situation.

Starting off with the brute force attack scenarios, where an unauthorized person uses a ‘bot’ to run through a whole series of passwords or MD5 hash combinations to gain access to your website. Lorelle.wordpress.com has a great write-up on the issue along with resources to assist you in the battle of protecting your website.

When it comes to Cross Frame Scripting it’s related to Cross Site Scripting but in this case the attacker uses an iframe to literally ‘frame’ your webpage and divert visitors from your website. You can find a ton of information at the Open Web Security Project.

Creating a website on WordPress has become immensely attractive because of the outstanding number of sophisticated themes and versatile plugins. As a result more people are investing their time and money to create business ventures. The dilemma that many people face is whether or not to upgrade their WP installation when they rely on plugins that are not compatible with the new version. Although I have been in the same position, past experience has proven that your work only becomes harder if you don’t. The upgrade may force you to drop plugins but without it your website is vulnerable.

Thanks to CodeLand19 members the bandits did not succeed in kidnapping our little castle on the Net, but unfortunately I have heard horror tales where people have lost everything. Open your mind to the reality that website security has to be taken seriously and make it a top priority.

Related articles

• Protect your WordPress blog with two-factor authentication
• Making Your WordPress Blogs More Secure
• WordPress Security – Cutting Through The BS

The post Website Security: Defend Your WordPress Installation against Brute Force and Cross Frame Scripting-Update appeared first on Slaying Dragons in Codeland | Suneva Lightfoot's Blog.

*Copywriting (Photo credit: Bazstyle | Photography)

Google dominates the world of search engines and as a copywriter myself, along with everyone in the Codeland crew, we were really happy to see their increased focus on the use of relevant keywords in website content. There are dozens of articles and tutorials on keyword research, unfortunately most of the information is too generalized to produce results. Relevant keywords are even more important today because of the increased online competition; but when it comes to copywriting, some clients insist using these general terms to deliver their message. Relevancy, or how closely a term relates to the subject,  is one of the things that differ between writing copy and copywriting.

What IS Copywriting?

Whenever I tell someone I am a copywriter, they often ask me: “what is copywriting?” In essence, my job is to use language in a way that distributes information to promote and publicize a person, an idea, a service, a place or a product. It’s the descriptive use of words used in marketing and advertising activities. The idea is to motivate the reader to take action, i.e. , “Clip this Coupon and Save $5 on Your Next Purchase” in an offline newspaper or “Follow This Link for Your Free Income Calculator”  on an Internet website.

A copywriter needs more than just a good command of language; an understanding of how language effects behavior is essential. It’s a proven fact that some words and phrases are more effective than others that mean the same thing.  If you drill down into the science even further, you’ll discover that these words are connected to primal human motivators; love, power, recognition and security.

What are Relevant Keywords?

The words a person uses when they search the Internet is usually more related to the solution they want than the product or service itself.  Understanding what’s beneath the surface of the features and benefits of a product or service are the keywords that make it relevant to the person searching for it. For example, a person looking to buy a lock for their door, might use the search query: “how to prevent robbery.”  A copywriter has to also consider the variables of the service or product. For instance, is it something that has a geographical reference? The language, phrasing and tone used to promote Texas barbecue is not the same as what would be used to promote McDonald’s.

Copywriting, Search Engines and Website Content

Google’s focus on “relevancy” as one of the qualifying points in ranking  websites has made the job of being a copywriter a little easier.  There are many websites that have misused keywords in their META tags and their content to gain high rankings in the search engines.  More times than I would like to remember, I have visited web pages that  reduced to gibberish because of the over use of keywords throughout the content.

On the other hand,  if the website title is “Sea Turtles in Madagascar” and the content is about scrapbooking, it also will fail to meet the visitor’s expectations.  Not only will this produce a poor ranking in the search engines, it will undoubtedly frustrate the Internet user who is searching for content related to the title of the website.W

hen you produce quality, relevant content you empower your visitor and increase your exposure.  As a copywriter and a website content producer, the challenge is to phrase the information to please humans and search engine bots at the same time.

Okay, So How Do I Do That?

Start with the basics to build your foundation. It definitely is important to know:

• who can use the information you want to distribute,
• why it will be of use to them,
• what benefits it offers them
• where they are looking for the information

Then start building your message by drilling down to the motivations:

• what is the basic need that your information is related to
• which terms are people using to search for it

All of this information is what the experts call “long-tail” keywords, combine them with your primary keywords and then you can begin to create the information for your website content. The more useful the information you offer to the reader, the greater your credibility and reader-loyalty will become.

It’s All about the Reader

Crafting your content so that it informs and provides the reader with a way to use or enhance the knowledge they receive brings even better results. Related information such as reference books, events, products or services depending on the subject of your content. An excellent resource for combining different methods to deliver knowledge to your audience is Lynda Felder’s book “Writing for the Web: Creating Compelling Web Content Using Words, Pictures, and Sound.”.

Keep in mind that when you are writing for your website, you best bet is to approach it like a conversation, instead of a report. A conversational tone engages people and helps them fully understand your message. However, respect your visitor’s time; get to the point of your paragraph quickly or you risk losing their attention.

A face to face conversation doesn’t include the shorthand code that’s used when sending text messages on a mobile phone.  So it’s a good idea to resist the temptation to use it when you write the information for your website,  unless of course, that is what your website is about.  It’s very convenient to think that everyone understands what these abbreviations represent, but that’s not the reality. It’s worth remembering that many of these terms have a short span of popularity; a few months from now, they may no longer be used. If you use these terms today, will your content make sense a year from now?

Providing information that makes sense and is easy for the reader to understand is probably the most important part of being a copywriter.

Next time, we’ll take a look at some of the technical  tools you can use for copywriting for relevancy.  Thank you for taking time to read this article.

Note: There is a poll embedded within this post, please visit the site to participate in this post's poll.

Related articles

• Search Engine Optimisation – Further Information (firstdigital.co.nz)
• 5 SEO Tricks to Build Your Brand (openforum.com)
• Now Live: Google Caffeine, So What Does It Mean For Your Website SEO…? (firstdigital.co.nz)
• Usability vs SEO: Getting The Right Balance | Loop11 (loop11.com)
• Search Engine Algorithms & Research (firstdigital.co.nz)
• Site Content Review & Copywriting (firstdigital.co.nz)
• Writing for Search Engine Spiders (firstdigital.co.nz)

The post Copywriters Applaud Google’s Focus on Relevant Keywords in Website Content appeared first on Slaying Dragons in Codeland | Suneva Lightfoot's Blog.

In this tutorial, we will explain how to take a flat logo and animate it using Photoshop’s new 3D and Timeline features. Let’s get started!

Tutorial Assets

The following assets were used during the production of this tutorial.

• Envato Logo

Step 1

Open the logo in Photoshop. Note that the PNG file contains transparency—this is important when we convert to 3D. There’s no need to adjust the image size since we will change it at the end when we save it as an animation.

Step 2

Select the Crop Tool and extend the top and bottom to give our scene more space. Hit Enter to commit to the changes.

Use the Rectangular Marquee Tool to select just the ‘envato’ text (the leaf is excluded) and click on the “Add Layer Mask” icon in the Layers Panel. This will isolate just the text.

Step 3

To make things easier, I’ve renamed the only layer to “Text.” Go ahead and make a copy of this layer, rename if “Leaf,” and click on the Layer Mask (this targets the mask, making it editable). Press Command/Ctrl + I to invert the selection and thus, isolating the leaf. The result should look identical to the original image that we opened. The only difference is that the text and leaf icon are now on separate layers.

With the “Leaf” layer still active, go to Layer > Layer Mask > Apply. This will remove all delete all pixels that were hidden by the mask.

Next, go to 3D > New 3D Extrusion From Selected Layer. This will automatically bring up the panels we need to work in our 3D scene.. If not, you can always go to Window > Workspace > 3D to force those panels open. Notice that the “Leaf” layer now appears as a 3D object llayer.

Step 4

In the 3D panel, select the “Leaf” object (denoted by the extruded star icon) and go to the Properties Panel and set the Extrusion Depth to 35. Also, deselect Catch Shadows and Cast Shadows.

We now need to move the “Leaf” object to the exact center of our scene. Before we do this, it will help to change our camera to a better view. Select the “Current View” layer in the 3D panel, then select the “Top” preset in the View setting .

On the canvas, use the onscreen widget to position the leaf in the exact center of our scene (denoted by the intersection of the red and blue lines).

Step 5

Currently, our canvas is showing the Top View. Select “Default Camera” in the 3D panel to reset the camera. Notice that the leaf object does not appear to be in its proper position. We will fix this in the next step.

Currently, the leaf appears out of position. To fix this, use the camera tools in the top menu to move the camera until the logo is properly placed. By moving just the camera, we can make the leaf object appear to be back in it’s proper position. It is important that we do not actually move the leaf object like we did in Step 4.

Step 6

Now, we’re ready to animate—click Create Video Timeline in the Timeline Panel. If you don’t see the timeline panel, then go to Window > Timeline.

When you do this, you will see all the layers displayed as separate video layers in the timeline. In this case, we will have two video layers.

Step 7

Since we want to animate the “Leaf” object, we need to access its properties in the timeline. Twirl-down the “Leaf” layer to show all properties that can be animated. For this aniamtion, we will focus on the “3D Scene Position.”

Click the stopwatch icon to Enable Keyframe Animation. This will add our first keyframe to our timeline (denoted by the yellow diamond).

Since Keyframe Animation is enabled, Photoshop will automatically add a keyframe when we make changes to the scene’s position (or rotation). Before we start rotating our scene, we need to indicate how long it will animate for. Do this by dragging the Current Time Indicator (denoted by the blue slider) to another point in the time bar.

Step 8

Back in the 3D Panel, select the “Scene” layer and go to the Properties Panel. In the Properties Panel, select the Coordinate icon and change the “Y Angle” value to 360. This will rotate the scene around its Y-axis 360 degrees.

Notice that a new keyframe has been added to our timeline. Using the Current Time Indicator, you can scrub back and forth to see how our 3D object animates. Since our “Leaf” object was placed in the exact center of our scene, we should see the leaf spinning in place.

Step 9

Our goal is to have the “Leaf” object appear to continually rotate around its axis while only showing the front face of the object. To do this, we first need to make a copy of our “Leaf” layer. In the Layers Panel go ahead and copy this layer. Notice that a copy of this layer also appears in our timeline.

Next, scrub through the timeline until the “Leaf” object makes three-quarters of a turn.

Grab the beginning of the “Leaf copy” video layer and drag it to the red line. This video layer is now cropped and will start animating right after the three-quarter turn.

Now, scrub over the first part of our animation and find the point at which the object makes its first quarter turn. This time, drag the ending of the “Leaf” video layer so it stops at the red line.

Finally, slide the “Leaf copy” video layer over to the red line. Scrub through the timeline to check that the animation is smooth.

Step 10

Before we render any frames, we have to tell Photoshop which frames we want rendered. Use the Current Time Indicator to scrub through our animation to locate the point where our object appears to make a full rotation. Use the slider immediately below the timebar to set the end of the work area. Now, only these frames will render.

Step 11

With our scene complete we can set up the final animated GIF. We will cover two options to save out our animation: Option 1 will quickly save out a low-quality GIF; Option 2 will take more time, but allow us to produce a high-quality GIF.

The first option is to go to File > Save for Web. This option skips the rendering process and will save out the frames as they appear on our canvas. Go ahead and change the settings as you see fit. Click Save when done.

Here is an example of the final animation using Option 1. Notice that the edges of the leaf appear jagged.

Step 12

The second option will require our scene to be rendered first. It is highly recommended to save at this point. Now, go to File > Export > Render Video and make the changes as shown. Make sure to select “Photoshop Image Sequence” as the output. This will render our scene as individual frames.

After all the frames have rendered, we can open them as an animation. Go to File > Open As and navigate to the folder we just created with all of our rendered frames. Select the first frame and click “Image Sequence” at the bottom of the window. Click Open. You will also see a dialogue box for the Frame Rate, just click OK.

The rendered images should automatically appear in a new timeline as a new animation.

Final Rendering

The last step is to save out the animation as a GIF. Just repeat Step 11 and you’re done!.

The post Quick Tip: Create an Animated 3D GIF in Photoshop CS6 appeared first on Slaying Dragons in Codeland | Suneva Lightfoot's Blog.

In this follow-up tutorial, we’ll optimize Magento, add a Redis cache, SSL and DNS alias, then scale the application for benchmarking and production. The following assumes you’ve already used the first tutorial to launch a basic Magento cloud application on Pagoda Box. Ready to optimize?

Requirements

You can download the finished code for this tutorial, or install Magento from a Quickstart to test a working site.

• A Pagoda Box Account (free)
• A functional local Magento Install
• Local Development Software (MAMP or WAMP)
• Git Installed (Can use SFTP)
• The Pagoda Terminal Client Installed

Fair Warning: Pagoda Box is not traditional hosting. This tutorial not only optimizes Magento, it lays the groundwork for a progressive continuous integration workflow.

Step 1: Enable eAccelerator, XCache or APC Cache

Enabling a Bytecode Cache will optimize performance, especially with large codebases such as Magento. You could use eAccelerator or XCache bytecode caching, but Magento recommends APC. To enable APC, simply add it to the list of php extensions in the Boxfile as follows:

web1:
  php_extensions:
    - apc

Your new Boxfile should look like this:

web1:
  name: mag-app
  shared_writable_dirs:
    - media
    - var
  php_version: 5.3.8
  php_extensions:
    - pdo_mysql
    - mysql
    - simplexml
    - mcrypt
    - hash
    - gd
    - dom
    - iconv
    - curl
    - soap
    - apc
  after_build:
  - "mv pagoda/local.xml app/etc/local.xml"
cron:
    - "*/15 * * * *": "curl -s -o /dev/null http://magento.pagodabox.com/cron.php"
db1:
  name: mag-db
  type: mysql

Step 2: Create a Redis Component

By default, Magento sessions on Pagoda Box are located in writable storage, and are accessible to all your web instances. This tutorial moves sessions to Redis, which is an “advanced key-value store”. Redis provides extremely powerful in-memory caching, coupled with persistent data for far better read, write, and session performance.

Create a Redis Cache from the Boxfile

First, enable the Redis extension by adding - redis to the extensions list in the Boxfile, just as we did for APC. This allows your PHP components to connect with Redis. Also add a Redis cache component to your Boxfile as follows:

cache1:
  name: mag-cache
  type: redis

Your updated Boxfile should look like this:

web1:
  name: mag-app
  shared_writable_dirs:
    - media
    - var
  php_version: 5.3.8
  php_extensions:
    - pdo_mysql
    - mysql
    - simplexml
    - mcrypt
    - hash
    - gd
    - dom
    - iconv
    - curl
    - soap
    - apc
    - redis
  after_build:
  - "mv pagoda/local.xml app/etc/local.xml"
cron:
    - "*/15 * * * *": "curl -s -o /dev/null http://magento.pagodabox.com/cron.php"
db1:
  name: mag-db
  type: mysql
cache1:
  name: mag-cache
  type: redis
  

When a Redis component is included in the Boxfile, a Redis cache is automatically added to your infrastructure when you deploy updates.

Alternate: Create a Redis Cache from the Dashboard

You can also create a Redis cache from the Pagoda Box Dashboard. The Dashboard is also where you scale the Redis component.

First, click “Add Cache” in the Dashboard.

…then choose Redis.

Once your new cache component has been deployed, click it in the Dashboard, then choose your preferred amount of RAM as follows:

Data is persistant with Redis, so you can resize the cache without losing sessions or caching data held in memory, unlike Memcache.

Step 3: Configure Magento for Redis Sessions and Cache

This tutorial shares a single Redis component for Magento sessions and caching. If your site receives enough traffic, creating a separate Redis component for both sessions and caching can provide an added measure of performance.

Redis Sessions

Configure Magento sessions to use Redis.

If you ever need to override Magento default files (like we will here), do not modify Magento’s core files. Override files should always reside in Magento’s Local Directory to protect functionality and future upgrades.

• Edit the session handler section of your local.xml file to use Redis, and set the session save path as follows:

  <session_save><![CDATA[redis]]></session_save>
  <session_save_path><![CDATA[tcp://tunnel.pagodabox.com:6379]]></session_save_path>
  

• Next, add Redis support to Magento by overriding a core Magento file. Copy the file:

  app/code/core/Mage/Core/Model/Session/Abstract/Varien.php
  

  Then create your own local version at:

  app/code/local/Mage/Core/Model/Session/Abstract/Varien.php
  

  In the new file, around line 62, add the following:

  case 'redis':
                  ini_set('session.save_handler', 'redis');
                  session_save_path($this->getSessionSavePath());
                  break;
  

Redis Cache

Now, configure Magento cache to use Redis, as well.

• Add the Credis library and Cm Module to enable Redis as a Magento cache. The module consists of one file, which you can download here. Although the Cm module author recommends installing via modman, modman doesn’t correctly register all submodules with Pagoda Box. Instead, save the file as: app/code/community/Cm/Cache/Backend/Redis.php.

  Add the Credis library as a Git submodule to your project:

      $ cd your_site_dir
      $ git submodule add git://github.com/colinmollenhour/credis.git lib/Credis
      

• Once again, edit the local.xml file. Change the cache delcaration and it’s contents as follows:

          <cache>
            <backend>Cm_Cache_Backend_Redis</backend>
            <backend_options>
              <server>tunnel.pagodabox.com</server>
              <port>6379</port>
              <database>0</database>
              <force_standalone>0</force_standalone>
              <automatic_cleaning_factor>0</automatic_cleaning_factor>
              <compress_data>1</compress_data>
              <compress_tags>1</compress_tags>
              <compress_threshold>20480</compress_threshold>
              <compression_lib>gzip</compression_lib>
            </backend_options>
          </cache>
  

• Set far future expires to drastically reduce the number of requests per visitor as they browse your site. Do this after finishing frontend theme work. Adding the following static_expire directive to the web1 section of your Boxfile will expire static asset caches after 1 year.

  web1:
    static_expire: 31536000
  

• Add the updated files to git, commit and push to Pagoda Box.

  	$ git add .
  	$ git commit -m 'installed and configured redis'
  	$ git push pagoda --all
  

• After deploying, clear the Magento system cache by logging into your Magento admin and going to System -> Cache Management, then clicking ‘Flush Magento Cache’.

NOTE: Avoid JS & CSS in Writable Storage

Magento has a few optimization utilities that merge javascript and css files, then place them in Pagoda Box’s shared writable storage. Most of the time, that’s a non-issue, but at high traffic volume, Pagoda Box can access files from the distributed web instances much faster than files in shared writable storage. For high traffic performance, keeping javascript and css in the repo outperforms minification.

To turn file merging off, log into your Magento admin panel, then navigate to: System > Configuration > Developer

Choose “No” under JavaScript Settings and CSS Settings as follows:

Step 4: Verify Redis is Working

Now that Magento is configured for Redis, verify that everything is working. Follow this Redis guide to establish a secure tunnel, then use the terminal to access Redis on Pagoda Box. Once connected, run the following command to display a list of all stored keys.

$ keys *

Assuming you’ve browsed the udpated site, you should see a list of assorted keys. If you see session keys only, cache keys only, or if you don’t see any keys at all, review your configuration settings and ensure you’ve cleared the Magento cache.

For a full list of useful commands when using Redis, see their official documentation.

Step 5: Adding DNS / SSL

Piggyback SSL is free and automatic for every app on Pagoda Box at their app’s subdomain (appname.pagodabox.com). While it’s possible to benchmark using Piggyback SSL, we’ll enable Third-Party SSL for purposes of the tutorial. Wildcard Certs and Self-signed SSL are detailed in this
“>DNS / SSL guide.

Add SSL

Begin by clicking the “Add an SSL Certificate” button under the DNS / SSL Tab in the Pagoda Box dashboard.

Next, choose whether you’re creating a certificate, or using an existing SSL certifcate, as we are here. Assuming you’ve got an existing certificate, click “Transfer Existing”.

Finally, paste the relevant information into the appropriate field and activate. Your SSL Certificate is now saved with your application.

Add A DNS Alias

After you’ve entered an SSL Certificate, it will appear in your list of available SSL Certificates. If you haven’t already, add your custom domain as a DNS Alias to your application. Click “Add New Alias” and enter your registered domain as the alias. Pagoda Box will assign a shared IP address by default, but this will change when you associate an SSL certificate with the DNS Alias.

Finally, associate your SSL certificate with your DNS alias by selecting it from the SSL dropdown list next to your DNS Alias, then click “Save”. With the SSL certificate now tied to your DNS Alias, your alias gets a unique, dedicated IP address.

Once you associate an SSL Certificate with a DNS alias, that alias will get a dedicated IP address. Make sure to verify that your A-Record matches the IP provided after you add, delete or modify your SSL Certificates.

Step 6: Benchmark with Blitz.io

We’ve used Blitz.io to benchmark a few Magento applications. It tests both http response and database writes using variable lists URLs and Cookies.

To start, create a free account on Blitz.io. Once you’ve registered, look for the “START!” button at the bottom of your welcome page.

Click “Start”, and Blitz will provide a series of simple tutorials that explain the variables you’ll use in a Query URL to test your application. For our purposes, your base Query URL should look something like this:

-p 1-24:60 -r california -T 4000 -v:cookie list[d1b1530ff8694817e1f11f55e0a4a120,805d9a11f3b9f8ea35ee2db1d9aac3fc] -v:urls list[index.php,furniture.html,ottoman.html,about-magento-demo-store,checkout/cart/add?product=51] -b "my-cookie=#{cookie}Ó http://magento-demo.pagodabox.com/#{urls}

Specifically, that query will gradually test 1-24 concurrent visitors (can test to 250 with Free account) over 60 seconds, from California, timing out at 4 seconds. The query also sets a list of cookies and URLs as variables, plus the domain we’re testing. We’ve included a Home page, CMS page, Catalog page, Product page and Checkout page to test.

Using Cookie variables and a checkout/cart/add?product URL lets us test the DB writes. Obtain a list of valid cookies by navigating your site in Chrome > Inspect Element > Resources > Cookies > [yoursite] > frontend. Copy the key from the Value column, as indicated below:

Replace the cookies, URLs and Domain from the URL query above with the appropriate elements from your site, then enter the new query on Blitz.io, and click “Run”.

The first time you “Rush” your app, Blitz will display an Authorization Error and ask you to prove ownership by adding a specific URL to your app. Follow the onscreen Blitz instructions for creating a unique authorization file on your local computer, then push changes to Pagoda Box.

	$ git add .
	$ git commit -m "blitz auth file"
	$ git push pagoda --all

Confirm the new file is in place by visiting the URL in a browser. You should see “42″. Note that the “root of your www directory” is the root of your project unless you have configured document_root in your Boxfile to be another directory.

Once everything is in place, you’re free to adjust Blitz variables and test. For example, changing 1-24 to 60-60 will change concurrency from a graduated increase to 24 concurrency to 60 sustained concurrent visitors. Isolating URLs in the variable list allows you to identify performance bottlenecks by isolating various page types. You can even test DB write capacity by using the checkout/cart/add? url.

Of course, benchmarking is simply an indicator to help scale the application. Make sure to scale to various levels as you benchmark, noting the change in results (see Scaling Magento video). Blitz.io should help identify application bottlenecks and determine the appropriate scale for your expected traffic.

Step 7: Scaling on Pagoda Box

There has been quite a bit of initial prep work to get to this stage, but this is where it all comes together. Continuous integration, ongoing management, and scalability are now much simpler. As you benchmark, keep in mind that charges are hourly. Scaling to test briefly will cost only a few dollars.

Scaling Web Instances

To scale your web application for more traffic, open your Web Component from the Pagoda Box dashboard as follows:

Then, click and drag the slider to the desired number of instances, and click “Save”. Pagoda Box will deploy Magento from your repository to new instances. After all instances are built and verified, the routing layer will redirect traffic to the new instances, and decommission the old without any downtime (again, see Scaling Magento video).

Note: As you’re using it, the slider appears to max out at 25 instances, but will reset for greater scaling after the upper limit has been saved.

Scaling a Database : Cloud (Cache Components are identical)

To scale your cloud database, open your Databsase Component from the Pagoda Box dashboard as follows:

Notice the Red Face is unhappy because RAM usage is too high. To increase RAM, click the green “Change” arrow, select your desired amount of RAM, and click “Save”.

Pagoda Box will create a larger database, migrate data, sync via master-master replication, then point your application to the new database. Your site is live throughout the migration.

Scaling a Database : Private

To scale your Private database, open your Databsase Component from the Pagoda Box dashboard as follows:

Select the resources you’d like for your database, determine if you’d like replication, then click “Save”.

Pagoda Box will create a larger database, migrate data, sync via master-master replication, then point your application to the new database. Your site is live throughout the migration.

Keep in mind that ordering a Private database may take more than 20 minutes, as a server is provisioned to your specifications.

Note: currently, scaling from a Cloud database to a Private database requires some downtime as you manually migrate data. Scaling from Cloud to Cloud, or Private to Private is always automatic.

Summary

That’s it! Your Magento application is now fully scalable in an instant, and updates are easily deployed with $ git push pagoda --all. Enjoy!

The post Optimize Magento in the Cloud appeared first on Slaying Dragons in Codeland | Suneva Lightfoot's Blog.

Let’s admit it: the PHP community has lagged a bit, when it comes to advocating test-driven development. We know we should, but, even to this day, a sizable portion of the community does not. In this new series of videos and tutorials, created by the Nettuts+ team, we’re hoping to change that.

Trust me: it’s not as tough as you think.

Lesson 1 – Setup

In this series, we’ll be using Composer, a dependency manager, to install PHPUnit (or at least, the unofficial version for now). To ensure that we’ve installed it properly, we’ll also create a quick calculator test and class.

Related articles

• The Official Rackspace Blog – Software Developers Forum – Test-Driven Development (rackspace.com)
• Zurmo Gamified Open Source CRM Releases Beta Version (prweb.com)
• Nexcess Enhances Hosting Services with PHP-FPM (prweb.com)

The post Test-Driven Development in PHP: First Steps appeared first on Slaying Dragons in Codeland | Suneva Lightfoot's Blog.

Photoshop layer styles are a popular way to add effects, such as drop shadows and strokes, to layers in a non-destructive way. With the right knowledge and experience, any effect can be achieved. To achieve these effects, however, you need to understand what each setting does and how they can be combined to create a certain look. In this series by John Shaver from Design Panoply, we will explain every aspect of Photoshop’s layer styles feature and show you how to unlock their potential.

In this article, Part 7: How to Apply the Satin Setting to Layer Style Effects, we will explain the settings behind Satin and the ways it can be used to create different effects. Let’s get started.

The Uses For Satin

Satin is one of the more obscure settings within Photoshop Layer Styles, but if you know how to use it, you can create a few different effects.

In addition to creating a silk or satin look, it can also be used to add additional depth and even more realistic detail to glass and metal effects.

The Layer Styles Satin Dialog Box

Satin creates two copies of your layer, then offsets and blurs them to produce the final result. You may not be able to picture it, but it is easy to understand once you see it in action.

There isn’t much to the Satin dialog box, and we have seen most of these settings before. All that’s left to do is jump in and see how they interact with each other.

Blend Mode

The Blend Mode allows you to set the blending mode for your Satin, while the color box, expectedly, allows you to choose the color.

A good place to start is Linear Burn using the color black, or Linear Dodge (Add) using the color white. This will allow you to see how Satin works, while at the same time applying the most realistic looking effect.

If you are unfamiliar with how all the different Blending Modes work, I highly recommend checking out the Blending Is Fun Basix tutorial.

In the following example, using a white color with Linear Dodge (Add) as the blending mode lightens our text while using black with Linear Burn as the blending mode darkens it.

Opacity

Our good old friend Opacity. A smaller number here makes for a more subtle effect and increasing the Opacity makes it more pronounced.

In the following example, you can see that a lower Opacity has a predictably more subtle impact on our final effect.

Angle

The Angle spinner sets the angle at which our Satin effect is offset from the original shape. You can enter a number in the box, or drag the line around using your mouse.

The following example may not be the prettiest, but it clearly shows how adjusting the Angle can change the look of your style. Used in conjunction with other effects, changing the Satin Angle can help you get more realistic looking lighting.

Distance

The Distance slider changes the distance that the Satin gets offset from our original shape. This is extra helpful when you are trying to create reflections for glass styles.

In the following example, you can see how slightly increasing the Distance of our white Satin effect gives us bigger reflections on our glass text.

Size

The Size slider sets the blur size of the Satin. The larger the value is, the blurrier it gets. A modest Size value will typically yield the most realistic results.

In the following example, the lower Size setting gives the lighting on our cookie style a harder edge.

Contour

Contour curves change the falloff of the Satin effect. A linear or slight “S-curve” are the best to begin with. More dynamic Contour shapes can help you get more interesting reflective effects.

The Anti-aliased checkbox will smooth out any hard edges when checked, and the Invert checkbox will flip your Contour upside down.

In the following example, you can see how changing our Contour gives us a more reflective looking double highlight on our text.

Saving and Loading Default Settings

You can save and load default settings for each effect in the Layer Styles dialog box. By clicking “Make Default”, Photoshop will store whatever settings are currently active as the new default settings for that effect.

By clicking “Reset to Default”, Photoshop will then load whatever settings were last saved. This allows you to experiment and simply reload custom default settings if you want to start over.

One For The Road

Until next time, this free, exclusive layer style and accompanying .PSD will show you some clever usage of the Satin effect.

The post How to Apply the Satin Setting to Layer Style Effects appeared first on Slaying Dragons in Codeland | Suneva Lightfoot's Blog.

If Apache has always seemed like a black box to you, it’s time to learn just what’s going on behind the scenes!

Apache is the most popular web server available.

A web server’s job is basically to accept requests from clients and send responses to those requests. A web server gets a URL, translates it to a filename (for static requests), and sends that file back over the internet from the local disk, or it translates it to a program name (for dynamic requests), executes it, and then sends the output of that program back over the internet to the requesting party. If for any reason, the web server was not able to process and complete the request, it instead returns an error message. The word, web server, can refer to the machine (computer/hardware) itself, or the software that receives requests and sends out responses.

Apache is the most popular web server (after which comes Microsoft’s IIS) available. The reasons behind its popularity, to name a few, are:

1. It is free to download and install.
2. It is open source: the source code is visible to anyone and everyone, which basically enables anyone (who can rise up to the challenge) to adjust the code, optimize it, and fix errors and security holes. People can add new features and write new modules.
3. It suits all needs: Apache can be used for small websites of one or two pages, or huge websites of hundreds and thousands of pages, serving millions of regular visitors each month. It can serve both static and dynamic content.

What is Apache?

Functionality that you don’t need or want can easily be removed.

The Apache HTTP server is a software (or program) that runs in the background under an appropriate operating system, which supports multi-tasking, and provides services to other applications that connect to it, such as client web browsers. It was first developed to work with Linux/Unix operating systems, but was later adapted to work under other systems, including Windows and Mac. The Apache binary running under UNIX is called HTTPd (short for HTTP daemon), and under win32 is called Apache.exe.

Installing Apache on Linux does require a bit of programming skills (though it is not too difficult). Installing it on a Windows platform is straight forward, as you can run it through a graphical user interface.

Apache’s original core is fairly basic and contains a limited number of features. Its power rather comes from added functionality introduced through many modules that are written by programmers and can be installed to extend the server’s capabilities. To add a new module, all you need to do is install it and restart the Apache server. Functionality that you don’t need or want can easily be removed which is actually considered a good practice as it keeps the server small and light, starts faster, consumes less system resources and memory, and makes the server less prone to security holes. The Apache server also supports third party modules, some of which have been added to Apache 2 as permanent features. The Apache server very easily integrates with other open source applications, such as PHP and MySQL, making it even more powerful than it already is.

A web server in its simplest form is a computer with special software, and an internet connection that allows it to connect to other devices.

Every device connected to a network has an IP address through which others connect to and communicate with it. This IP address is sort of like a regular address that you need in real life to call or visit any contact of yours. If they didn’t have an address, you wouldn’t know how to call or reach them. IP addresses serve the exact same purpose. If a device didn’t have one, the other machines on the same network wouldn’t know how to reach it.

The Apache server offers a number of services that clients might make use of. These services are offered using various protocols through different ports, and include: hypertext transfer protocol (HTTP), typically through port 80, simple mail transfer protocol (SMTP), typically through port 25, domain name service (DNS) for mapping domain names to their corresponding IP addresses, genearlly through port 53, and file transfer protocol (FTP) for uploading and downloading files, usually through port 21.

How Apache Works

Apache’s main role is all about communication over networks, and it uses the TCP/IP protocol (Transmission Control Protocol/Internet Protocol which allows devices with IP addresses within the same network to communicate with one another).

The TCP/IP protocol is a set of rules that define how clients make requests and how servers respond, and determine how data is transmitted, delivered, received, and acknowledged.

The Apache server is set up to run through configuration files, in which directives are added to control its behavior. In its idle state, Apache listens to the IP addresses identified in its config file (HTTPd.conf). Whenever it receives a request, it analyzes the headers, applies the rules specified for it in the Config file, and takes action.

But one server can host many websites, not just one – though, to the outside world, they seem separate from one another. To achieve this, every one of those websites has to be assigned a different name, even if those all map eventually to the same machine. This is accomplished by using what is known as virtual hosts.

Since IP addresses are difficult to remember, we, as visitors to specific sites, usually type in their respective domain names into the URL address box on our browsers. The browser then connects to a DNS server, which translates the domain names to their IP addresses. The browser then takes the returned IP address and connects to it. The browser also sends a Host header with the request so that, if the server is hosting multiple sites, it will know which one to serve back.

For example, typing in www.google.com into your browser’s address field might send the following request to the server at that IP address:

GET / HTTP/1.1
Host: www.google.com

The first line contains several pieces of information. First, there is the method (in this case it’s a GET), the URI, which specifies which page to be retrieved or which program to be run (in this case it’s the root directory denoted by the /), and finally there is the HTTP version (which in this case is HTTP 1.1).

HTTP is a request / response stateless protocol.

HTTP is a request / response stateless protocol. It’s a set of rules that govern communication between a client and the server. The client (usually but not necessarily a web browser) makes a request, the server sends back a response, and communication stops. The server doesn’t look forward for more communication as is the case with other protocols that stay at a waiting state after the request is over.

If the request is successful, the server returns a 200 status code (which means that the page is found), response headers, along with the requested data. The response header of an Apache server might look something like the following:

HTTP/1.1 200 OK
Date: Sun, 10 Jun 2012 19:19:21 GMT
Server: Apache
Expires: Wed, 11 Jan 1984 05:00:00 GMT
Cache-Control: no-cache, must-revalidate, max-age=0
Pragma: no-cache
Last-Modified: Sun, 10 Jun 2012 19:19:21 GMT
Vary: Accept-Encoding,User-Agent
Content-Type: text/html; charset=UTF-8
Content-Length: 7560

The first line in the response header is the status line. It contains the HTTP version and the status code. The date follows next, and then some information about the host server and the retrieved data. The Content-Type header lets the client know the type of data retrieved so it knows how to handle it. Content-Length lets the client know the size of the response body. If the request didn’t go throw, the client would get an error code and message, such as the following response header in case of a page not found error:

HTTP/1.1 404 Not Found

TCP/IP Protocol

TCP/IP is actually two protocols built one on top of the other.

TCP/IP is actually two protocols built one on top of the other. The IP protocol is responsible for getting the transferred data from one point to another. It takes the data to be transferred between the two points, splits it into smaller packets, attaches the source and destination addresses to each packet, and transfers the data.

TCP handles the part that includes establishing the connection between the two parties, making sure the data arrives to its destination, taking care of any data loss and managing data recovery.

Once a message is received, the destination party sends an Acknowledged (ACK) message to the sending host if all goes well, notifying it of data arrival. If something goes wrong, such as the occurrence of a data loss situation, the destination sends a Not Acknowledged (NAK) message instead, notifying the sending host of the problem and informing it of the need to resend the data packet.

As discussed earlier, Apache offers many services, which clients might want to connect to, to make use of or benefit from. TCP manages each service so that it is accessed through a particular port to differentiate between the various services. This way, it ensures that any one given interface (or host) can offer multiple services. So when a client connects to a host, it passes the port number along with the IP address. Browsers use the HTTP protocol which by default uses port 80, so there’s no need for further specification.

The following image is a snap shot of my FTP software (WinScp). As you can see, to FTP my server I not only need to provide the IP address (or alternatively type in the domain name), but I also need to specify the port number that my server provides the service through. In the case of FTP, the port number is 21. In the case of SFTP (secure FTP), the port number is 22.

Under UNIX, a list of services offered along with their respective port numbers can be found in the file /etc/services. The following command will display the contents of the file:

more /etc/services

Below is a screenshot showing a part of the file. As you can see, services are listed in the first column, followed by the port number to be accessed at and the protocol name the service uses.

Under windows the file is called Services, and can be found under C:WINNTsystem32driversetc

Inetd

To preserve system resources, UNIX handles many of its services through the internet daemon.

To preserve system resources, UNIX handles many of its services through the internet daemon (inetd), as opposed to a constantly running daemon. The inetd is a super server that listens to the various ports and handles connection requests as it receives them by initiating a new copy of the appropriate daemon (program). The new copy of the program then takes it from there and works with the client, and inted goes back to listening to the server ports waiting for new client requests to handle. Once the request is processed and the communication is over, the daemon exits.

General Structure

As mentioned earlier, Apache can be installed on a variety of operating systems. Regardless of the platform used, a hosted website will typically have four main directories: htdocs, conf, logs, cgi-bin.

htdocs is the default Apache web server document directory, meaning it is the public directory whose contents are usually available for clients connecting through the web. It contains all static pages and dynamic content to be served once an HTTP request for them is received. Since files and sub-directories under htdocs are available to the public, correct handling of file permissions is of great importance so as not to compromise the server’s safety and security.

conf is the directory where all server configuration files are located. Configuration files are basically plain text files where directives are added to control the web server’s behavior and functionality. Each directive is usually placed on a separate line, and the hash (#) key indicates a comment so the line proceeded by it is ignored.

logs is the directory where server logs are kept, and includes Apache access logs and error logs. The Apache HTTP Server provides a variety of different mechanisms for logging everything that happens on it, from the initial request, through the URL mapping process, to the final resolution of the connection, including any errors that may have occurred in the process. In addition to this, third-party modules may provide logging capabilities, or inject entries into the existing log files, and applications such as PHP scripts, or other handlers, may send messages to the server error log.

cgi-bin is the directory where CGI scripts are kept. The CGI (Common Gateway Interface) defines a way for a web server to interact with external content-generating programs, which are often referred to as CGI programs or CGI scripts. These are programs or shell scripts that are written to be executed by Apache on behalf of its clients.

It is important to note that the above discussed file and directory names (as well as locations) can differ from one server to another depending on the Apache flavor installed and the operating system it runs under. The roles though remain the same.

Conclusion

…with more than half of the sites on the web running on it.

Apache has been the most popular web server on the internet since 1996, with more than half the sites on the web running on it. It played a key role in shaping and making the World Wide Web what it is today. The reasons behind its success are obvious and the way things are looking, it will probably stay in the lead at least for quite some time. This was meant to be an introductory session to this powerful piece of software and I hope it was of help in understanding what this great tool is and how it generally works.

Related articles

• Running Multiple Websites on a Cloud Server with 1 IP (rackspace.com)
• Apache Libcloud graduates to a Top Level Apache Project (rackspace.com)

The post An Introduction to Apache appeared first on Slaying Dragons in Codeland | Suneva Lightfoot's Blog.

Each week, we feature the work of some of our favorite artists and designers for you to enjoy. In this article, we will showcase the work of Psdtuts author, Liran Szeiman. Let’s take a look!

Technification

Retreat | Tutorial

Untruth – HM9

Lurking Back

Rapto

Hysterical Banana

Karke

Bajo Presion

Nina

Howl

The post The Digital Illustrations of Liran Szeiman appeared first on Slaying Dragons in Codeland | Suneva Lightfoot's Blog.