As a software as a service (SaaS) provider, the question comes up all the time: “Is there an installable version of your software that I can put on my own server?”

In all honesty, I cringe every time I hear this.  It’s not that I have a personal vendetta against installable software, it’s because I know what the asker is usually thinking:

1. I can save money if I only have to pay for it once
2. It’s safer because it’s on my own server
3. I can tweak it to do what I need it to do

The truth is, in almost every case, SaaS is a better solution that will save them more time and money than an installable system—they just don’t realize it yet.

I can save money if I only have to pay for it once

It seems like a logical argument at first, but there are hidden costs with installable software that are often neglected.  For example, time.  Time is money, and as a designer, you probably get paid by the job.  This means that one-time costs are very appealing to you when quoting potential work.  If it’s free, that’s even better.  That’s why so many people use WordPress, right?

In cases like these, you become the systems administrator.  That means when something breaks, you’re the one clients are calling to fix it.  This may not seem like a big deal if you’re just getting started, but as you grow your business, that becomes a lot of overhead.  We have one customer who uses our service to manage over 1,500 websites.  Could you imagine having to update 1,500 WordPress sites?  As you grow, the overhead for each installed system becomes more obvious and the time it takes to maintain them becomes staggering.  Since time is money, your cost goes up with each new client you bring on board.

It’s safer because it’s on my own server

Alright, so you’re OK with eating that extra cost.  Let’s imagine that you chose to install WordPress to power a client’s new website.  You get everything setup, go through a few revision cycles, launch the site, and then you get paid.  All is well and everyone is happy.

And then this happens.

You get a frantic call one evening from your client who is panicking that their site has been hacked and they want it fixed immediately.  The culprit?  Some script kiddie took advantage of a known exploit because someone forgot to update to the latest version of WordPress last week.  No problem, you can just restore the site from a recent backup and update WordPress to patch the vulnerability.

Wait…you mean you haven’t been keeping backups?

Now you’re stuck wading through infected pages and database entries trying to repair all the damage.  Don’t forget to change all your users’ passwords, the database password, your API keys, and for good measure, your FTP password.  Oh, and your client just emailed you saying that Google blacklisted the site for serving badware.  And they’re missing the story that they just posted a couple hours ago—and some other articles that were really important.  The entire cleanup process can take a long time, especially if the attacker was clever.  And this is just one site.

When the dust settles after hours of your time is wasted because of a simple oversight, you then seek compensation from your client for the time you spent restoring their site.  Of course, they’re going to be a bit sour that the site you built was hacked and, even though it’s not your fault, they think it is.  Your relationship with them gets a bit salty at this point, and they become less likely to recommend your services to others.  This can cost you a lot of money, too.

But how much is your time worth?  A conservative designer might say $40 an hour.  Add those hours up, and I guarantee you’ll find the overall cost of an equivalent SaaS product to be comparatively less—especially if multiple incidents happen throughout the year.

Granted, just about any site can harbor exploits and become a victim, but installable software makes it much easier for attackers to find vulnerabilities since the entire code base is exposed and living on your server.  That is a huge advantage of SaaS—it’s much harder to hack what you can’t see.

Another advantage of SaaS is that, if a service discovers a bug or an exploit in their system, it gets fixed automatically.  You don’t have to update multiple systems. You don’t have to reset all your passwords.  You don’t have to remove malicious code from your site.  In fact, since there are many other users, it’s likely that the problem will be noticed and fixed before you ever even realize it was there.

I can tweak it to do what I need it to do

Despite all of that, some folks still think that installable software is better because you can change the code when you need something to work in a way that it’s not intended to work.  This is usually a bad idea, especially if you don’t stick to the API.

Why?  Because most people that like to tinker with code don’t have a complete understanding of how everything works.  Software is complex, and without a solid understanding of the code base, you risk introducing bugs and vulnerabilities that didn’t exist in the original version.  It’s also very easy to make changes that hinder the application’s usability.

Aside from that, if you’re not coding off an API, you’ll probably need to make those changes each time an update comes out.  If your changes are significant, you will inevitably be reluctant to perform the update which will lead to what I just talked about in the previous section.

Again, this is usually a bad idea.

I can just roll my own service

And then there are the code rogues who would rather spend weeks working on a halfhearted equivalent just to avoid paying a nominal monthly fee, despite the value it would bring to them and their clients.

While I don’t doubt a talented developer’s ability to create an app, it will never be as cost effective as an already-available SaaS product.  You might be able to produce a quick-fix system that gets the job done, but it won’t be as maintainable or reusable as it should be, and it won’t be as polished as something that’s been around for awhile.  Even if you take the time to turn it into a service that all your clients can use, you’ll be spending more time developing features and fixing bugs than you will finding new clients.  You’ll have a new full time job that you don’t even get paid for.

Again, time is money, and while it may seem like an easy thing to do, building and maintaining your own system won’t be as cost efficient as going with an existing SaaS service.  It’s just not economical, and it will end up costing much more than what your clients are willing to pay you for.

In the end…

Being in the content management industry, I have the opportunity to interface with established web designers from all over the world.  Many of them have tried both installable and SaaS solutions and, while a handful will always prefer the former, the majority who try our service never look back.  They would rather spend their time doing what they love instead of being a systems administrator or developing their own applications.  The benefits outweigh the cost, and that’s the whole purpose of SaaS.

Ultimately, it’s up to you to decide what tools and services you’d like to use to power your business.  Many people find comfort using traditional software applications, but it’s important to consider their disadvantages as well.  If there’s a SaaS equivalent that does the job, you might consider taking another look at it for your next project.  You might just find that you’ll get more value than what you’re actually paying for.

Backstory

One of my favorite Boostrap plugins is dropdowns, but I had a bit of difficulty getting started with them. The docs say you can apply a dropdown to nearly any element, but they really seem to work best with Bootstrap’s navbar, tab, and pill components. Since I was retrofitting an app that was around long before Bootstrap, this wasn’t going to work for me. That and I was hoping to get a scrollable dropdown (with tips!) and a few other features out of the deal. Thus, this plugin was born.

While the appearance of these dropdowns is almost identical to those of Bootstrap’s, it’s important to note that JavaScript for this plugin was developed entirely from scratch. Some CSS was borrowed, however, especially for generating those gorgeous tips.

Wanna see what they look like? Try it! Wanna contribute to this project? It’s on GitHub

RewriteEngine On
RewriteCond %{SCRIPT_FILENAME} !-d
RewriteRule ^([^\.]+)$ $1.php [NC,L]

The nice thing about this is that it doesn’t affect querystrings.  With this solution, both of these URLs are effectively the same:

http://example.com/page.php?id=123

http://example.com/page?id=123

Of course, the caveat is that you don’t have “clean querystrings”, but it’s a reasonable trade-off between “clean” and configuration.

For a long time, we’ve been asking for your feedback and directing you to post them on our UserVoice page.  In theory, this was a good idea, as it allowed the community to suggest new features and vote on their priority.  This gave us a good insight into where you wanted us to take Surreal.  However, over time, we’ve come to realize that UserVoice isn’t the solution we were really looking for.

For one, you were thrown into an entirely new interface and required to register a separate username and password.  Many users simply stopped at this point, which means that if they didn’t contact us directly we never got the chance to hear their feedback.  You shouldn’t be forced to register with another site just to tell us what you think about our service.

We also felt that UserVoice’s interface doesn’t fit well with Surreal’s mantra.  Surreal is simple.  Providing feedback to us should be just as simple.  So from now on, we encourage you to send all your comments, suggestions, and all other feedback directly to us through Surreal’s Help & Support section.

We want to hear from you directly, and we want to take back that personal touch that we lost when we started sending folks elsewhere to tell us how we were doing.

In Surreal CMS version 3, we tried to solve this problem by using only the Insert/Edit Table button in the toolbar.  For other functions, the user just needed to right-click on the table to bring up a contextual menu with additional table options.  For the most part this worked, but we saw a lot of support requests from people who never even knew there was a context menu available.  In addition, the use of context menus in web applications is still a rather controversial matter.

So with the development of Surreal CMS v4 underway, we needed a better solution to this dilemma.  Here are the facts that we faced:

• Most people won’t be working with tables in the CMS
• At the same time, a lot of people still need this functionality
• The built-in TinyMCE tablecontrols feature dumps 12 buttons into the toolbar—every option is essential when working with tables, but it clutters the toolbar and intimidates novice users

Our solution was to create a SplitButton control that combined all of the necessary options into a single dropdown.  When the button is clicked, the Insert/Edit Table dialog appears.  When the arrow is clicked, you get the rest of the table options neatly organized in a TinyMCE dropdown:

The plugin is very lightweight and contains only one small JavaScript file—no CSS, images, or language packs required.  The plugin is also theme-ready and localization-ready, as it uses standard TinyMCE classes and terms.

We think that this is a very elegant solution for a very much overlooked UI problem, so for the sake of better usability in apps that use TinyMCE, we have released the code under the MIT license for all to use and share.  If you’re interested in this plugin, you can download and contribute to it on GitHub.

var isMobile = {
    Android: function() {
        return navigator.userAgent.match(/Android/i) ? true : false;
    },
    BlackBerry: function() {
        return navigator.userAgent.match(/BlackBerry/i) ? true : false;
    },
    iOS: function() {
        return navigator.userAgent.match(/iPhone|iPad|iPod/i) ? true : false;
    },
    Windows: function() {
        return navigator.userAgent.match(/IEMobile/i) ? true : false;
    },
    any: function() {
        return (isMobile.Android() || isMobile.BlackBerry() || isMobile.iOS() || isMobile.Windows());
    }
};

While this doesn’t account for all mobile platforms, it will pick up the most popular ones out there.

Examples

To check to see if the user is on any of the supported mobile devices:

if( isMobile.any() ) alert('Mobile');

To check to see if the user is on a specific mobile device:

if( isMobile.iOS() ) alert('iOS');

 ##
 ## www.domain.com --> domain.com
 ##
 RewriteEngine On
 RewriteCond %{HTTP_HOST} ^www\.(.*)$ [NC]
 RewriteRule ^(.*)$ http://%1/$1 [R=301,L]
 

 ##
 ## domain.com --> www.domain.com
 ##
 RewriteEngine On
 RewriteCond %{HTTP_HOST} !^www\.
 RewriteRule (.*) http://www.%{HTTP_HOST}/$1 [R=301,L]
 

If you plan on using these, you’ll need to make sure you have the mod_rewrite module enabled on your server.

Here are just a few:

• convert() – converts an image from one format to another
• flip() – flips an image vertically or horizontally
• rotate() – rotates an image at the specified angle
• brightness() – adjust the image’s brightness
• contrast() – adjust the image’s contrast
• grayscale() – makes the image black and white
• blur() – blurs the image at the specified level
• watermark() – creates a watermark effect using another image
• text() – adds text to the image

In addition, there are some special methods for resizing and cropping:

• resize() – resizes an image to the specified values
• resize_to_width() – resizes an image to the specified width
• resize_to_height() – resizes an image to the specified height
• resize_to_fit() – resizes an image to fit within the specified dimensions
• crop() – crops an image
• square_crop() – crops the image into a square of the given size

Download

This project is actively maintained on GitHub. Please submit all issues and contributions to the project page. Licensed under both the MIT and the GNU GPL licenses.

Download the latest version from GitHub

The goal of this plugin is to show passive notifications that can be easily dismissed with minimal distraction.  Rather than using a dialog or a distracting overlay, the notification appears on screen for a specified duration, and then fades out.  The user may also dismiss the notification simply by clicking on it.  At the present time, this plugin does not support multiple notifications.

Screenshot

If you’re interested in using this in your own projects, head on over to GitHub and download the source.

Demo & Download

This project is actively maintained on GitHub.  Please submit all issues and contributions to the project page.  Licensed under both the MIT and the GNU GPL licenses.

Demo | Download the latest version on GitHub

It can be frustrating, however, if you ever come across that need.  If you’re one of those individuals, open up a terminal window and navigate to your local Git repository.  Once there, simply run these commands, replacing [tag] with the tag name:

git tag -d [tag];
git push origin :[tag]

And if your tag has the same name as one of your branches, use this instead:

git tag -d [tag]
git push origin :refs/tags/[tag]

Of course, these steps assume that you have Git running on your local machine.