Archive for April, 2010

42 More Subtle Grunge Textured Photoshop Brushes



If, like us you are a fan of soft & subtle brushes then you’re going to love this new set. The focus on this set is to give you the tools to build up realistic textures in your designs, by using multiple brushes on multiple layers.

Details of the Pack

This set is completely free, you can use them anyway without the need of giving credit. The brushes are best used on projects meant for web use. They can be used elsewhere, but the way we made them, and the size of them make them ideal for use in web design rather than print.

The brushes all fade out around the edges, just so you don’t get any messy looking edges or straight lines in your grunge work. There’s a massive variety of textures & surfaces, 42 of them in total, all at different sizes and shapes. This set is a follow up to our popular first set.

The sort of thing you can expect from this set is really soft; Chalk, Concrete, Denim, Fabric, and Paper textures. All fixed up nicely and ready to use.

The set also contains some “harsher” brushes, such as some chalk strokes and some paint roller brushes. These kind of brushes are perfect for borders or masking layers.

Example of How to Use Them

Obviously you can use these however you want, but our best advice is to build up layers of texture in a subtle way. Play around with the various brushes – and build up the realistic textures by varying colours, opacity and placement. What you should aim for is something that looks natural and organic.

Share These Brushes

If you find this set useful we’d like you to pass them on to other who you think might appreciate it. You can do this easily using the share links below the post, or share the short URL below, as well as using the full URL in the address bar.

The URL to share is: http://bit.ly/dn4K4J

Important, you must link to this article when sharing the set, you must not upload these files to your own server when sharing.

Download The Set

Download Free Brushes | .zip Format |  9.3 mb


Cross-Browser CSS Gradient

Cross-Browser CSS Gradient. Pure CSS gradients that work in these major browsers: IE, Firefox 3.6+, Safari, and Chrome.

Design Patterns: Faceted Navigation

Faceted navigation may be the most significant search innovation of the past decade. It features an integrated, incremental search and browse experience that lets users begin with a classic keyword search and then scan a list of results. It also serves up a custom map that provides insights into the content and its organization and offers a variety of useful next steps. In keeping with the principles of progressive disclosure and incremental construction, it lets users formulate the equivalent of a sophisticated Boolean query by taking a series of small, simple steps. Learn how it works, why it has become ubiquitous in e-commerce, and why it’s not for every site.

Smashing Magazine Redesign: Photographs & Screenshots

Last year we took on one of our biggest projects yet, working on the new Smashing Magazine re-design. In this post we’ll look at some of the elements we designed for the project, many of which nobody has seen before.

The Brief

The brief was for a re-fresh or update of the current design, rather than an overhaul. They wanted things to be crisper, cleaner and more together – but a lot of the elements needed to stay, so that it still had a familiar feel & felt like something that people were used to.

Launch Project Photo Gallery

Not everything we created made it in to the live site. So we’ve decided to show a gallery of some screen-shots & previews of our involvement in the process.

We’ve put together some photographs of various ideas and work in progress from the early stages of the design. The photos were taken during the design process, and there has been various changes made since, by both ourselves and the Smashing team. But it does show an exclusive look at the early stages of the design process.

Wireframe & Moodboard

The first stage was to work on a wire-frame & mood-board, we showcased our initial ideas on a combination of both. Presenting some solid ideas like this backed up by examples and solid reasons it makes the start of any project much easier.

Things That Never Made it

Since handing over the project to the Smashing Magazine team a lot of changes have been made. So a lot of the work we did never actually saw the light of day, which is why this post has been made and also why we’ve uploaded a Gallery.

Some of the things, in our opinion look better in earlier versions than they do on the live site. But at the same time there’s a lot of good that came from the client feedback and a lot of improvements have been made.

In my honest opinion, the current live site is in need of a little fixing up. We’ve been in touch with the Smashing Magazine team about some of the changes they’ve made, and put forward some improvement ideas of our own. Whether things will change I’m not sure, as we’re no longer actively involved in the project, but we have kept in touch with the team – and shared our honest feelings with them.

A quick look at some early details

Here’s a quick look at some details we quite liked, but we never got to use, for one reason or another. Even though they weren’t used they were a starting point for changes for both us and the Smashing Mag team.

We also worked with our good friend Pasquale D’Silva again on this project, he provided the character Illustrations for the about us pages. The characters were later used by the team for other things, but never as we originally planned it as part of a “meet the staff’ feature (above).

Speaking of Pasquale

As mentioned the characters we’re made by Pasquale D’Silva. We came up with the idea of having him draw each of the staff members to use on the about us page. Something that the clients loved. Here’s a preview of the 4 brilliant characters he came up with.


The Experience In Conclusion

Working on such a huge part of the design community was always going to be a challenge. It was a huge honour to be involved with the team and the project and all in all I’m proud of the work we did on the project.

As with any project there is always things I wish could have been different, but on the whole we’re happy with the work we put into the project and how things looked when we were done, and it really was such a massively fantastic project to have been involved in.


How to Diagnose and Remove the WordPress Pharma Hack

A few weeks ago, I started receiving tweets and emails from people who claimed that search results for my site were looking more like a pharmacy than a helpful Web resource.

Of course, upon hearing such blasphemy, I immediately opened a new browser tab, looked around to make sure no one was watching, and then started Googling myself…and if you think that is some NC-17 material, wait til you see what my search results looked like:

Google search results showing the WordPress pharma hack

Figure 1. The three red arrows highlight <title> tags that were cloaked by the WordPress pharma hack. Helpful Web guy or reckless pill-slinger? You decide :D

What you don’t see in the picture above is a hacked <title> tag for my home page, but that’s only because I fixed it before realizing I was going to write an article about these shenanigans.

Suffice it to say that, before I caught the hack, my site looked more like the best damn antidepressant resource than the best damn blog on the planet.

Enough of that, though—let’s dig a little deeper into the WordPress pharma hack and see what it’s all about.

What Does the WordPress Pharma Hack Do?

There are three facets of the pharma hack that I find particularly interesting. First, the results of the hack are only visible to search engines, and if your site is hacked, the public-facing portion of it will remain visibly unaffected. In other words, you won’t be able to spot the hack just by viewing the HTML source. The goal of any hack like this is to gain valuable links from high-ranking pages, and these hackers have wisely chosen to disturb the water as little as possible while going about their dirty business.

Second, like other hacks, the pharma hack must place malicious files in your WordPress folders in order to work its evil. However, unlike other hacks that I’ve encountered, the pharma hack disguises a majority of its code and saves it in the WordPress database, thereby making it more difficult to find and eliminate.

The third remarkable aspect of the pharma hack was that it didn’t affect every page of my site. Further, it only targeted the pages of my site that receive the most search traffic. For example, in Figure 1 above, the three hacked titles correspond with the following posts:

Interestingly, these three pages contain the most potent and high-ranking keywords on my site. Also, back when I ran AdSense, two of those three pages were the highest earners on the entire site (as far as PPC is concerned, anyway1).

With these key points in mind, let’s answer the original question here: What does this hack do?

The WordPress pharma hack quietly exploits your highest-ranking and most valuable pages by overriding the title tag and by inserting spammy links into the page content. Interestingly, the modified title tag and spammy links are only visible to search engines.

How Does the WordPress Pharma Hack Work?

We know what the pharma hack does, but in order to eliminate it and to prevent attacks like this in the future, we need to know how it does what it does.

Basically, the hack consists of two parts—malicious files in the WordPress plugins folder coupled with encrypted code in the WordPress database. The files in the plugins folder contain code that runs the encrypted code stored in the database. Because of this, the pharma hack is dependent upon these rogue files in the plugins folder.

Typically, hack files contain easily-identifiable PHP functions like eval() and base64_decode(), and although the pharma hack is no exception, there’s one major difference. With the pharma hack, these functions are stored in the WordPress database as strings, and they’re encoded backwards! At runtime, a hack file in the plugins folder pulls these strings from the database, flips ‘em, and then runs ‘em as functions, and that’s how the deed gets done.

Oh, and remember how I said this hack only targeted my most potent and high-ranking pages? Cleverly, the hack pings Google Blog Search with queries like this one to see how many links a particular page has, and then it stores the results in the database. At runtime, the hack uses the number of links to determine which pages to target…

Sneaky bastards :D

How to Remove the WordPress Pharma Hack

Even if you don’t see any symptoms of the pharma hack (like cloaked title tags in search results), your site may still be hacked and therefore completely vulnerable. To know for sure, you’ll have to dig through the two places where the hack is known to romp—your WordPress plugins folder and your WordPress database.

Oh, and before we go any further, let’s get one thing straight—you are running the latest version of WordPress, aren’t you? Good, I knew you were the sensible type :D

Step 1: Remove Hack Files from Your Plugins Directory

Let’s start by examining the WordPress plugins folder for hack files. Using an FTP client, navigate to the /wp-content/plugins directory, and then locate your Akismet folder. I’ve recommended this particular folder as a starting point because I found malicious files stored here on three different sites; however, based on what I’ve learned about the pharma hack, these malicious files could be in the directory of any active plugin. Therefore, in order to do a thorough diagnosis, you should check any plugin that was active at the time your site was hacked.

Using your FTP client, make sure your viewing options are set to show hidden files, and then check to see if any of the following malicious files are located in your Akismet plugin folder:

  1. .akismet.cache.php
  2. .akismet.bak.php
  3. .akismet.old.php
  4. class-akismet.php
  5. db-akismet.php

Ultimately, the important thing to note here is not the filenames themselves, but rather the patterns these names follow.

Items 1–3 are hidden files, and they all exhibit a characteristic naming structure with .cache, .bak, .old, or a similar pseudo-extension in the middle of the filename. Generally, you’ll find two out of three of these files together—one will look like this, and the other will look like this.

Items 4 and 5 share a naming convention, too—they are simply the plugin name (or a truncated version of the full plugin name) prefixed by either class- or db-. If you find a file that matches this convention, its contents should look like this.

Now, when you check other folders, you’ll know what naming patterns to look for when attempting to spot hack files, you sleuth you!

Here’s what one of my infected Akismet folders looked like; note that an uninfected Akismet folder only contains three files (akismet.gif, akismet.php, and readme.txt) and no hidden files:

hacked WordPress Akismet folder containing hidden files

Figure 2. Two hidden files inside the Akismet plugin folder that were planted by the WordPress pharma hack.

If you find infected files, delete them! Doing this will effectively end the pharma hack symptoms and restore your search results, but it’s important to note that your site will still be vulnerable at this point. In order to completely remove all traces of the hack and restore the integrity of your site, you’ll need to dig into your WordPress database to remove some lingering offensive code.

Step 2: Remove Malicious Code from Your WordPress Database

Because this step involves database interaction, it’s crucial that you pay close attention to the instructions outlined here. Also, it’s always a good idea to make a database backup before manually editing anything, so don’t say I didn’t warn ya!

To begin, you’ll need to access phpMyAdmin, which is a program on your server that allows you to view the databases associated with your hosting account. If you’ve never heard of phpMyAdmin and don’t know how to access it, don’t worry—simply contact your Web host, and they’ll be able to help you out here2.

Select the wp_options table inside phpMyAdmin

Figure 3. Select the wp_options table in your WordPress database.

Once you’re inside phpMyAdmin, select your active WordPress database from the left side of the page. If you’ve selected the correct database, you’ll notice a new set of links on the left—a collection of tables that look like those shown in Figure 3. From here, click on the wp_options table, and this will allow you to browse the table contents.

Your goal here is simple—you need to delete database entries that contain malicious code. Fortunately, finding the entries you need to delete is a simple job if you use the phpMyAdmin search function, which you can access by clicking the Search tab at the top of the page, as shown in Figure 4:

phpMyAdmin Search tab

Figure 4. Click on the Search tab to search the wp_options table inside phpMyAdmin.

On the search screen, you’re going to need to search the option_name field (see Figure 5 below) for the following rogue database entries:

  • wp_check_hash
  • class_generic_support
  • widget_generic_support
  • ftp_credentials
  • fwp
  • rss_% — Attention! In this case, you should delete all matches except rss_language, rss_use_excerpt, and rss_excerpt_length (these are legit WordPress database entries).
Search the option_name field

Figure 5. Search the option_name field for malicious database entries from the list above. If you find any of these entries, delete them!

What Next? (And Some Helpful Prevention Tips!)

Now that you’ve successfully removed the WordPress pharma hack, you’re probably wondering what you can do to prevent stuff like this from happening in the future. On that note, I’ve got some good news, and I’ve got some bad news. First up, the bad news…

At this time, there is still one huge unanswered question about the WordPress pharma hack: How in the hell did the hackers manage to get into your server in the first place? I’ve received reports of the pharma hack on a variety of different Web hosts and server configurations, so it’s clear that the main vulnerability extends beyond a single host/server platform. So far, the only common denominator between the sites I’ve examined is that they’re all running WordPress, but even this fact doesn’t mean that WordPress itself is the problem.

Alright, with the bad news out of the way, it’s time for the good news: You can prevent hacks like this in the future. Rather than rehash the information here, I’m going to point you to a fantastic resource on WordPress security tips. From the perspective of someone whose site just got dropped from Google’s index because of the pharma hack (that’s me), you would be wise to follow these simple security suggestions :D

1 For the record, I think AdSense and PPC advertising are terrible ways to make money online for two reasons. First, they sodomize the visual flow of your site by taking up valuable real estate, and second, they simply aren’t as genuine and helpful to mankind as other methods of monetization. For more, read up on the two methods I recommend for making money online.

2 If you’re unhappy with your current host or not getting the answers you need, check out what I have to say on the topic of Web hosting—my guys will help you out for sure.


  •   
  • Copyright © 1996-2010 BlogmyQuery - BMQ. All rights reserved.
    iDream theme by Templates Next | Powered by WordPress