Michael Sunarlim

Web Developer, Producer and Internet Marketer

Showcased on .net Magazine

Working at Bluelounge, we have been featured in many publications both online and print. As the web developer/producer, this time I am very excited because our website is showcased in .net magazine, which is popular amongst web designers and developers. You can check it out in their April 2012 #226 issue here. The article is under Gallery/CMS section on page 72.

.net Magazine #226 (cover)

.net Magazine April 2012 Cover

.net Magazine #226 (page 72)

Page 72 (click to zoom)

My thanks to Ryan Taylor for featuring Bluelounge website in this great magazine.

Remote Backup your VPS/Dedicated Server

There is no such thing as being too safe in terms of managing web server. Your hosting provider may have provided complimentary daily backup to your VPS or Dedicated Server, you do weekly and monthly backup of your FTP files and database, but still worse thing can happen which you do not expect. The consequences can be fatal: permanently loose some or all of your data.

If you already do the regular backup then you can probably restore everything with the cost of your time, or the hosting support team may assist you to restore their daily backup. Then again, there is a possibility their backup is on the same node that is having the problem.

Having a remote backup is one of the most simple precaution you can do to add another layer to your disaster recovery plan. One of the reasons web/IT people hesitate to do this is because it means doubling the cost of the web server since you need to host a new one in preferably different location. Well, in my case this obstacle has been solved as I managed to find a couple of companies that offer special product only for this purpose.

How Does It Work?

Unlike most web hosting providers that offer complete tunning services that include web server, email, database, etc,  a backup only plan will only offer a large disk space that you can access via FTP. To do the automatic backup, you can use Rsync which is a great Unix tool to do increment copies of your server files. That combined with cronjob setting, you get an automatic, regular, secure, and efficient backup of your server.

Who Offers This Kind of Service?

When I did my research, I found two companies with good reputation that can provide FTP backup plan with very reasonable pricing. They are not big players in the hosting industry, but they offer excellent service and I am very happy with the results they one of them so far. Here are the links to those ompanies you need to check:

There you go, hopefully this little tip can help you to sleep better at nights knowing your server files are backed up and you have a complete backup of your files on different server.

Quick Recap of 2011

The final days of the year have finally come. Not to be shy, but I feel 2011 is a very productive year and the team. Let me do a quick recap:

Bluelounge

We launched 7 products this year, should be more if we consider the soft goods as multiple items! All of them are amazing too, but MiniDock and Milo got the most attention. In case you have not heard of them, then you should check them out. My personal favorite is the Bonobo iPad Sleeve. Here are the complete list:

On top of those awesome products, we also launched EU Web Store. I cannot really provide you the link as it was designed to automatically detect your IP address and direct you to the correct store based on the region you are in. You can switch between stores from this page. Our EU Store only ships to 36 countries within Europe, while the US and Global customers will still be shipped from our LA warehouse.

Web Projects

Outside of Bluelounge, I was also given the opportunities to work on few exciting projects:

Sorry to keep this short in the end. Many stuff could be talked about here, but since this is the last day of the year I should enjoy it more instead of still stuck in front of my laptop. Next year I will try to post more often, the determination from a year before which I totally failed :) Happy New Year!

Measuring Your Web Campaign Performance

Whether your doing Adwords campaign, email blast, or online media partnership, you need to know if the time and money you have spent will give the results that you are expecting. The type of results may vary, depending on your objectives. Some want to get direct conversions to their online stores, others are happy to get a spike in their websites traffic and brand recognition.

Preparations

Whatever your target is, you need to make sure that you have prepared most of the aspects so you can measure or benchmark the campaign performance. Here are a few tips I can share in order to do so:

Prepare your analytics code

Google Analytics Logo

In this case and most of my posts, I am going to refer to Google Analytics since it is the most popular analytics tool and free. I am not going to explain the steps as I am sure most of you already know how, but make sure you have set the following settings correctly:

  • time zone
  • e-commerce and currency
  • default page

Those settings are to make sure you will get the most accurate data when Google is collecting your visitors’ information.

Set your analytics goals

Within your Analytics panel, set your goals and test to make sure they work and trackable. If you run and online store, make sure the analytics code is working so you can track the transactions accurately. Most modern shopping cart systems have modules that are optimized to integrate nicely with Google Analytics.

If possible, create custom links for your campaign

You can track the source of traffic in most cases within needing any additional preparations, but you will have more advantages if you can set unique links used within your campaign. In case the system you use does not support auto-URL generation for this purpose, you can always use Google Analytics’s URL Builder Tool to generate them manually.

Getting the results

Once you are done with the preparations, then you are good to go with your campaign. Schedule the most effective time, get it started, then sit down and wait. I would suggest to wait at least 24 hours after the campaign has ended before checking on the results, unless you do not need the most accurate data yet.

So what are the things that we need to look at?

Increase in traffic

Your campaign would be considered a total failure if you do not get any extra number of visits during your campaign period. If you run it with a web marketing partner, you may want to compare the traffic they promised to drive with the actual one you are getting. Let’s say they claimed to reach 100,000 users, then you should expect at least to get additional 5,000 new visitors (5% click-through rate) from their network.

Google Analytics graph

Checking the number of visits is not enough though. The following dimensions are also important to measure if you have reached to the right market:

  • Pages/Visit – indicates the level of interest to your company/brand/website
  • Average Time on Site – shows the level of interest to your specific product/page
  • Bounce Rate – lower means a good thing

Number of transactions and revenue

If you run an online store, this is most likely the most important–if not the only–thing that counts and you would expect to get as high of numbers as possible here. A successful e-commerce campaign means you gain more in revenue than what you spent, although it is not always the case. More interesting details can quickly be drawn from these values:

  • Conversion Rate – high conversion rate means you are hitting the right market
  • Average Transaction Value – are you getting higher or lower average transaction compared to your regular traffic?
  • Average Number of Products per Transaction – good to know if your products can encourage sale between each other

For those of you who offer a special coupon code for the campaign, that can be the easiest and more “real time” method to measure the results. Just look from your shopping cart system for orders that use XXXX code, those are conversion from your campaign.

Check the results from other goals/targets

Getting direct web sales are not the only score you can use, you might not even have an online store to begin with. So what else to check, what are the valuable items can be extracted? Well here are few, just to give you an idea:

  • Newsletter sign up – consider visitors who sign up to your newletter as your “warm prospect”; they are definitely interested with what you are selling, but maybe the timing is just not right
  • Social media sharing – this actually can generate more traffic if your visitors decide to share the link to whatever social platform they like, whether it be Twitter, Facebook, Reddit, etc
  • Contact you – if you are offering a service instead of product, then getting contacted denotes a successful conversion; even if you are selling a product, a potential customer inquiry is a very positive thing

There are still many things to talk about based on this topic and have probably been covered by many blogs and books. I am just writing the short and practical version for small-medium business. I think I am going to update this post often, should I get many interests from you.

Favorite Safari Extensions

In November 2010, Apple officially introduced extensions to their popular browser Safari. It was one of the most requested features and with the release of version 5 of the browser, customers were finally able to add functionalities to their favorite browser. Apple provides Safari Extensions Gallery for users to browse  extensions which can be easily installed in a few clicks.

Here are my top 5 extensions that I use regularly:

Delicious

Delicious

If you use Delicious bookmarking service, then you need to install this immediately. This plugin by jeveaux.com will add a button on your toolbar and with a single click, you can save web page you want to bookmark. This plugin is hosted on Github and can be downloaded here.

ScribeFire

ScribeFire

ScribeFire is an extension for the Mozilla Firefox Web browser, Google Chrome Web browser, Opera Web Browser, and Apple Safari Web browser that allows you to easily post to all of your blogs. Once you have set up your blog properly, you can will be able to start writing and posting right on your browser without requiring to open and login to your blog admin panel. Pretty cool.

Awesome Screenshot

Awesome Screenshot

With Firefox, you can find dozens of web capture plugins. In Safari, Awesome Screenshot is one of the best and most simple one. It also gives you extra features like to annotate and share.

1Password

1Password

While it does not fall as a pure Safari extension, it is only one of the so many awesome features from 1Password, it is almost impossible to pass a single day without using it. 1Password itself is a cross-platform password manager and generator. Currently it is available for Mac, PC, iOS and Android. It also works with DropBox to make it super easy for you to sync across different machines.

ScribeFire: Fire up your blogging

The year is coming to an end. How many real posts I published in 2010? Only about ten, and the last one was almost 7 months ago. Where is my motivation to publish more stuff? Well now I just found a new web service / browser extension called Scribefire. The Idea is I can publish post more easily right from my browser and start writing right that minute. Will this encourage me to post more often? We’ll see….

By the way, ScribeFire works in Firefox, Chrome and Safari.

My Favorite Coda Plug-Ins

Coda

Panic Coda

I have to admit it, Coda by Panic is really one of the best Mac apps ever. Not only it has finally given me the better direction in developing HTML/CSS correctly, it also makes it more fun! It is quite a shame that Panic has not been updating it for a few months now, but that does not make it less powerful.

Why? Because Coda supports third-party plug-ins to enable you add more functions on top on the ones that come with the application itself. No, those plug-ins will not automatically create a website for you.. Consider them like as WordPress plug-ins or widgets, simple and small functions but if collected and used properly can save you hours of development time.

You can get a long list of the officially supported plugin-ins on Panic’s Developer section. To help you in choosing the right ones, here are my favorites:

  • Lorem Ipsum
    Generate 1 to 5 paragraphs of Lorem Ipsum placeholder text.
  • Remove Trailing Whitespace
    Trims whitespace from the ends of lines.
  • Replace Special Characters
    Converts almost all special symbols and characters into HTML entities.
  • TEA for Coda (not listed on Panic’s website)
    Text Editor Actions for Coda (formerly “Textmate Emulation Actions”, and always TEA for short) is a plugin that emulates some of my favorite Textmate HTML.bundle actions.
  • CSS Tools
    Performs automatic reformatting of CSS.

If you have your own favorites, please feel free to share them below.

Tools to Build Your Contact Form in Less Than 5 Minutes

When you go to a really cool website and want to contact the person or company who runs it, what is your most preferred method? Email, instant message, social media (Twitter, Facebook), or via the contact form? Either one is good, but for most people contact form would probably the most convenient one.

Few web developers hesitate to include one because they think it will take too much time or effort to make it work, specially if they do not have any server-side programming basics. That is no longer the case, these tools will help you build nice contact form for any project quickly:

Contactable

Contactable is a jQuery plugin designed to make contact/feedback forms simpler and more accessible. This plugin will enable you to create a contact form on any page of a site with minimal effort. I also made a small modification of this great plugin to appear on the right side of the page instead the left, you can check it here.

Wufoo

Wufoo is one of the easiest form builder around. It helps you create contact forms, online surveys, and invitations so you can collect the data, registrations and online payments you need without writing a single line of code. Its free account is more than enough to create basic online forms, but you can easily upgrade to premium plans to fit your needs.

pForm

Similar with Wufoo, pForm comes with an online form builder with simple interface that will help you build forms of any kind. Integration with your existing web page might be a bit more complicated than Wufoo, but still more simple than building a custom form yourself.

MachForm

MachForm is developed by the same company as pForm. It is the server installable version. You have more options like: receive submission and save to database, send entries to email, send autoresponder email, validate inputs, and lot more.

Introducing yomire

yomire

Yomire builds useful components and templates exclusively on the envato network based on beautiful and functional designs, implemented with great care to optimise efficiency and usability.

Our Aim

Be the best seller on the envato network by:

  • timely response to user comments and questions.
  • putting up all of our items’ documentations online as well as offline to allow buyers easy reference to them at all times. Potential customers will also no doubt find this feature useful as they will be able to familiarize themselves with an item’s customisation potential prior to committing to buy.
  • actively update the FAQ section for all our items based on real user comments and questions, whenever appropriate.
  • introduce a section that will always be present in each items’ documentation: Version History. The Version History section will document updates and what each one entail.
  • build a blog containing all new updates of existing items and new item releases.
  • be an active participant in social network sites that we are a member of. Currently, this includes twitter and facebook.

Design Style

  • clean & sophisticated.
  • neutral – We want users to be able to incorporate our components into their exisiting websites or suit their company with very minimal customisation possible.

Coding and Development

  • asset-free – When we create flash components for activeden, we always try not to use assets whenever possible. For buyers, this means more flexible customisation from XML , light resulting SWF file and easier further customisation through the use of actionscript, if required.
  • OOP (Object Oriented Programming) using classes which means highly organised source codes and easy updating.
  • efficient and re-usable classes; in most cases buyers can take our custom utility classes, like scrollers, simple shapes drawing, etc, from our templates and incorporate them into their own projects.

Check out our profile on ActiveDen.

Contactable jQuery Plugin on The Right Side of Page

Contactable is a great jQuery plugin by Philip Beel to include a nice sliding contact form, even if you only understand a tiny bit of jQuery and PHP.

I needed to use this plugin for one of my project, but I want it to be on the right side of the page instead of left. In order to do this, you need to change a small portion of the CSS and JS files. No special skills required. Still, you can save your time since you can download it directly below:

» click here to download Contactable on right side of page «

All credits go to Philip Beel. Instructions and demo can be checked directly on this plugin’s homepage.