Free Stuff for Web Designers

0 comments


PhotoSlide Gallery with Captions
A little image gallery with captions and numbering that lets you drag the photos left and right through the gallery. All the images and captions can be controlled through the XML.

PREVIEW | DOWNLOAD
PhotoSlide


Doodle Pad!
An easy to customize Flash doodle pad. As always, source included...

PREVIEW | DOWNLOAD
Doodle Pad


Clean Blue Preloader
A nice little preloader for all your preloading needs. Easy enough to change colors as necessary.

PREVIEW | DOWNLOAD
Clean Preloader


Circular Preloader
Another preloader with progressive loop. Enjoy!

PREVIEW | DOWNLOAD
Circular Preloader


Percentage Follow Preloader
A preloader that has the percentage follow the mouse cursor. (Move your mouse over the active window if previewing.)

PREVIEW | DOWNLOAD
Follow Preloader




Thanks to the kindness of audio mixmaster Adrien Gardiner, here are some fine audio loops that are free for the taking, and can be used both personally and commercially (outside of reselling them, of course). A great asset to freelancers on a budget! Adrien sells many more loops over at FlashDen.





Here's a sample Terms and Conditions for website freelancers in Word format. Hope it helps you prepare your own!

Download Website Freelancer Terms and Conditions





There are a couple contests each month so if there isn't a current one happening right now, just be patient.


Letterhead and Logo Design 9 (October 19, 2007)

To a random commenter, we gave away a brand new copy of the best-selling annual Letterhead and Logo Design which features the most creative and inspiring work from well-known design leaders, new design firms, and cutting edge artists -- a highly useful resource for freelancers.


Coffee for Bloggers (November 2, 2007)

We gave out $5 gift cards to the first five bloggers who met the conditions mentioned in this entry here.


Coffee for Freelancing (November 30, 2007)

We gave out $5 gift cards to 3 random commenters who shared why they freelance.


Holiday Reading Giveaway (December 21, 2007)

We had three books and some coffee to give away, just in time for the holidays.

sIFR

0 comments
Scalable Inman Flash Replacement (sIFR) is an open source JavaScript and Adobe Flash dynamic web fonts implementation, enabling the replacement of text elements on HTML web pages with Flash equivalents. It was initially developed by Mike Davidson and improved by Mark Wubben. It is a scalable variety of HTML text-to-flash replacement pioneered by Shaun Inman.
CSS support in web browsers did not, at the time of sIFR's creation, allow webpages to dynamically include web fonts, so there was no guarantee that fonts specified in CSS or HTML would show as intended, as the browsing user may or may not have had the specified font installed in their system. sIFR embeds a font in a Flash element that displays the text, preempting the need for a font to have been manually pre-installed on a user's system.

A common technique is to use raster graphics to display text in a font that cannot be trusted to be available on most computers. Text created this way pixelates when scaled and cannot be partially selected. In contrast, sIFR text elements mimic normal HTML text – they are relatively resizeable and copyable.

sIFR requires JavaScript to be enabled and the Flash plugin installed in the reading browser. If either condition is not met, the reader's browser will automatically display traditional CSS based styling instead of the sIFR rendering. sIFR is not designed for body copy text as rendering greater bodies of text with Flash place formidable demands on the computer. Due to this restriction, Mike Davidson himself admitted that
“ While sIFR gives us better typography today, it is clearly not the solution for the next 20 years. ”

sIFR has been used on a variety of well-known web pages, such as those of GE, Nike and Red Hat. As of December 2008, the current sIFR release is version 2.0.7. Version 3 is in beta.
Even though sIFR has been around for a couple years, many web designers have still never heard of it, let alone use it. sIFR (or Scalable Inman Flash Replacement) allows you to use custom typography on your site by utilizing JavaScript, Flash, and CSS. While most people simply create images when they need a custom-type title, sIFR can dynamically create short text blocks using whatever font you want (while still rendering the text with a default font on non-Flash browsers).

Why would this be useful? Well, for starters, it makes creating custom titles a snap (no images needed). sIFR is also great if you need to create titles on the fly (like for blog post titles). In general, if you want to utilize better typography for your site, sIFR might be the easiest way to pull it off.

Unfortunately, using sIFR is somewhat programmatic in nature and reliant on the user having a little familiarity with JavaScript and Flash. So for those who care more about implementing the effect than the actual programming behind it, here's a quick guide to get you started:

Step 1: Download the Necessary Files
For our purposes, you can download this zip with the necessary sIFR files (currently in version 3).

Step 2: Choose Your Font in the FLA and Publish
After unzipping the file, locate and open sifr.fla in the Flash directory. Double-click on the text movie clip, then click on the text and change the font to any font on your system. Publish the Flash file and move the newly created sifr.swf down to the same directory as your web page. Rename sifr.swf to a more descriptive name like avenir.swf.

Step 3: Include the CSS and Javacript in Your Page
Open up default.htm and notice the inclusion of these three necessary files:

sIFR-screen.css
sIFR-print.css
sifr.js

These files need to be included wherever you will be using sIFR.

Step 4: Create the CSS for Your Custom Type
Also notice in the default.htm that there is some CSS (which is included internally here for simplification):

This first part sets the size of the font as well as the backup font-family for non-Flash browsers:

.flash-title
{
font-size:22px;
font-family: Arial;
}



This second part is a required class used to hide the text if they do have Flash.

.sIFR-active .flash-title
{
visibility: hidden;
font-family: Verdana;
line-height: 1em;
}



Step 5: Run the JavaScript and Use the CSS
And lastly in default.htm, you need to run the few lines of JavaScript you see there, making sure to use the swf you published and named in Step 2.

var avenir = {
src: '/sifr3/avenir.swf'
};

sIFR.activate(avenir);

sIFR.replace(avenir, {
selector: '.flash-title',
wmode: 'transparent'
});


Now you're free to wrap any text in the flash-title class. That's all there is to it (note that you may have to run this on an actual server).



If you're feeling more ambitious, you can always explore the multitude of options via JavaScript and Flash at the official sIFR wiki and download site. And if you end up using sIFR a lot, consider donating to the developers who've spent hundreds of hours on this. Hope this little guide has been helpful!

External links

Nexus One Google Phone - Web meets phone

0 comments
The Nexus One is a smartphone from Google, which uses the Android open source mobile operating system.The device is manufactured by Taiwan's HTC Corporation, and became available on January 5, 2010. Features of the phone include the ability to transcribe voice to text, noise canceling dual microphones, and voice directions while driving.

The phone comes unlocked and is not restricted to any particular mobile network provider. Google currently offers it for use on the T-Mobile network in the United States; a version for use on the Verizon (US) and Vodafone (European) networks is expected in the second calendar quarter of 2010.

Get a Free CAPTCHA For Your Site

0 comments
CAPTCHA: Telling Humans and Computers Apart Automatically

A CAPTCHA is a program that protects websites against bots by generating and grading tests that humans can pass but current computer programs cannot. For example, humans can read distorted text as the one shown below, but current computer programs can't:

CAPTCHA example

The term CAPTCHA (for Completely Automated Public Turing Test To Tell Computers and Humans Apart) was coined in 2000 by Luis von Ahn, Manuel Blum, Nicholas Hopper and John Langford of Carnegie Mellon University.

Get a Free CAPTCHA For Your Site

A free, secure and accessible CAPTCHA implementation is available from the reCAPTCHA project. Easy to install plugins and controls are available for WordPress, MediaWiki, PHP, ASP.NET, Perl, Python, Java, and many other environments. reCAPTCHA also comes with an audio test to ensure that blind users can freely navigate your site. reCAPTCHA is our officially recommended CAPTCHA implementation.

Use reCAPTCHA on Your Site!

reCAPTCHA helps prevent automated abuse of your site (such as comment spam or bogus registrations) by using a CAPTCHA to ensure that only humans perform certain actions.

  • It's Free! Yep, reCAPTCHA is free.

  • It's Useful. Why waste the effort of your users? reCAPTCHA helps to digitize books.

  • It's Accessible. reCAPTCHA has an audio test that allows blind people to freely navigate your site.

  • It's Secure. Most other CAPTCHA implementations can be easily broken.

  • It's Popular. Over 100,000 sites use reCAPTCHA, including household names like Facebook, Ticketmaster, and Craigslist.

  • It's Easy. reCAPTCHA is a Web service. As such, adopting it is as simple as adding a few lines of code on your site. For many applications and programming languages such as Wordpress and PHP we also have easy-to-install plugins available. We generate and check the distorted images, so you don't need to run costly image generation programs.

Sign up Now