Web 2.0

Make CSS Cross Browser Compatible in Seconds

Nettuts+ has launched a new amazing website Prefixr using which you can make your CSS3 Cross-Browser Compatible in Seconds, now you can write the whole stylesheet keeping in mind just one engine/web browser(like webkit or moz) and let this website make it compatible with all other engines/web browsers by adding their respective tags. Prefixr will filter through the applicable CSS3 properties and dynamically update them.

The website is up at http://prefixr.com/. It also given an option to compress the CSS and provides API if you want to execute it directly from your text editor.

Please remember this website is still in Alpha stages and has some bugs like no support for properties like “border-top-left-radius“.

6 Websites for Animated AJAX Loading GIF Images

Lately I was making a template which had a working AJAX Contact Form, at first I struggled a little for the loading image, but then I realized there are couple of websites where we can actually get(and generate) amazing loading GIF images easily according to our specifications, most of these sites also provide a wide range of images to chose from. Thus I am sharing some of those websites, hope this is helpful.

Preloaders.net

preloaders.net Free AJAX animated loading gif s 3 dimensional 3D

Ajaxload.info

Ajaxload Ajax loading gif generator

Chimply

Chimply generates your images

Web Script Lab

Web Script Lab » Ajax Loading Gif Generator

Load Info

Load Info gif generator

AJAX Activity indicators

AJAX Activity indicators Animated GIFs designed to indicate your site is doing something

Design Kindle: Awesome Website for Free Web Design Files

Design Kindle is a community driven web design resources website which offers premium quality web design files like graphics, vectors, icons, textures, etc for absolutely free with no required membership. Isn’t this awesome? Thats not all, all the stuff here is royalty free and we are free to use them in our personal and commercial projects, without the necessity of linking back to them.You can visit the website at http://www.designkindle.com/. I personally liked their free graphics collections a lot, they are totally amazing and very useful in creating websites.

If you know any other website like this, feel free to share.

Best Websites for Stock Free Photos

We quite often need to use images for our websites or blogs and for getting legit images we always end up buying them, and spend a lot of $. But there are many websites on Internet which offer free Royalty Free Photos. I sharing some of the best websites which offer Free Stock Photos. Please drop by if you know any other too.

stock.xchng


stock.xchng - the leading free stock photography site

Getty Images


Royalty Free Images Photos Unlimited Use Getty Images

FreeDigitalPhotos.net


Free Photos - Free Images - Royalty Free Photos - Free Stock Photos - FreeDigitalPhotos.net

morgueFile


morgueFile free photos for creatives by creatives

Corbis Images


Corbis Images – Premium Quality Stock Photography and Illustrations

everystockphoto


everystockphoto - searching free photos

Public Domain Pictures


Public Domain Pictures - Free Stock Photos

Stockvault.net


Stockvault.net - Free Stock Photos and Free Images

Jupiterimages


Stockvault.net - Free Stock Photos and Free Images

freerangestock.com


Free Stock Photos at freerangestock.com - Totally Free Stock Photography and Textures

Stock Images on deviantART


Stock Images on deviantART

Flickr


Welcome to Flickr - Photo Sharing

Dreamstime’s Free Stock Images and Photos


Dreamstime - Download Free Stock Images and Photos

Fotolia’s Free Stock Images and Photos


Fotolia's Free Stock Images and Photos

iStockphoto’s Free Stock Images and Photos


iStockphoto's Free Collection

Creative Commons Search


Creative Commons Search

Typography Resources

You must have already seen many websites with fancy fonts and advanced CSS text effects. Web Fonts and Web Typography has totally evolved in last 2 years. Using Web Typography now you don’t need to have images for “cool” text effects and it has replaced heavy designs. Now you just need to code a little for a beautiful text line rather than creating its image on Photoshop. And with Web Fonts libraries, using typographies by designers and developers has been made even easier. In this article I will share few good Web Fonts Directory and links to Typography resources.

Finding Web Fonts

With Web Font libraries it has become very easier for designers and developers to find opensource fonts and use them in their websites. There are many good websites to find Web Fonts, I am including “Free” in parenthesis for sites which provide opensource fonts. Some of them are:

Google Web Fonts (Free)

Google Web Fonts

Adobe Web Fonts

Adobe Web Fonts

Open Font Library (Free)

Open Font Library - Open Font Library

Typekit

Open Font Library - Typekit

WebINK

WebINK Web Fonts

Font Squirrel (Free)

Font Squirrel Handpicked free fonts for graphic designers with commercial-use licenses.

Fonts Live

Fonts Live - Expertly Crafted Web Fonts from Monotype Imaging

Fontdeck

Fontdeck web fonts Real fonts for your website

Fonts.com Web Fonts

Fonts.com Web Fonts

Fontspring

Desktop and font-face fonts Fontspring

exljbris Font Foundry (Free)

exljbris Font Foundry

Webtype

Webtype

CSS3 Text Effects

There are already many tutorials written for various kinds of advanced CSSTtext Effects, you can visit here to see a list of 22 Advanced CSS Text Effects. Please be careful that these text effects might not be compatible with all web browsers. Though all web browsers support typographies very efficiently, and the WOFF is supported by all the major web browsers lately(Firefox 3.6 and later, Google Chrome 6.0 and later, Opera 11.10 and later and Internet Explorer 9).

Further Reading: There is a great article on Steven Snell’s Blog for Web Typography resources, dont forget to read it here.

Benefits of Using Own Domain Email on Google Apps Gmail

Your Email ID is a valuable marketing tool for you, and Email ID of your own domain tells that you have an online presence, where people can find you, etc. Its also a tool to promote your company, as you are promoting your domain by that. Your Email ID will promote your domain rather than Gmail or Yahoo. You can even see here why to go for own domain Email ID. ;-) You can have own domain Email ID using your hosting company’s web mail or buy Email space at some hosting company. But according to me, Google Apps Gmail is provides the best own domain email solutions, and above all, its free(Standard package). Below are few of the many reasons why you should use Google Apps Gmail for your Email purposes.

Reliability/Uptime

Our web servers keep experiencing downs and crashes, and it is a pain when you are on a shared server or low-memory VPS. Imagine you were using your hosting company’s web mail, and had to receive an important email that time when your website/server was down. It will simply bounce. By using Google Apps Gmail you overcome this, as when you use Google Apps all the associated data will be stored on Google Data centers which runs your Email services effortlessly and gives 99.9% uptime.

Collaboration

Domain users can share their calendar from any computer, see when people are available, send invitations, manage RSVPs, do real time editing on documents, spreadsheets & presentations. Also access Instant Messaging (IM)(Using Gtalk) from any computer.

Space

If you have a small dedicated or VPS Hosting, then you probably get small amount of hard drive space, and Email particularly takes a lot of space especially if you have many users. Going with Google Apps Email helps here again, as it provides at least 7 GB of storage on Email accounts and this also increases your server’s efficiency as the load is not on your server for the Email services.

Security

Your SMTP server might get flooded with Spam or SQL hacks might steal credentials of your users. You overcome these also because of Google Apps. You can even disable the email server that came with your hosting account, that is the IMAP/POP3 server and the SMTP. This saves memory too.

Conclusion

There are many more reasons for you to go with Google Apps Gmail, but if you need customized Email service for your company, like custom layout and branding on your users mailboxes then Google Apps Gmail might not be a great option as it isn’t really very flexible. If you need to use for personal purposes or branding doesnt matters, then Google Apps it is! Even if you have a huge organization you can still go with Google Apps as they have multiple editions to suit your needs, plus you get all the Google Apps benefits.

Tackle Productivity lost due to Social Media using Chrome / Firefox Extension

You spend a lot of time on Internet without being productive at all, all thanks to those Social Media websites. Hours pass by doing not so productive work like updating your Facebook or Twitter, reading mails, watering plants on FarmVille, etc. You forget what you came to do.

Tackling it

If you are not happy with this, then you can take control of it by using an extension on your Web Browser. There are many time management desktop softwares available which you can easily get by searching on Internet. But here I am including the browser extensions, there are quite a few of these too, I am sharing two of them below, one is for Chrome and another is for Firefox.

Chrome: If you are on Google Chrome, there is this extension StayFocusd. Time Management Firefox, Chrome
You can allot time for particular website on per day basis using this extension. Like, you allot one hour for Facebook, this means you can not spend more than an hour on Facebook in total in a day, and you chose how you spend it throughout the day.

Firefox: If you are a Firefox user, you can use LeechBlock. You can specify which sites to block, and when to block them. Like blocking facebook.com from 1pm to 3pm or so. You can specify up to six sets of sites to block, with different times and days for each set.

Facebook Shortcuts

Lately I was surfing facebook.com and found that facebook has some default keyboard shortcuts which work cross browser. Thus, I am sharing few of the shortcuts which I found.

  • Alt+1: This key combination takes you to your Facebook home page, No matter where you are in facebook.com
  • Alt+2: This combination takes you to your profile, Again from anywhere in the facebook.com
  • Alt+3: This combination opens up the pending friend requests dialog.
  • Alt+4: By pressing this one you can see your Inbox(i.e. Messages).
  • Alt+5: You can see your Notifications by pressing this combo.
  • Alt+6: Pressing this takes you to the “My Account” where you can change your name and other details.
  • Alt+7: Pressing this takes you to the “Privacy Settings” where you can update/change your privacy settings.
  • Alt+8: This one takes you to the facebook fan page.
  • Alt+9: Takes you to the Terms and Conditions page(Statement of Rights and Responsibilities) which is bigger than a constitution of a country.
  • Alt+0: Takes you to the “Help Center” page. Where you can browse your applications and see facebook features.
  • E: takes you to events
  • F: takes you to friends
  • N: takes you to notifications
  • R: takes you to confirm requests

Also, Facebook added a new emoticon this must be in context to the number 42. Read its wiki for details and significance. You can get this in chat by typing :42:

UPDATE: Few more(Thanks to tudy).

Posterous vs. Tumblr

Posterous and Tumblr are fit for content which is too small for a blog and too big for Twitter. I have started using these two services quite lately. These 2 sites support all kind of rich media, Have longer entries as well as short entries which get auto posted to Twitter. Tumblr provides a hub for storing/sharing  text, photo, quote, link, chat, audio and video(via a bookmarklet right in your browser). Where as Posterous provides a place for blogging, lifestreaming, photo sharing, and video and audio posting. Tumblr and Posterous are less than a Blog, Thus they classify as Microblogs. (Though Posterous can be used as full fledged Blog too.)

Posting

The posting in Posterous is quite easier, One just needs to drop a mail at [email protected] and it gets posted to his/her Posterous. Moreover, There’s also a WYSIWYG Web Interface which does fine. And Tumblr also has an Email posting option and SMS posting option. You can create also create an audio post in Tumblr by calling a toll-free number and leaving a voicemail message. Both these sites have bookmarklets to choose thus easing the usage of its users. There’s no clear winner here, But Posterous is slightly more feasible than Tumblr in posting due to its Email posting feature.

Integrations

Tumblr connects to your Facebook and Twitter and posts your Tumblog stuff there. Tumblr also has an auto-import feature, Which imports your RSS feeds and Diggs and shows on your Tumblr. Where as Posterous has a edge over integrations, It connects to your Twitter, Facebook, Flickr, Youtube and few other sites. This means if you post a video to your posterous it gets posted to your posterous as well as your Youtube. Also, If you post a picture to your Posterous it gets posted to your Flickr and Facebook too. You can also import your Blogs to posterous and also export posterous. Moreover, If you have connected your many profiles on posterous but you just want it to post to facebook, You can do it by sending the email at [email protected]. Also, If you are in a mood of sending it to Twitter and Facebook, You can do it by sending the mail at [email protected]. Here, Posterous is the clear winner, Because of the number of accounts you can integrate with. But, The auto-import feature of  Tumblr also can’t be underestimated.

Customization

One can do a lot with the looks of both. These sites already have a gallery to chose themes from. Moreover, One can also install or create his/her own theme(Using xHTML and CSS). Here, I think both the sites provide with equal customization.

Commenting

Tumblr doesn’t provides a Comments option on the posts by default. But, Its already there in Posterous. Though you can always install Disqus in you Tumblr, Thus enabling people to comment on your posts. It has been tested against Spam too as it is used in many popular blogs. Here again Posterous takes over Tumblr by providing comment system by default.

Conclusion

Both of these sites are decent on features, Though I felt posterous is slightly better as its upcoming. But at the end personal preference will win out.

Perfect way to Subscribe to RSS


Trying to catch up a Blog(Or Blogs) which don’t provide with an Email Subscription option OR provide a Weekly dispatch only. Well, I encountered the same problem with Ars Technica and some other tech blogs, Ars Technica is an awesome Blog but it just provides with a Weekly email dispatch only and coming to its site everyday just to read it is a big pain. For everyone out there who encounter the same problem in various other Blogs, Here is the solution. There’s a Web Site which converts the RSS or Atom feed into Email and mails you regularly and works as efficiently as the Email Subscription thing. The site is http://www.feedmyinbox.com. I use it to follow many sites which don’t provide with Email Subscription option.

PS:  Don’t subscribe too much,  It will just help in increasing your Unread Emails count :)

<?PHP

// Get these from http://developers.facebook.com
$api_key = ‘xxx’;
$secret = ‘xxx’;

// Names and links
$app_name = “Application name”;
$app_url = “app-url”; // Assumes application is at http://apps.facebook.com/app-url/
$invite_href = “invite.php”; // Rename this as needed

require_once ‘facebook.php’;

$facebook = new Facebook($api_key, $secret);
$facebook->require_frame();
$user = $facebook->require_login();

if(isset($_POST[“ids”])) {
echo “<center>Thank you for inviting “.sizeof($_POST[“ids”]).” of your friends on <b><a href=\”http://apps.facebook.com/”.$app_url.”/\”>”.$app_name.”</a></b>.<br><br>\n”;
echo “<h2><a href=\”http://apps.facebook.com/”.$app_url.”/\”>Click here to return to “.$app_name.”</a>.</h2></center>”;
} else {
// Retrieve array of friends who’ve already authorized the app.
$fql = ‘SELECT uid FROM user WHERE uid IN (SELECT uid2 FROM friend WHERE uid1=’.$user.’) AND is_app_user = 1′;
$_friends = $facebook->api_client->fql_query($fql);

// Extract the user ID’s returned in the FQL request into a new array.
$friends = array();
if (is_array($_friends) && count($_friends)) {
foreach ($_friends as $friend) {
$friends[] = $friend[‘uid’];
}
}

// Convert the array of friends into a comma-delimeted string.
$friends = implode(‘,’, $friends);

// Prepare the invitation text that all invited users will receive.
$content =
“<fb:name uid=\””.$user.”\” firstnameonly=\”true\” shownetwork=\”false\”/> has started using <a href=\”http://apps.facebook.com/”.$app_url.”/\”>”.$app_name.”</a> and thought it’s so cool even you should try it out!\n”.
“<fb:req-choice url=\””.$facebook->get_add_url().”\” label=\”Put “.$app_name.” on your profile\”/>”;

?>

<fb:request-form
action=”<? echo $invite_href; ?>”
method=”post”
type=”<? echo $app_name; ?>”
content=”<? echo htmlentities($content,ENT_COMPAT,’UTF-8′); ?>”>

<fb:multi-friend-selector
actiontext=”Here are your friends who don’t have <? echo $app_name; ?> yet. Invite whoever you want -it’s free!”
exclude_ids=”<? echo $friends; ?>” />

</fb:request-form>
<?PHP

}

?>