In under two months Socket has surpassed the 200 purchase mark. It’s still selling more than twice as fast as our first theme, Caulk, which has itself seen a surge of popularity recently (we thought Socket would have passed it in overall sales by now). Here are a few of our notable numbers from ThemeForest:

• We have 517 combined sales
• Socket has been rated 20 times and currently has an average rating of 5/5 stars
• Socket has 117 total comments
• We have achieved the coveted Sliver Bear Claw badge (sold between $10,000 and $50,000 on ThemeForest)
• Our ThemeForest items have earned us clients from 5 different continents

We are greatly looking forward to creating our next template. Pick up Socket for a mere $37 from Theme Forest today!

Isn’t that amazing? We had no idea our very first theme would take off like it did. Thank you to everyone who has purchased and given us such positive feedback on our flagship theme! Now, let’s break 300 with Socket! We’re currently at 150 sales with Socket in under a month, which should put us on pace to hit that mark. A few other Theme Forest landmarks of note:

• We recently received our sliver bear claw badge for exceeding $10k in gross sales (currently at $11.5k)
• We cracked the 44% commission rate tier a week ago, and are a few hundred bucks shy of cracking 45% tier
• Our total lifetime volume is 430 sales
• Our newest theme, Socket, is rated at 5 out of 5 stars after 148 purchases

To keep up with our progress and subscribe to our future theme releases, view our Theme Forest portfolio.

We here at OSWC are students of the newest design trends in the biz. We love shiny new things. If there is a new toy out, we have GOT to get our hands on it. We don’t know why, but that’s how it works with us. The same goes with web design trends. jQuery is very hot right now, and we’re getting our hands on it and playing with it like it’s the newest smart phone. We already employed some of the hippest CSS2 trends when we built this site, like image sprites, background image hover effects, and purely CSS drop down menus. Since then, we’ve leveraged a lot of the newest jQuery techniques too, beginning with the Twitter plugin, continuing with a validated AJAX contact form, adding in some nifty portfolio sliders, and rounding it out with some cool quote rotators (e.g. the Outer Spice Buzz panel on the Services and Portfolio pages, as well as the bottom-right panel on every page). So, we’re continuing that trend today with a few more features.

Our shiniest, most notable new feature is the star animation in the header. Undoubtedly you’ve already noticed, but just in case you missed it, scroll to the top of the page and check it out – Outer Spice is now flying through space! There is a subtle animated image made up of stars that slides across the original image in the header, making it seem as though we’re meandering through space on a galactic quest of domination and adventure. Those are indeed strong words, but once day you’ll see – we will take over the universe. The animation is done using jQuery (no flash here!), specifically by leveraging a plugin called Spritely. Check it out for yourself, it’s pretty awesome. And we’re only using about 20% of what it can actually do (we’re not actually using the “sprite” feature – just the “pan” feature for now, but we’re planning to implement some sprite animation in the future).

The other feature we just implemented is the brand new Google Font Directory via the Google Font API to produce awesome fonts that render in any browser without the use of jQuery or images. That means the page loads faster and is much more SEO friendly. We were previously heavily using a font called Yanone Kaffeesatz in images as headers and text all over the site. However, Google just added that font to their directory of free fonts, so we were able to do away with all those images and lighten up the site a bit.

Check out this awesome font – it’s really a font – no image or jQuery is used!

Cool, huh? We were going to employ the cufon font replacement technique, which uses jQuery to transform embedded fonts into images on the fly, but thanks to the Google Font API we were able to go one step further and put our special font directly on our page. Natural. Pure. Indexable. Gracefully downgrading. That’s what we like to hear at OSWC. Stay tuned for changes to our portfolio and services pages!

We are pleased to announce that the HTML (PHP) version of our Socket Wordpress template has been approved for sale at Theme Forest. At only $17, it’s definitely a steal. It’s got all the glorious features of the original Socket, but without the limitation of having to use Wordpress. 34 page templates, jQuery enhanced, Piecemaker 3D flash slider, font replacement, fancy menu dropdowns, 9 gorgeous skins, and 2 AJAX contact forms are just a few of the features that round out Socket. Best of all, the code is intuitive, commented in-line, indented, spaced, and accompanied with a documentation help file that explains how to use it. Check it out on Theme Forest. Here is the description:

• 34 page templates
• 6 different portfolio page layouts
• A unique theme design not yet seen on ThemeForest
• Piecemaker 3d content slider
• 3 separate jQuery content sliders
• 9 gorgeous professional skins
• cufon font replacement
• superfish drop down menus
• 2 AJAX contact forms
• JQuery enhanced elements including multiple jQuery sliders
• Easy to customize
• Twitter & Flickr integration
• Slick “more” panel slides out to expose non-critical content from under the menu
• The best free template icons out there
• Valid XHTML and CSS, and compatible with all modern browsers
• Completely styled blog pages (archives, single post, post list, comments, related posts, etc.)
• Lots of white-space and modern styling techniques
• Indented, spaced, commented, and intuitive code (HTML, CSS, and PHP is all commented in-line)
• Superb, prompt customer service
• Excellent documentation
• Lots more!

Socket is a very powerful and flexible CMS for corporate and/or portfolio use. It was developed using the latest technologies and web coding standards, and employs state-of-the-art features such as jQuery enhancements, font replacement, AJAX contact forms, social media integration, and more. Here are a few of the most notable features:

• Over 30 page templates (6 different portfolio layouts)
• 9 gorgeous professional skins
• Unlimited widget combinations using 15 distinct widget panels
• A huge, beautiful featured area to showcase your work
• Tons of back-end theme options

To really get a feel for everything Socket can do, check out the live demo and explore all the pages. The features are described on each page, and you can also see the different skins. Here is a list of each skin with a link to see it in action:

Skins (click to see live)

• Slate
• Aluminum
• Epoxy
• Carbon
• Neoprene
• Iron
• Brick
• Malachite
• Magnet

You can create 2 websites that look completely different from each other using Socket, since it has so many options for arrangement of widget panels, number of columns, colors, styles, and page templates. It truly is a premium theme by any and all standards. Here is a full list of features:

Features

• Over 30 page templates
• 6 different portfolio page layouts
• A unique theme design not yet seen on ThemeForest
• 3 separate content sliders
• 15 distict widget panels
• 9 gorgeous professional skins
• cufon font replacement
• superfish drop down menus
• 2 AJAX contact forms
• JQuery enhanced elements including multiple jQuery sliders
• Organized and easy-to-use theme options page
• Twitter & Flickr integration
• Slick “more” panel slides out to expose non-critical content from under the menu
• The best free template icons out there
• Valid XHTML and CSS, and compatible with all modern browsers
• Forward-engineered to work with Wordpress version 3! (currently tested with Wordpress 3 beta 2)
• Integrates with post thumbnail featured introduced in Wordpress 2.9
• No plugins required
• Nested and paged comments
• Related posts underneath blog posts
• Lots of white-space and modern styling techniques
• Indented, spaced, commented, and intuitive code (HTML, CSS, and PHP is all commented in-line)
• Superb, prompt customer service
• Lots more!

Here is a website I came across with over 100k icons. The problem I’ve found with other free icon websites is that it’s hard to browse through the myriad of icons available, and when you do finally come across a set you like, you discover it is not free for commercial use. The great thing about this website is how it lists the icon sets out thumbnail style so you can easily view many at once, and it lists the license directly below each thumbnail. The only thing it’s missing is a way to sort by license, instead of just sorting alphabetically by icon set name. Check it out for yourself: FREE ICONS!.

Outer Spice has gotten its second theme approved for sale at ThemeForest.net (after 2 previous attempts). It is a version of the original Wordpress template we already got approved that has been ported to an HTML website template. Listed at an affordable $12, it is called “Caulk” (just like its older Wordpress brother) and it is already getting some buzz at Theme Forest. It is XHTML/CSS compliant, and is completely cross-browser compatible. It makes use of the jQuery library to pull off some nice effects, including featured content rotators and fancy smooth page scrolling. Here is the full item description from Caulk’s page at ThemeForest:

Caulk is a modern, sleek website template build especially for coprorate, portfolio, and technology websites, making use of multiple jQuery sliders. It is clean, organized, and easy to read with plenty of white space and nice typography. There is a nice big featured post rotator at the top to grab your readers’ attention right off the bat. The code is very clean, well-documented, indented and spaced out, and very semantic.

Caulk comes with three distinct page layouts:

1. Main page, which has a top featured area and a 3-column layout
2. Subpage1, which is a 2-column layout
3. Subpage2, which is a full-width layout

More Caulk features:

• 8 color schemes + 2 background types (dark/light) = 16 combinations
• Two AJAX validated contact forms
• Beautiful portfolio grid layout
• Gorgeous pre-styled table included
• Unlimited featured post jQuery content rotator
• Testimonial jQuery rotator
• Twitter integration
• Well documented in the help file, and code is well-commented
• Fancy jQuery page anchor scrolling
• All layered PNGs included
• Unmatched customer support!

This is my second edition of T.I.D.B.I.T.S., and you’re probably still asking yourself what they are and why I do them. Here’s the deal: I don’t read very much. I’m probably in the lower 25% of all readers (and consequently the upper 25% of all TV watchers). So you can rest assured that what I do actually spend my valuable time reading is pretty dang good. Using that same logic, the amount you read is somewhat proportional to the quality of things you’ll read, and that explains why you’re reading our blog. Now we come to the reason for T.I.D.B.I.T.S. Since we’re not real good writers ourselves, the least we can do is point you in the direction of good writing and great resources for your development. Today’s tidbit is one of my personal favorites.

Smashing Magazine is a tremendous web design & development blog based out of the UK. I’ve been reading it for over a year and it has absolutely been the reason for my success and continued skill progression as a web developer. You can find anything from Photoshop tutorials to developing custom Wordpress plug-ins. Smashing is very heavily Wordpress and open-source based, and consequently you’ll often see posts showcasing free Wordpress templates, fonts, and icon sets. The editors of Smashing have a keen eye for beautiful modern web design and spend their time scouring the web for superb websites to include in their showcases. There’s an average of about 2 posts per day – plenty of content but not enough to overwhelm you.

I bring this up now since they recently released a book and redesigned their website, creating a “Smashing Network” of other design blogs and featured posts from the cream of the crop around the web. I can’t tell you how many free icon sets, fonts, and themes I have acquired via Smashing – and most of them are licensed for free commercial use, which is MONEY for a web developer. I highly recommend this blog. If you are at all in the design or development industry, and somehow you have not heard of Smashing, check them out as soon as you can!

Outer Spice is please to present it’s first premium Wordpress theme release: Caulk. It has been uploaded for sale to ThemeForest.net, which is a great site for browsing the most premium site templates there are to buy. It has been listed for $27, and is well worth the price! Here is a description of Caulk:

Caulk is a modern, sleek Wordpress custom theme built especially for magazine-style blogs, but also customizable for personal use, making use of multiple jQuery sliders. It is clean, organized, and easy to read with plenty of white space and nice typography. There is a nice big featured post rotator at the top to grab your readers’ attention right off the bat, and a popular posts slider underneath it to keep them there. Caulk comes out-of-the-box ready for you to populate with all of your unique content, with a very quick and easy install process. Here are some of the awesome things Caulk does for you:

• 8 color schemes + 2 background types (dark/light) = 16 combinations
  1. Blue
  2. Grey
  3. Green
  4. Red
  5. Yellow
  6. Orange
  7. Deep
  8. Seafoam
• Multiple discrete post areas – featured, popular, sticky, and recent posts
• Extensive theme options admin panel
• Requires no plug-ins!
• Related posts under each article
• Random posts in the sidebar
• 4 separate advertising panels
• Widget-ready
• Twitter integration
• Social bookmarking
• Show/Hide featured panel (and a lot of other sections)
• Custom post pagination
• Auto thumbnail resizing
• Recent comments built-in
• Nested and paginated comments
• Well documented in the help file, and code is well-commented
• Much more!

In working with Wordpress I have noticed a very common trend in the footer of most themes I come across. Almost as common as ending web markup with “</html>” is the practice of tacking on the “Valid XTHML/CSS” clause. Even when the markup is miles away from actually validating. It’s actually a peculiar practice to continue including these clauses in our page footers when A) our pages are not actually validating, and B) no one really cares if our pages validate or not.

Let’s perform a very scientific independent study to determine what percentage of sites out there validate. We’ll use the most popular themes in the official Wordpress theme directory. We’ll take a look to see if the web page makes the claim of valid XHTML/CSS, and then we’ll actually test it to see if it does indeed validate. And for the sake of science, we’ll give each site a final grade.

Disclaimer: I have fallen victim to the very thing I am chastising here, and I’m merely making an effort to change the collective ways of web developers. If you are the creator of one of these websites and you end up reading this because you saw an incoming link from this post, please keep in mind that there is a little extra snarkyness thrown in for dramatic effect. I think all of the websites in this post are very high quality and I am jealous of your skills

Green Park 2

Claims: XHTML & CSS

Does the XHTML validate? No

Does the CSS validate? No

Analysis
This theme claims to have valid XHTML and CSS in the footer. However the claim is not linked anywhere, leading me to believe the designer couldn’t get his site to validate but still wanted people to think it did. He wanted to have his cake and eat it too. So, I plugged in his URL to both the XHTML and the CSS validators. Fail on both counts.

Grade

F

iNove

Claims: XHTML & CSS

Valid XHTML? Yes

Valid CSS? No

Analysis
The CSS errors are actually contained in a plugin in the Wordpress installation, not the theme files. However, if you’re going to include the links in your footer, I don’t care where the errors are, make sure your page validates. Overall, this website actually does a fairly decent job of validating.

Grade

B

Pixel

Claims: XHTML

Valid XHTML? No

Analysis
This site says it has valid XHTML. And yet, when clicking on the link that boasts of this feat, I was presented with 6 errors in the markup validator. At least the designer did not include a “Valid CSS” link.

Grade

D

dfBlog

Claims: XHTML

Valid XHTML? No

Analysis
Here we find another claim for valid XHTML, yet are met with a plethora of errors when we actually take the designers up on their word. No valid CSS links could be found, but judging by the looks of things I wouldn’t be surprised if it failed in that area too.

Grade

D

Creamy

Claims: XHTML & CSS

Valid XHTML? No

Valid CSS? yes

Analysis
This is a visually compelling and beautiful website. It would have been perfect if they wouldn’t have blurted out in the footer that it was valid markup and CSS. While the XHTML did not validate, at least the CSS did, and for that this website got a little higher grade.

Grade

C

Melle Wynia

Claims: XHTML & CSS

Valid XHTML? No

Valid CSS? No

Analysis
From Melle’s website:

I’m Melle Wynia, a webdesigner from the Netherlands. I design and create websites with Passion.

Well, Melle, passion or not, your website doesn’t validate. You should either fix it so that it does, or remove that statement.

Grade

F

Splact

Claims: XHTML & CSS

Valid XHTML? No

Valid CSS? No

Analysis
Where to begin, where to begin. First of all, neither claims were true – not valid XHTML or CSS. And again the claims in the footer weren’t even linked to anything. Why don’t we all just write whatever we want on our websites and magically they will come true? How about, “Outer Space Web Company – blogging since 1874″. Oh, wait. Well you get the idea. But the worst part of this website is that it is the site of a web developer. They should know better.

Grade

F

Cordobo

Claims: XHTML & CSS

Valid XHTML? No

Valid CSS? No

Analysis
This has to be my favorite. It’s the personal website of a freelance web designer who designed some of the most popular Wordpress themes on the market. He has a very nice, minimalistic website. However, he states that he is:

…a freelance webdesigner, xhtml/css coder & webstandards lover based in Mannheim/Germany…

The problem? His page does not validate in either category.

Grade

F

It’s not that I’m a stickler for page validation. But I do have strong feelings about following through on things. If you are using valuable page real estate to boast of your markup validation, please make sure your page actually validates. If it was up to me I would abolish the practice of including this verbiage on web pages (because seriously who cares?). But since it’s not up to me, and people will continue to do it, Outer Spice will continue to tout the links in our footer. But we don’t write checks our butts can’t cash. Here’s proof of our validation:

Grade

A+