Here's how it works:
1) The client keeps stalking a particular site he likes, which is usually a competitor in his own field.
2) There are some clients who like just want:
a) certain elements of the site, for example, the way something is done, instead of that something in its entirety itself,
b) and there are the rest, who just want the same exact design to be replaced by their own logo.
If you notice, in the original article, all of the examples the author provides, either fall into category a or b. You can be convinced that people who work in the category b are designers with a fair level of reasoning, and they are much much better people (comparatively) who don't want to rip off the site entirely, but would like to make it as much similar as possible to the original site, so they can somehow convince their clients.
The designers who belong to the category a are the most arrogant, desperate people you would ever find. Not to say that they are bad people, but they are desperate and they don't care about ethics. The only thing they care about is money.
I hate to bring in this topic of 'regionalism', but MOST (not ALL) of these designers are from India, Pakistan, etc. There are many popular 'call-to-offer' services in these countries wherein you just call these service centers and tell them you want a design to be completed, the next minute there will be 'design studios', 'agencies', 'professionals' offering you to design a website (of any kind) for something as cheap as $20. Yep, you read that right. $20 for a WHOLE website. These are the designers who resort to such tactics.
So, what do you do if you don't want your designs to get ripped off?
I will tell you my strategy - It's not fool proof, but it works REALL REALLY well.
BEFORE deploying your website to production, make sure, you follow these steps:
1) Create a duplicate copy of your homepage (which is the easiest target of being ripped off), and
a) Re-Name IMPORTANT class names, for example, rename #logo to #fewji903. Something unreadable. I usually write a handy script to automate this for the rest of the class names and ID's.
b) Add redundant containers - If you want to add styles for your logo, don't just write it as
#logo{
display:block;
position:absolute;
top:10px;
background:url('some-image.jpg') no-repeat;
}
But re-write it as: #aw469srfa #fewji903{
display:block;
position:absolute;
top:10px;
background:url('some-image.jpg') no-repeat;
}
BUT, in your actual HTML file, what you do is DON'T include the logo container with ID 'fewji903'. Instead, write a tiny Jquery script to load this container dynamically. Something like: $(document).ready(function() {
//do a check to see if current url is YOUR website
if( url_is_mywebsite()){
$('#aw469srfa').html('<div id="fewji903"></div>');
}
else{
// don't load the container
alert('fuck-off');
}
function url_is_mywebsite(){
//do something to check if the current url processed is your own, something like
if (current_url=='google.com')
return true
else
return false
}
});
Now step 2):Minify your CSS and make it unreadable. MOST rogue designers have no idea as to how to 'beautify' it.
As for your little JS snippet - Either just minify it, if your code is already complex, or obfuscate it. I always obfuscate my code. There is a downside to this - Your page load time might slow down a tiny,tiny un-noticeable bit, but like I said, it's un-noticeable for the most part, and it's a very good compromise for not having your entire website ripped-off:
This is how the above code, when obfuscated will look like:
eval(function(p,a,c,k,e,d){e=function(c){return c.toString(36)};if(!''.replace(/^/,String)){while(c--){d[c.toString(a)]=k[c]||c.toString(a)}k=[function(e){return d[e]}];e=function(){return'\\w+'};c=1};while(c--){if(k[c]){p=p.replace(new RegExp('\\b'+e(c)+'\\b','g'),k[c])}}return p}('$(a).b(3(){2(0()){$(\'#9\').8(\'<1 6="7"></1>\')}4{j(\'c-i\')}3 0(){2(d==\'e.h\')5 f 4 5 g}});',20,20,'url_is_mywebsite|div|if|function|else|return|id|fewji903|html|aw469srfa|document|ready|fuck|current_url|google|true|false|com|off|alert'.split('|'),0,{}))
I always use http://www.jsobfuscate.com for this purpose.While I have shown a demo only for the Logo container, I urge everyone to follow this for as many important containers as possible. Now, when someone rips-off your website, even copies all the files and uploads it to their server, it's not going to work. They're just going to see a broken, half-assed website.
At that point, they could:
1) Reverse engineer the code to see how it works.
2) Try to re-design it from scratch
3) Cancel the project, or take too much time to complete it.
Do you know what I've seen most of these rogue designers do? They chose 3! Because, since you made the code a little complex for them, they don't want to spend time reverse engineering THE MOST COMPLEX code. What we wrote there wasn't THE MOST COMPLEX code, but it's the perception of complexity that matters. When a rogue designer is going to see code like that, he's going to think, "Oh shoot, these guys must be clever, look at all those complex class names. I ain't touching anything hot like that." He's simply going to assume it's way too complex to handle it.
How do I know this works? Most of these people who rip-off websites are not complete designers. They are either newbs, or in-experienced coders or someone else, trying to earn a buck or two from design. And that is why this works, especially now that we're clear about our target audience.
NOTE: I actually encourage you to do this with the final version of a back-up copy of your homepage design. Homepages rarely change, in my experience. So, it's a good compromise. Any developer is going to work-up on the un-adulterated code, not on the obfuscated version.
And for completeness, here's advice #3:
3) DON'T write a blog post linking back to the ones who ripped you off. You're just giving them free publicity (pageviews). Atleast if you do write, just mention the website and don't link it. Perhaps post screenshots of their homepages. They don't deserve your extra pageviews.
Cheers.