Search includes auto-suggest.

Easy to navigate results and you can filter by size and licenses. Both PNG and ICO formats are available as well.

The site is wonderfully designed and it functions fantastically. The bottom line is it provides an efficient way to find high quality icons which is useful to almost any web designer. Another tool added to my web designer arsenal.

Locker Pulse began as a side project that Adam was working on but now it has become our next major business venture at Pure Adapt. Read more about the conception of LockerPulse on Adam’s blog.

The design process has begun and I’m very excited to be involved in this unique venture into sports with the design ideas that we have. Take a sneak peek at what we have so far on the LockerPulse splash page and if you sign up now you’ll receive a special offer on launch. In the LockerPulse design we hope to bring users a better way to stay connected with their favorite sports teams through usability and simplicity with some badass aesthetics.

Starting with this unique design concept that we have really gives me an opportunity to push my design skills to the next level. Speaking of design, I want to say how much I hate IE for the umpteenth time, because it renders everything like crap. Now getting off that topic I’ll be using resources like Smashing Magazine for inspiration to get my design juices flowing and inject them into LockerPulse. The design is coming along and I can’t wait till we unveil it to the world in May.

LockerPulse is coming 5.1.2010! Sign up today to get a special offer when it goes public.

While I was redesigning my blog and looking for inspiration I stumbled upon an amazing web design site, SmashingMagazine.com, which is choc full of useful web design information and inspiration.  When I first found the site I couldn’t get off it because of all the great information it had.

Smashing Magazine was founded in 2006 with the purpose of providing readers information about the latest trends and techniques in web development.

While I was on the site I found myself constantly pondering things like “I want to read this, I want to try that, or that’s awesome”. The quality of content that SmashingMagazine.com offers makes it one of my top design resources. Since discovering the site when I redesigned my blog about 5 months ago, visiting Smashing Magazine has become one of my beginning steps in my design process for inspiration and the latest design trends.

Check out some of their recent posts:

• 50 Useful Coding Techniques (CSS Layouts, Visual Effects and Forms)
• The Seven Deadly Sins Of JavaScript Implementation
• Email Newsletter Design: Guidelines And Examples
• 35 Beautiful E-Commerce Websites

Smashing Magazine is an awesome design resource so as designers lets take advantage of resources like Smashing Magazine to keep up with trends and continue to innovate the web.

The basis of this image swap technique is to set a background image to be your image you want to have swapped when you hover over it. Then insert the default image which will sit on top of the background hiding the background. Create a style to change the opacity of the default image to full transparency when you hover over it, voila you have an image swap.

Requirements
CSS3 Property: Opacity
Opacity changes the transparency of an element. Most modern browsers already support this CSS3 property. Set values between 0.0 (full transparency) to 1.0 (no transparency).

CSS2 Property: Pseudo Class :hover
Pseudo Class :hover is a dynamic action that happens when you hover over an element.

Examples:

Basic image swap using CSS.

The Code:
HTML
<div id=”css-image-swap-1″>
<img id=”swap-1″ src=”default-image-url” alt=”CSS image swap” />
</div>

CSS
#css-image-swap-1{
width:300px; height:150px; background:url(swap-image-url);
}
#css-image-swap-1 img:hover{
opacity:0;
}

I mentioned above that this method should work with most the modern browsers but I know it doesn’t work for IE7 and older because IE totally sucks.

I’m sure this has been done before but I’d thought I’d share this with everyone. I didn’t find this particular technique when I searched for CSS image swap but I did find others using this basic concept using CSS visibility instead of CSS opacity. Both techniques will get the job done for an image swap.

WoodyPaigeQuotes.com features Woody’s past chalkboard quotes, submit your own Woody Paige Chalkboard Quote, easy way to follow via RSS Feed, Twitter, and email, and lastly user comments.

This was a quick and fun project. Adam posted details on the our WoodyPiageQuotes.com to do list on his blog. Woody Paige’s Chalkboard always gives me a laugh which made making this site all the more fun to do. Enjoy Woody Paige’s Chalk Board Quotes.

Just in time for the holidays is My-Wish-List.com. Create your own wish list online and share it with your friends and family via email, Facebook, and Twitter.

Simply enter your name and the gifts you desire most then click “Create Wish List Now”. All done, your wish list is created with your personal permanent link to share with friends and family. No registration is necessary, create unlimited lists and it’s completely free.

Once your wish list is created, you and your friends and family can check Amazon and Ebay for the gifts to making shopping easy.

This was a fun little side project where I got to better my programming skills slightly. A little help from Adam and his programming expertise it’s up and ready for the holidays.

It’ll be interesting to see if this catches on with it’s easy sharing capability. If one person shares their wish list with their friends and family then one of them likes it and does the same it could get viral.

Create your own wish now! Happy Holidays!

PicApp has just made life easier for bloggers and web content creators with their innovative news and stock photo website. All their images are free and legal for you to use. This is super convenient to bloggers looking for images for their posts. With PicApp there’s no more worries on finding free and legal photos to use.

The picture below from PicApp of Larry Fitzgerald comes from a game that was played just earlier today between the Arizona Cardinals and Seattle Seahawks. When you use a PicApp image it also offers thumbnails of additional images and the option for others to embed the image.

PicApp is easy to use. All you have to do is search for the image you desire, click on it, then copy and paste the code into your blog. PicApp has also partnered up with some major content providers like Getty Images, Corbis, Pacific Coast News, and Newscom just to name a few, to bring you premium images. On top of all that PicApp is always updating with new content as you can see from the Larry Fitzgerald image from a game that finished no more than a few hours ago.

For funsies lets search for Transformers Revenge of the Fallen and embed some images. I got a badass picture of Optimus Prime and the stunning Meagan Fox.

The only downside is that the image code automatically links back to the image at PicApp, but that’s nothing that can’t be changed with a little HTML editing. (Update: The link must stay intact, it’s part of their terms)

Worry free image use, what more can you ask for. When you’re looking for stock images or up to date news images I think you got start at PicApp.

What is Z.ips.ME you say? Z.ips.ME is a little open source program that my business partner Adam came up with that lets you create your own URL shortening service.

Simple to use and easy to install, Z.ips.ME gives you control of your URLs. I think it took me less than 10 minutes to get everything set it up. Follow the 5 installation steps and you’ll be golden. The installation process is just like WordPress.

Key benefits of Z.ips.ME:

• URL naming control with keywords. (i.e. I twittered about Jet Blue’s unlimited flying for $599 using my very own shortened link http://www.michael-li.com/zipsme/JetBlue)
• Peace of mind that your URLs are safe from being dead links because the service you used closed down.
• Private admin system with robust statistics with clicks, referring sites, browsers, and operating systems.
• Branding your own domain.

Don’t know how to do the installation or just don’t want to, Z.ips.ME does offer a installation services if you contact them.

This is one of the many little projects that I hope Pure Adapt, Inc will continue to develop.  We have tons of ideas.  While developing these little projects, hopefully we hit a couple more like Sports Lizard and HotteeeZ.  Those twos sites make some decent money for very little amount of work.  Minimal work and maintenance equaling continuous income is a no brainer, I think.  Like Adam said about projects that don’t pan out, ” If not, there’s really no loss for us and we can just try some more until something works. How fun is that?“  That’s the truth, these are not high risk projects that we’re taking on and it’s fun as H E double hockey sticks.

Back on to Z.ips.ME.  If you’re looking for your very own URL shortening service Z.ips.Me is simple to use and gets the job done.  Check out the Z.ips.Me for more information and screen shots.

From a web designers perspective, IE really sucks and specifically IE7 and lower. With the recent release of IE 8 it will certainly be better but as of March 2009 there are still 41% (via w3Schools.com/browsers) of people still using IE7 and lower. The sad thing is people are still using IE6 in that percentage too.

Why does Internet Explorer suck? It basically sucks at rendering webpages and isn’t compliant with w3c standards.  Until the release of IE8, Internet Explorer was so far behind in web browsing standards.  This just creates extra work for developers because they not only have to develop for one brower, they have develop for multiple browsers becaues IE wants to be different and be sucky.  This will continue to be problem for while until the old IE browsers are phased out which may not be for a few years.

As we were developing the new Detailed Image site, coming soon, we ran into some wacky problems that can’t be ignored because there is still such a large percentage of people using IE7 and lower.  IE has been such a pain in the ass, so I want to share the problems that I’ve encountered while developing the new Detailed Image for Internet Explorer.

Stupid IE Problems

• PNG image transparency support.  This has been a known problem with Internet Explorer for a long time and even with the release of IE7 it wasn’t fixed.
• In IE7 a repeating transparent PNG image will cripple the browser.  This problem freaked me out because this could’ve meant developing a whole new design for IE7 and lower.
• In IE6 and lower there are major problems rendering css padding and margin.
• When using a css list style image as your default list style, list-style:none will not work.  You must use list-style-image:none.
• CSS list-style-position inside and outside may create funky list layouts.
• No CSS table support in IE7 and lower.  CSS tables are the future of  web design.

Those are some stupid problems that IE creates for web developers.

If you’re developing for Internet Explorer a must have tool for is IE Tester.  IE Tester is a great tool that lets you view websites from IE5.5 – IE8.  You can also add the plugin DebugBar for easier debugging of IE problems but this is in no way comparable to the Firefox plugin Firebug,  where you can make lives changes to a webpage which I highly recommend for web developing.

On the new Detailed Image we’re making a push for people to upgrade their browsers if they are using IE7 or lower with a subtle message at the top of the site and warning sign.

Users of IE7 or lower please upgrade your browser for a safer and better internet browsing experience.