Sometimes, it can be difficult to track down all of the amazing web services that are available around the web. In this list, we’ll show you 25 essential services that all designers should consider using.

Domainr

What: Pick a original domain name with other TLDs, in the del.icio.us fashion Cost: Free Link: http://domai.nr Why: Desirable .com domain names are scarcer than profitable investment banks. But Domai.nr makes finding pithy URLs easy by querying 280 top-level domains and another 2,014 second-level ones for domain hacks, turning real English words into unique and memorable Web addresses like del.icio.us, internetfamo.us, gee.ky, and iamthewalr.us. Plus, it’s free. — Wired Are My Sites Up?

What: Check whether your websites are up or not and get noticed when they go down. Cost: Free for up to 5 sites; $25/$50/$75 per year for premium services. Link: http://aremysitesup.com Why: When your websites go down, shouldn’t you be the first to know?Our free plan will check up to five of your sites at least 25 times per day. You get unlimited email and SMS notifications and we will do our best to tell you WHY your site was down by providing the HTML status error code. Our premium plans offer significantly more features: Faster site checks, an iPhone application, RSS feeds, Twitter integration, Keyword search, premium-level support, and more! All for just one dollar per site per year (or cheaper!). Templatr

What: Create a simple design with little or no effort. Cost: Free Link: http://templatr.cc Why: It should should be easy to create an individual Design with the templatr. With a little experimentation you will be able to reach the desired result much more quickly than with endless written explanations. Color Scheme Designer

What: Select color schemes and save them for later use. Cost: Free Link: http://colorschemedesigner.com Why: If you are making a website - and who isn’t lately - you need to make a theme for the site. I an not stylistically inclined and am also colorblind, so I have a couple tools that I use when building sites that help me with that side of things. One of them is ColorSchemeDesigner.com - a really great tool to help you get your colors right. — james R Sullivan CSS Sandbox

What: Experiment with CSS styles in real time Cost: Free Link: http://aurelio.net/css-sandbox/ Why: A toy. A teacher. A live demo. A quick reference. A web application. A single HTML page. The CSS Sandbox can be described by all these sentences.

It’s a simple and quick web toy that lets you explore CSS in real time. Just click and see the effect instantly, no Reload needed. It’s fast and funny!

Once you’re satisfied with the style of the Sandbox, roll your mouse over the handy CODE button. A panel will pop, showing all the necessary CSS code to apply that formatting to your own site. Typetester

What: Compare screen type Cost: Free Link: http://www.typetester.org Why: The Typetester is an online application for comparison of the fonts for the screen. Its primary role is to make web designer’s life easier. As the new fonts are bundled into operating systems, the list of the common fonts will be updated. BrowserCam

What: Cross Browser Compatibility Testing Tools Cost: 24 hours free trial; prices vary from $20 to $1000/month Link: http://www.browsercam.com Why: See your web design on any browser on any operating system. Check javascripts, DHTML, forms and other dynamic functionality on any platform. Not just yours. Use our bank of testing machines remotely to test your website. Genfavicon

What: Convert images into favicons for your website. Cost: Free Link: http://www.genfavicon.com Why: Genfavicon is a site that features an application that allows you to create an icon out of the image of your choice. Simple select your image, by pasting in the URL address or uploading the image. Then choose which part of the image you wish to make the icon by dragging the mouse and cutting the desired shape. You must then select the size of your icon; 16X16, 32X32, 48X48, 64X64, or 128X128.Preview what you have chosen and then finalize your icon.You can then use your icon for your webpage or any other place you would like to put it.Making your favicon could not be easier, in three quick steps you have made an icon that you can easily paste on your webpage. — KillerStartups Time59

What: Track time and expenses, handle invoicing and payments. Cost: Risk-free 30 days trial, $49.95 per year Link: http://time59.com Why: Be more organized with less effort. Time59 keeps track of the work you do, gets your invoices out quickly, and manages client payments. Your Time59 account can be accessed from any internet connected computer… at home, at your office, or on the road. Getting started with Time59 is easy. There’s nothing to install, just sign up and you’re ready to go. Remember The Milk

What: Manage tasks intuitively and interact with other web services Cost: Free. Pro account are $25/year Link: http://www.rememberthemilk.com Why: Remember The Milk is the best way to manage your tasks online (obviously ;). Managing tasks is generally not a fun way to spend your time. We created Remember The Milk so that you no longer have to write your to-do lists on sticky notes, whiteboards, random scraps of paper, or the back of your hand. Remember The Milk makes managing tasks an enjoyable experience. We offer a web application (on this site) and a number of additional Services to help you be more organized and productive. Basecamp

What: Project collaboration tool Cost: Free 30 days trial; from $24 to $149/month, depending on number of projects and storage Link: http://www.basecamphq.com Why: Basecamp is online project management software. People can create, manage and communicate tasks, files and to-do lists. — AppAppeal RescueTime

What: Automated time tracking and management Cost: 14 days free trial. Solo light account available for free; Pro account upgrade costs $8/month Link: http://www.rescuetime.com Why: RescueTime is a tool that allows you to easily understand and optimize how you and your team spends their time and attention. One of the most important things about RescueTime is that there is NO DATA ENTRY. You install a small application on the computers at your company and we magically track what software and which web sites are actively being used. Mint

What: Web site analytics Cost: A single site license is $30 Link: http://haveamint.com Why: Mint is an extensible, self-hosted web site analytics program. Its interface is an exercise in simplicity. Visits, referrers, popular pages and searches can all be taken in at a glance on Mint’s flexible dashboard. CrazyEgg

What: Supplement your analytics with visuals and actionable data Cost: Plans start at $9/month Link: https://crazyegg.com Why: Analytics only give you a static interpretation of your site visitor’s activities. You may be able to tell how many people have visited your site, or viewed a particular page, but you won’t be able to gauge effectiveness of design elements, link placement or popular areas of your site. If you want to know where people are clicking on your site, and which areas could use improvement, you need Crazy Egg. Crazy Egg helps you visualize your visitors. ConsoleFish

What: Access your secure shell server Cost: Free Link: http://serfish.com/console/ Why: As a free AJAX SSH client, the consoleFISH provides web-based access to any SSH server. It can be used to bypass firewalls and proxies on a secure HTTP connection. Moreover, the consoleFISH makes it possible to anonymously open SSH connections as the IP address of the connecting web client is not sent to the remote system. SurFTP

What: Web-based FTP client Cost: Free Link: http://surftp.com Why: Once you are logged in, you will be able to navigate the FTP server, upload files, download files, zip files, unzip files, install software, copy, move and delete, copy or move to a second FTP server, rename and chmod. Heroku

What: in-browser Ruby on Rails development environment Cost: Free for basic usage; up to hundreds for add ons and performances Link: http://heroku.com Why: There are two sides to Heroku’s offering. The first is a completely in-browser development environment where RoR programmers can build their apps instead of doing so with software on their own computers. [...]The second aspect to Heroku’s offering, which it is promoting with new materials on its website today, will allow RoR developers to not only build their apps with Heroku but to host and scale them there as well. — TechCrunch Bespin

What: Open, extensible web-based framework for code editing Cost: Free Link: https://bespin.mozilla.com Why: Bespin is a Mozilla Labs experiment that proposes an open, extensible web-based framework for code editing that aims to increase developer productivity, enable compelling user experiences, and promote the use of open standards. [built using HTML5 technology] Google AJAX APIs playground

What: Online script development tools Cost: Free Link: http://code.google.com/apis/ajax/playground/ Why: Google’s AJAX APIs let you implement rich, dynamic web sites entirely in JavaScript and HTML. You can add a map to your site, a dynamic search box, or download feeds with just a few lines of JavaScript. With AJAX APIs Playground you can try all these functions with save & Export features! — Feedmyapp Snipplr

What: Social snippet repository Cost: Free Link: http://snipplr.com Why: Snipplr is a public source code repository that gives you a place to store and organize all the little pieces of code that you use each day. Best of all, it lets you share your code snippets with other coders and designers. Did we mention it works with TextMate, too? It’s code 2.0. Wofoo

What: Form builder Cost: Free for limited number of entries and one form only; from $9.95/month for more intensive usage Link: http://wufoo.com Why: Wufoo strives to be the easiest way to collect information over the Internet. Our HTML form builder helps you create contact forms, online surveys, and invitations so you can collect the data, registrations and online payments you need without writing a single line of code. Dabble DB

What: Online database Cost: Free, but data is public; all data private and secure for $8/month Link: http://dabbledb.com Why: Dabble DB is a web-based application that lets you work with data on your own terms. Instead of downloading an application, you upload your data and then build your own database application. You can import existing data or just start from scratch. Extend it or change it as you go. Restructure and redefine how you organize your data on a whim. Writeboard

What: Collaborative writing software Cost: Free Link: http://writeboard.com Why: Writeboards are sharable, web-based text documents that let you save every edit, roll back to any version, and easily compare changes. Use writeboardto write solo or collaborate with others. Zoho Suite

What: Productivity, collaboration and business apps Cost: Free for personal use; pricing varies depending on the services needed Link: http://www.zoho.com Why: While Google Docs seems to be the first product people think of when online office suites come up, the lesser-known Zoho Suite offers more apps and features. See how Zoho stacks up against Google Docs. — LifeHacker Box

What: Online storage Cost: Free Lite plan; paid plans start at 5.66/month after a 14 days trial Link: http://box.net Why: Box.net serves up more than a quarter billion files every year, so we know the innovative, evolving ways that businesses use Box and we understand that the people creating content are just as important as the content itself. With this in mind, we bring together the best of traditional content and collaboration tools with the most effective elements of social software to create business solutions that not only capture and centralize the knowledge of an organization, but also connect that knowledge across dispersed teams for enhanced collaboration and discovery.

Please subscribe to the Theme Forest RSS Feed, and follow us on Twitter.

A new week is coming and in this post I want to suggest you some interesting tutorials and resources for web developers I bookmarked this week. If you want to suggest a link, please leave a comment.1. InfoVis ToolkitThe JavaScript InfoVis Toolkit provides tools for creating Interactive Data Visualizations for the Web. It supports multiple data representations: treemaps, radial layouts, hypertrees/graphs, spacetree-like layouts, and more.2. VaadinVaadin is a Java framework for building modern web applications that look great, perform well and make your user happy.3. Flip!Flip is a jQuery plugin for jquery that will flip HTML elements in four directions. It's really simple to implement and customize.4. UploadifyUploadify is a jQuery plugin that allows the easy integration of a multiple (or single) file uploads on your website. It requires Flash and any backend development language. An array of options allow for full customization for advanced users, but basic implementation is so easy that even coding novices can do it.5. Create a Twitter-Like "Load More" WidgetBoth Twitter and the Apple App Store use a brilliant technique for loading more information; you click the link and fresh items magically appear on the screen. This tutorial teaches you to use AJAX, CSS, Javascript, JSON, PHP, and HTML to create that magic. This tutorial will also feature both jQuery and MooTools versions of the script.6. FullCalendarFullCalendar is a jQuery plugin that provides a full-sized, drag & drop calendar like the one below. It uses AJAX to fetch events on-the-fly for each month and is easily configured to use your own feed format (an extension is provided for Google Calendar). It is visually customizable and exposes hooks for user-triggered events (like clicking or dragging an event).7. HTML5 drag and drop in Firefox 3.5In this tutorial you can learn HTML 5 specification section on new drag-and-drop events, and Firefox 3.5 with an included implementation of those events.8. Music Player with mouse gesturesThis tutorial illustrates how to implement an amazing music player using mouse gestures & hotkeys in jQuery. You can Click & Drag with mouse to interact with interface’s music player or use directional keys & spacebar instead of mouse.9. jQuery Image MagnifyjQuery Image Magnify enables any image on the page to be magnified by a desired factor when clicked on, via a sleek zoom in/out effect. The enlarged image is centered on the user's screen until dismissed. It works on both images with and without explicit width/height attributes defined.10. Creating a Keyboard with CSS and jQuerySometimes it's just fun to play around with the programming languages we know and see what we can create. It might be nice to create a little online keyboard with CSS, and then make it work with jQuery. The keyboard includes "action" keys (caps lock, shift, and delete) which dynamically changes the keyboard when clicked. This tutorial it'll show you how to build it.11. Img NotesImg Notes is an useful jQuery plug-in to add notes over images in a Flickr-like style. It's simple to implement and customize.12. WriteMapsWriteMaps is a free web-based tool that allows you to create, edit, and share sitemaps online. As a WriteMaps user, you and your team will be able to build and access your sitemaps from anywhere, without having to rely on proprietary desktop apps and static files.13. Simple vibration effect for your form box with jQueryThis effect can be used to validate certain criteria in your form. Other than using highlighter to highlight the error area, we can use a more creativity approach by vibrating that particular input box to alert the user. This tutorial demonstrate a very easy way to understanding how vibration works on the web and how it can be used in your web design.14. epiClockepiClock is an extremely lightweight jQuery plugin which gives users the ability to easily create and manage any number of javascript powered clocks.15. ThickBoxThickBox is a webpage UI dialog widget written in JavaScript on top of the jQuery library. Its function is to show a single image, multiple images, inline content, iframed content, or content served through AJAX in a hybrid modal.

I like Adobe AIR. With AIR you can develope rich internet applications that run outside the browser on multiple operating systems. In this post I want to share with you some really interesting Adobe AIR applications for web lovers: this list includes some social-network clients, developer tools, and mashup applications.1. TIME 100 desktop applicationTIME 100 allows you to access to the complete archive of past and present honorees on the TIME 100 annual list of the “World's Most Influential People”.I think it's one of the most interesting applications actually in circulation. Take it a look!2. DestroyTwitterDestroyTwitter is a robust but compact Twitter application built on the Adobe AIR platform. It consists of a series of canvases that constantly update to keep tweets current and up-to-date using notifications that appear immediately after a new tweet arrives.DestroyTwitter also features complete direct messaging functionality. Messages and tweets can be replied to with the original visible for quick and easy reference. A search function is also available to track anything that's being talked about.3. FeedalizrFeedalizr is a social media desktop client that keeps track of updates from friendfeed, twitter, facebook, Flickr, Twitpic & jaiku. It offers full support for these services so that users can interact, i.e. comment, like, favorite, tweet, reply etc. and their updates are instantly reflected on the services website and added to their stream.4. SkimmerSkimmer is an Adobe AIR desktop application designed to streamline, beautify, and enhance the experience of participating in your most frequently used social networking activities.It improves upon your day-to-day interaction with multiple social networks, removing distractions and providing a rich experience that is particularly suited to multimedia content.5. Icon GeneratorIcon Generator is a little application that lets you generate a CS3 or Web 2.0 style icon, only 3 step. Pick color, type characters, and save it. Just create 4 different sizes of the icon.6. Kuler DesktopKuler is an online application to create and share color harmonies. With this AIR application you can search and import Kuler themes directly into Creative Suite 3 Illustrator, InDesign, and Photoshop.You can also view the highest tated, most popular, newest, and randomly selected themes. Drag and drop themes as transparent "tear offs," to scale and view over any application.7. Lita Lita is an administration interface for SQLite databases. It lets you edit your databases structure and data in a dedicated environment.With Lita you can open, create, compact databases; create, rename, delete, and empty tables; Easily run, import and export your custom SQL statements.8. BookmashBookmash is a mashup application which allows you to find quickly videos, music, photos, people and news on line.Any suggestions about other interesting AIR applications? Please leave a comment!

In the past weeks I received some requests from my readers which asked to me to suggest a simple way to skin HTML form elements. There are a lot of ways to do that and a lot of posts with interesting resources about this topic. But if you want to save time and obtain a nice result I suggest you to use jqTransform or NiceForms.Both scripts are very useful and simple to use. If you want to use a "native" script which doesn't use an external JS framework (such as jQuery or MooTools) I think a good choice is NiceForms otwerwise, if you use jQuery, a good alternative is jqTransform. Take a look how they work.1. jqTransformjqTransform is a jQuery styling plugin wich allows you to skin quickly form elements in a very easy way. The only thing you have to do is to add a javascript inclusion to this plugin in the header section of your web page, create your form and add two lines of JS code to apply the transformation to your form.Use this code to add a javascript inclusion to jqTransform:<script type="text/javascript\" src="jquery.jqtransform.min.js"></script>...now create a form with class property equal to jqTransform:<form class="jqTransform"><!-- Add form elements here... --><form>...then add this JS code to apply the transformation:<script type="text/javascript\">$(function() {$("form.jqtransform").jqTransform();});</script>2. NiceFormsNiceforms is a script that will replace the most commonly used form elements with custom designed ones. You can either use the default theme that is provided or you can even develop your own look with minimal effort.To implement form style transformation you have to add a javascript inclusion to NiceForms in your web page using this code:<script type="text/javascript\" src="niceforms.js"></script>...then create a form with class property equal to niceform:<form class="niceform"><!-- Add form elements here... --><form>It's all. Really simple and fast!Any suggestion? Please leave a comment.

When you want to customize your desktop, one of the first things that’s got to go are your operating system’s default icons. There are quite a lot of free and very impressive icon sets out there for you to use, licensed for personal and/or commercial use. This collection presents to you more than 40 unique, beautiful and free icon sets that you can download and install on your computer to liven up your computer desktop. Exempli Gratia

14 icons in various file formats (PNG, ICN, and ICO). By apathae KIDAUBIS CHINESE WIND ICON

16 unique Chinese themed icons. By KIDAUBIS DESIGN Container Icons

40 icons the Mac OS and Windows. By ANTREPO4.COM Wooden Slick Drives

10 icons for Mac OS and Windows. By Thrasos Varnava HydroPRO v2

10 beautiful icons, the last set from Ben Fleming. Ive Drives

4 beautiful icons for the Mac OS and Windows. By Iconfactory Desktop Icons

9 large-dimension icons that comes in ICO and PNG formats. By Anders Bjarnle Black & Blue Icons

6 icons, you’ll have to scroll down a bit to find the download link. By Icon Drawer Star Trek Folders

4 icons in different sizes (12 icons in total). By Iconfactory Folder Icons Pack

50 icons for the Mac OS and Windows. By deleket Block Creatures Icons

4 unique icons in 3 sizes available for the Mac OS, Windows, and Linux. By Fast Icon icon for transformers

Roughly 65 icons in large sizes. By pf.yuan HD StorageBox

2 stylish icons for the Mac OS. By turnpaper Smashing Retro Icon Set

10 high quality icons in ICO and PNG formats. By Smashing Magazine Antique Icon update

8 unique icons in several sizes and ICO, ICNS, and PNG formats. By Nawfal OldSchool Icon Set

9 icons in three sizes (total of 27 icons). By FreebiesDock.com Platinum Drives

8 icons for the Mac OS. By Gabe Persaud Snowe Doc 2

Over 150 icons in this stylish set. By Gruby Grub Reality

Over 30 stylish icons in various sizes. By KIDAUBIS DESIGN My Fav Buttons Icons

5 cool icons for the Mac OS, Windows, and Linux free for personal use. By Fast Icon Mountain Bike

6 trendy icons in PNG and ICO formats and various dimensions. By IconTexto Disk Jockey Sigma Style

5 icons in two sizes and ICO, ICNS, and PNG formats. By iconshock.com Made Of Wood

Over 30 icons in 4 formats: ICO, ICNS, iContainers, and PNG. By Thrasos Varnava Chinese Style

5 very trendy and unique icons. By Sean iNiZe

166 icons in various sizes and ICO and PNG formats. By Allan B. GP iCons

5 stylish and textured icons. By Mesrop Slick Drives Remake

14 beautiful icons in ICO, ICNS, and iContainer formats. By Thrasos Varnava Sleek XP

Over a hundred icons for various software programs. By deleket Nova

22 beautiful icons in PNG, TIFF, ICNS, and ICO formats. By Icon Lab Concave Icons

6 stylish icons intended for personal use. By Sean Office Space

6 icons for the Mac OS and Windows. By VisualPharm Galactica icons

A set on 9 icons. By Diego Leal Computer Hardware

9 beautiful icons in various sizes for various operating systems. By VisualPharm Flavours Icon Set

Over 150 icons in PNG format. By Smashing Magazine iMac Generations V2

6 stylish iMac monitor icons. By Nando Design Studio Origami Icons

A set of 15 free icons in PNG and ICO formats. By IconDock Trash Can Replacement

4 icons created in Cinema 4D in ICN, PNG and iContainer formats. By Finlay Paterson Web Developer Icons Set

34 custom-made icons. By Smashing Magazine From Russia with Love

4 different icons in various sizes for the Mac OS and Windows. By VisualPharm OSX Mail Stamps

10 icons in PNG format. By .ric MINIUM XP

5 different icons in various sizes (ICO file). By RAD.E8 iVista 2 OS X Icons

4 trendy icons in PNG, ICO, ICNS format. By Sean Related content

40 Beautiful Free Icon Sets 50 Excellent Icon Design Tutorials 30 Excellent Resources for Graphic Design Freebies Related categories: Resources, Graphics Design, Freebies

Finding decent hi-quality vector icons for free via google is kinda hard & annoying. My results mainly lead to sites that wanted to sell you icons. I don’t beleive in paying for things like that, especially when there’s an abundant amount of vector icons that are available for free. So enjoy the list I have compiled of free vector icons. (Almost all of them have been checked to be used for commercial and non-commercial projects but double check while downloading)

When it comes to design, copyright is often a very muddled gray area. Just as the lines between plagiarism and homage are often confusing, so too is the line between infringing and non-infringing use of copyrighted material. Since it is natural and even expected of Web designers to incorporate elements from other sites and other creations, it is important to understand the risks and hazards when it comes to copyright in Web design. As such, here are five of the most common copyright pitfalls Web designers face and how to best avoid them. 1. Images The most common issue many web designers face when it comes to copyright law has to do with the images they use in their layouts. For some designers, it is common practice to find images they need by doing a Google search or pulling an unlicensed image from a stock photo library.

The problem with this is that, as Google itself warns, these images are usually protected by copyrights, and their use as part of a layout almost certainly constitutes an infringement. Historically, artists have not had many resources for finding such infringements, but as detection tools improve in quality and drop in price, more infringements are being detected.

It is important that you always make sure you have the rights to use an image in your layout, even if it is just a placeholder. If you need to locate free images that you can use legally, search for Creative Commons-licensed work on Flickr or visit StockXchng (sxc.hu) to find high-resolution images you can use legally - as long as you are sure to follow the terms of the licenses carefully.

1. HTML/Source Code

Most Web designers are expected to crib some of their source code, either from other sites or their previous work. But where taking a portion of a page to get a table format or a few CSS elements from a stylesheet likely won’t raise any alarm, large scale copying, such as taking an entire style sheet or whole theme elements, likely constitutes copyright infringement.

The problem is that HTML code, much like computer software, is considered an original work of authorship, even if it is created with the help of tools, and enjoys copyright protection. Though you can’t copyright the general look of the site, meaning Google can’t copyright a white background with a center logo, you can protect the code that created that work.

The best way to avoid any issues over your source code is to create as much of it yourself as possible and limit any copying to only things that you could trivially reproduce but wanted to save time on. The more it becomes clear where your code came from, the more likely the copyright holder may become upset.

1. Platform Licensing

The days of static websites went out nearly a decade ago. Most sites today are built on top of a platform of some variety or another, be it WordPress, Joomla, Presta Shop or some other software. However, many of these tools have strict and/or unusual licensing requirements and it is easy for designers to run afoul of their terms when setting up a new site.

The most common mistake is installing a purchased application on too many sites; for example, by buying a one-domain license on ThemeForest for an application, but using it with multiple clients. However, even open source applications carry risks as many designers, in an attempt to keep the site clean, remove attribution lines in the code and files on the server that are required as part of the license.

When using any software to build a site, take a moment to read thorough the license and understand what it means. Follow those terms closely. Developers are constantly becoming more savvy about tracking down those who violate their licenses and even authors that license under the GPL are becoming more aggressive about enforcing their terms.

1. Open Source Blunders

A related mistake comes when web designers use and publish works based on open source code, particularly GPLed code (which includes many WordPress themes) and forget to either retain the license information and/or fail to donate their modified code back to the GPL.

If you create a derivative work of a GPL-licensed one, such as making a GPL WordPress theme a different color, the new theme has to be licensed under the GPL. If you are unsure of whether your new work meets the requirement for GPL “inheritance”, this 2001 article by Lawrence Rosen (http://www.sitepoint.com/article/public-license-explained/) explains it quite nicely.

1. Dummy Copy

Though the use of dummy text is largely a hold over from the print design world, many web designers continue to use it for various reasons. It can pose a great risk if the dummy copy is pulled from another site. Even if the copy is just for testing purposes, it still constitutes an infringement. It may be unwittingly harming the original authors if the search engines have detected the test site.

Generally speaking, it is best to either use content from the client’s current site if possible, or true lorem ipsum text if it isn’t (http://www.lipsum.com/). Considering that lorem ipsum text is actually more flexible than using articles and content from other sites, it makes sense in nearly every regard.

Be especially careful of scraping RSS feeds for the purpose of filling up a test application or blog, this is especially frowned upon by bloggers and may have your test site mistaken for a spam blog.

Bottom Line

In the end, it is important to keep copyright infringement in mind when designing websites and services. This is especially crucial if your test sites are public facing or may be indexed by the search engines - as you may find your test pages taken down by your host.

However, even if you test solely on a private server, it’s worth keeping these issues in mind so you do not pass along an infringing site to your clients, even by accident. Nothing will sour a relationship with a client faster than them receiving cease and desist letters or take-down notices for content in your layout.

Given the minimal amount of effort that it takes to remain on the right side of copyright law, it doesn’t make sense to even take the chance. It only takes a few minutes to do things correctly but it takes just one copyright infringement complaint to sandbag an entire design career.

Subscribe to the ThemeForest RSS Feed for more daily web development screencasts and articles.

Snipplr is a public source code repository that gives you a place to store and organize all the little pieces of code that you use each day. Best of all, it lets you share your code snippets with other coders and designers.

You can find almost every language from ASP, ASP.NET, PHP to Ruby, Django or AS3 code. You can save your time by finding a source code as per your project need. You can also save your likely code which will help you to get the code when you need that in future.

If you are looking for free resources to learn Ajax, PHP, CSS and JavaScript take a look at this collection with six interesting online presentations about these topics. The list includes a short introduction to Ajax, how to write modular CSS code, PHP Object Model fundamentals and an overview about the most popular JavaScript libraries.1. Ajax 101 | WorkshopAuthor: Bill Scott | This presentation on SlideShareIntroduction to programming with Ajax. Covers XMLHttpRequest, XML, JSON, JavaScript, HTML, CSS, Dom Scripting, Event Handling with some examples from YUI library.2. Modular CSSAuthor: Russ Weakley | This presentation on Slide ShareA clearly explained modular system that allows you to hide and show CSS rules to specific browsers without the need for extensive hacks or workarounds.3. Understanding the PHP Object ModelAuthor: Sebastian Bergmann | This presentation on SlideShareThis talk will give an overview of PHP's object model, covering both basic OOP concepts such as interfaces, classes, and objects as well as PHP's “magic” interceptor methods.5. jQuery in 15 minutesAuthor: Simon | This presentation on SlideShareA short introduction to jQuery in particular about functions, collections, grabbing values and chaining.6. JavaScript Library OverviewAuthor: Jeresig | This presentation on SlideShareAn interesting Overview about the most popular JavaScript libraries (jquery, prototype, Scriptaculous...) for web designers.

In this post I want to reply to all my readers which wrote to me in the past weeks asking to me to suggest some interesting resources for beginners to learn Object Oriented Design methodology.This is a small list with some basic references about Object Oriented Design process and it includes an UML guide, some articles about how to write OO javascript, PHP and Perl code. I also included some video tutorials about an useful introduction to OO PHP. If you have some interest link to suggest about this topic, please leave a comment, thanks!UML GuideThe Unified Modeling Language is a standard design specification that is overseen by the Object Management Group (OMG). UML provides a nice framework for designing and analyzing process, structure and their relationships. UML is a collection of the best technical modeling specifications and practices is use today. It is mainly used in developing software requiring Object Oriented Analysis (OOA) and Object Oriented Design (OOD).Design Patterns | Object Oriented DesignDesign Patterns OODesign provides general design principles about Object Oriented Design with some well explained tutorials and examples about this topic.Object Oriented Analysis and DesignOOAD.com provides a lot of interesting link about Object Oriented Analysis and Design resources, forums, links, basic methodology, book and programming roadmap.Object Oriented Design with JavascriptThis is a serie of three article which discuss object-oriented features of JavaScript. Part one provides background on how JavaScript supports the main principles of object-oriented programming. Part two demonstrates how JavaScript constructs can be used to build a class inheritance framework and write scripts supporting a JavaScript class hierarchy. The third and final part shows how to use the JavaScript class framework to build object-oriented client-side abstractions of ASP.NET user controls.- Writing Object-Oriented JavaScript 1/3- Writing Object-Oriented JavaScript 2/3- Writing Object-Oriented JavaScript 3/3Javascript is not a OOP (Object Oriented Programming) Language, but it supports objects, so why don’t use them? It may not be the best thing if you just want to create some small scripts, but as soon as you do a bit more than just reading some data from a form, it can definitely make sense to use objects, because it’s much easier to reuse this code later on. Take a look at this interesting post about this topic from nino.net.- 5 reasons to write object-oriented (oo) javascript- Create Advanced Web Applications With Object-Oriented Techniques- Understanding scope in object oriented JavaScriptObject Oriented Ajax Application DesignGreg Brown explains how to use basic object-oriented techniques to build more robust AJAX applications. The demands on JavaScript as a development platform are growing with the increasing popularity of so-called AJAX applications. The procedural development model commonly used to add basic client-side interactivity to web pages today will not scale to support the level of UI complexity required by these applications. Fortunately, and contrary to popular belief, it is possible to apply object-oriented (OO) design principles in JavaScript, which can help manage this complexity.SUN | The Java TutorialsIf you've never used an object-oriented programming language before, you'll need to learn a few basic concepts before you can begin writing any code. This lesson will introduce you to objects, classes, inheritance, interfaces, and packages. Each discussion focuses on how these concepts relate to the real world, while simultaneously providing an introduction to the syntax of the Java programming language.- What Is an Object?- What Is a Class?- What Is Inheritance?- What Is an Interface?- What Is a Package?- Questions and Exercises: Object-Oriented Programming ConceptsObject Oriented PHP for BeginnersStefan Mischook wrote this practical tutorial to teach total beginners object oriented PHP. So before you begin, get out your favorite PHP code editor and be ready to write and run some object oriented PHP code. You can also download a PDF version of this tutorial or watch the following videos:- Introduction to Object Oriented PHP (4:05)- Why learn Object Oriented PHP (14:46)- Objects and Classes in PHP (5:26)- Build Objects in PHP - Part 1 (9:14)- Build Objects in PHP - Part 2 (9:41)- Build Objects in PHP - Part 3 (6:18)- Calling Functions from Another Class (5:36)Perl Object Oriented ProgrammingMost people are not aware of the fact that Perl has support for object-oriented programming. If you've used another object-oriented programming language such as Java or C++ or been exposed to object-orientation, then object oriented programming in Perl is nothing like that. To do real useful object-oriented programming in Perl take a look at this article.

Nothing can be more useful than handy tools you can use “on the fly” in your design process. Whether you’d like diagramming application, create vector images, format or optimize CSS code, generate patterns- you can use dozens of tools to make your life easier. Today we wanted to share with you a comprehensive list of more than 40 online tools that will really make your life easier and on the fly.

This post is a collection of some interesting and useful Ajax Auto Suggest scripts ready to use (from beginner or professional web developers) in your web projects. This collection includes standard auto suggest scripts, del.icious tag suggestion, autosuggest control to search images on Flickr, and advanced table filter with auto suggest control.If you want to suggest other interesting links please add a comment, thanks!1. Ajax Auto Suggest v.2The AutoSuggest class adds a pulldown menu of suggested values to a text field. The user can either click directly on a suggestion to enter it into the field, or navigate the list using the up and down arrow keys, selecting a value using the enter key. The values for the suggestion list are to provided as XML, or as JSON (by a PHP script, or similar). This auto suggest class is very simple to customize and reuse in your web pages. Take a look here for the demo.2. Woork PHP component: AutosuggestWoork Autosuggest is a simple "PHP component" ready to use which implement autosuggest feature using PHP and MySQL. The component is lightweight (only with 8Kb) and ready to use simply customizing some parameters.3. Spry Auto Suggest WidgetSpry Auto Suggest Widget (provided from Adobe Labs) use Adobe Spry framework to implement auto suggest feature in a input field. This is an example of using a Spry region and non-destructive filter to create an auto suggest widget. The suggestions can be displayed in any HTML structure. Spry uses the the tag ID to identify the suggest list container. In this example, there are three different HTML structures based on: table, div-span, ul-li.4. Facebook-Like Auto SuggestGuillermo Rauch's Facebook-like Auto Suggest is another auto suggest script which simulate Facebook auto suggest feature. It works by caching all the results from a JSON Request and feeding them to the autocompleter object. When a item is added as a box, it’ removed from the feed array, and when the box is disposed it’s added back, so that it becomes available in the list when the user types.5. jSuggest 1.0jSuggest is yet another auto-completer for your text input box. It mimics the functionality of Google suggest. jSuggest will also bind item selection to your up and down arrows and also allow you to select the suggestions using your mouse.6. Yahoo! UI Autosuggest ControlYahoo! UI Autosuggest Control uses AutoComplete to find images by tag from the Flickr webservice. A simple PHP proxy is used to access the remote server via XHR. The generateRequest() method has been customized in order send additional required parameters to the Flickr application. The formatResult() method has been customized in order to display images in the results container, and the default CSS has been enhanced so the results container can scroll. Finally, a itemSelectEvent handler has been defined to collect selected images in a separate container.7. CAPXOUS.AutoCompleteCAPXOUS.AutoComplete is a standalone widget without dependencies, lightweight (only 4 kb) which provides auto suggest feature with an huge scrollable drop down list. It's simple to customize and implement on your web pages with a lot of languages.8. jQuery Tag SuggestionjQuery Tag Suggestion plugin simulates del.icio.us tag suggestion as-you-type feature (when you save a bookmark on del.icio.us). Tag suggestion helps you create a subset of tags that you commonly use for different types of links.9. Google Suggest Style Filter with the AutoComplete ControlMatt Berseth's AutoComplete control provides smarter filtering capabilities for data tables which allow the user to select a filter column from a drop down list. Take a look here for the live demo.Related Content- File uploaders collection for web developers- Best Image Croppers ready to use for web developers- Beautiful datepickers and calendars for web developers- Useful resources to improve the look and features of HTML Forms

February is all about romance and love and one special day: Valentine’s Day! The day when candy, flowers and cards are exchanged between loved ones. In that manner, DryIcons are presenting their brand new free icons set, called “Valentines”. Because this holiday is so special to all of us . ” Valentines” free icons set comes in 32-bit transparency PNG and 32×32px, 48×48px, 64×64, 128×128 and 256×256px size.

This post illustrates how to use some interesting HTML Form validators to check FORM fields writing only some lines of HTML and JavaScript code. All these proposal are lightweight, cross-browser and simple to use and customize in your web projects in few minutes.If you have some suggestion about this topic, please leave a comment. Thanks!1. MooTools FormCheckFormCheck is a class that allows you to perform different tests on form to validate them before submission. FormCheck is lightweight, shiny and fast, supports skins (using CSS), 10 different languages, and shows errors as tips. It support basic validation (required, alpha, digit, alpanu, lenght, confirm...), regex validation (phone, email, url) and a lot of options that allow you to customize this class to fit exactly as you want.FormCheck is really simple to implement. In the <head> tag of your page add the folloing lines of code:>Add a link to MooTools Framework:<script type="text/javascript\" src="mootools.js"></script>...choose FormCheck language (in this case english):<script type="text/javascript\" src="formcheck/lang/en.js"></script>...include the FormCheck script:<script type="text/javascript\" src="formcheck/formcheck.js"></script>... and initialize FormCheck using this code:<script type="text/javascript\">window.addEvent('domready', function(){new FormCheck('formular');});</script>You can use default CSS theme for your form using this code:<link media="screen" type="text/css" href="formcheck/theme/classic/formcheck.css" rel="stylesheet" />At this point, create a form in the tag <body> of your page:<form action="#" method="post" id="formular" class="formular"><form>... and add some fields into the form like these:<input type="text" name="user" class="validate['required','length[4,20]','alphanum'] text-input" />How you can see in the previous code, the syntax to use this validator is really simple. You have to add this code into attribute "class" of the input field:class="validate['required','length[6,16]','alphanum'] text-input" />...it means: validate this field; this field is required, min lenght is 6 chars and max lenght is 16 chars; this is an alphanumeric field. When an user submit the form, the result is the following:Simple No? Take a look at the demo.2. Live Validation LiveValidation is a small open source javascript library for making client-side validation quick, easy, and powerful. It comprises of two main parts. Firstly, it provides developers with a rich set of core validation methods, which can also be used outside the context of forms. Secondly, it provides your visitors with real-time validation information as they fill out forms, helping them to get it right first time, making the forms easier, quicker and less daunting to complete. In this example you can see how to match the value contained in two fields.In the <head> tag add a link to the livevalidation script:<script type="text/javascript\" src="livevalidation_standalone.compressed.js"></script>...create two fields:<input type="password" id="password" /><input type="password" id="confirmPassword" />...and than add this script below the second input field:<script type="text/javascript\"> var confirmPassword = new LiveValidation('confirmPassword'); confirmPassword.add(Validate.Confirmation, {match: 'password'}); </script> This is the result if the content in the first field matches the content in the second field:...and this is the result if the content doesen't match:Take a look at this page for a full documentation support about LiveValidation.3. ProtoFormProtoForm is an unltra lightweight, unobtrusive cross-browser and very easy to customize form validation + submit with Ajax based on prototype.js framework. It checks required fields and validate Email, Date, Telephone number and Url, send data and shows response with Ajax, highlight the form field on focus and on error.You can implement this script on your page with only some lines of code. In the <head> tag add a link to the Prototype and ProtoForm script:<script type="text/javascript\" src="prorotype.js"></script><script type="text/javascript\" src="prorotype.js"></script>Then, create a form within a div with ID="box":<div id="box"><form action="#" method="post" id="send" class="validate"></form></div>At this point add some input field into the form like the following:<input type="text" id="email_Req_Email" name="email" title="Required! Enter a valid email address!" />In the propery id I highlighted in bold validation options (_Req, _Email). The ID property of fields you have to validete will be something like: name + _option1 + _option2 +....The "title" attribute is used to display an error message. For a full documentation about this script take a look at the official page.That's all. If you have some suggestions add a comment, thanks!

Recently I saw one cool sketchbook for designing web site mockups. The problem was I couldn’t find out how to order one copy. The idea of that sketchbook was to simulate web browser on paper. So I decided to build one.

Here are 20 more handy jQuery plugins that have made websites much sleeker and more interesting.

TextureKing is a project created and maintained by REH3design. Throughout the site you will find a growing repository of high quality texture photos that are free for personal and professional use.

This post illustrates five interesting rich text editors ready to use in your web projects. I also provided some guidelines regarding how to implement them on your pages using a few lines of HTML code. Try them!1. Yahoo! UI Library: Rich Text EditorThe Yahoo! Rich Text Editor is a UI control that replaces a standard HTML textarea and is based on Yahoo! UI Library; it allows for the rich formatting of text content, including common structural treatments like lists, formatting treatments like bold and italic text, and drag-and-drop inclusion and sizing of images.Implement this editor in your web site is very simple. You have to add a simple textarea like this:<textarea id="editor" name="editor" rows="15" cols="70"></textarea>...and copy and paste the Javascript code you can find in the related pages on Yahoo Developer Network on your page. Yahoo! provides a lot of useful and well explained examples regarding how to implement this rich text editor. I suggest to take a look at the following links:- Simple Editor with basic buttons- Code Editor- Editor in a Dialog ControlThe Rich Text Editor's toolbar is extensible via a plugin architecture so that advanced implementations can achieve a high degree of customization. For example you can replace your Wordpress default editor with the Yahoo! Rich Text Editor using this plugin, integrate it into Drupal to edit content using this module or use it like editor for comments of your blog .2. Free Rich Text EditorFree Rich Text Editor is an extremely easy to use FREE javascript based HTML WYSIWYG editor for your website, it can easily be implemented into any existing content management system or other web application with no knowledge required in programming or javascript. Only 3 lines of code required to set up the editor. It also now outputs as XHTML compliant code!The only lines of code you have to add are the following:<form action="" method="post"><!-- Include the Free Rich Text Editor Runtime --><script src="/freerte/js/richtext.js" type="text/javascript\"></script><!-- Include the Free Rich Text Editor Variables Page --><script src="/freerte/js/config.js" type="text/javascript\"></script><!-- Initialise the editor --></form>Simple no? The result is very nice and looks like the Microsoft Word interface. I suggest you to try it if you are looking for an affordable and quick to implement solution for a rich text editor with a lot of useuful features. You can download it here.3. TinyMCE TinyMCE is a platform independent web based Javascript HTML WYSIWYG editor control released as Open Source under LGPL by Moxiecode Systems AB. It has the ability to convert HTML TEXTAREA fields or other HTML elements to editor instances. TinyMCE is very easy to integrate into other Content Management Systems.Is very simple to integrate in your website only with a few lines of code. Add this code into the tag <head> of your page:<script type="text/javascript\" src="tiny_mce/tiny_mce.js"></script>...and initialize the editor using the code you can find here, clicking on the tab View Source. Than add a simple text area in your page like this:<textarea id="content" style="width:100%"></textarea>That's all! It's ready to run on your page.4. FCKeditorFCKeditor is a very nice HTML text editor brings to the web much of the power of desktop editors like MS Word. It's lightweight and doesn't require any kind of installation on the client computer. The interface is clean andIt's very simple to implement using this code: <form action="" method="post"><script type="text/javascript\">var sBasePath = document.location.href.substring(0, document.location.href.lastIndexOf('_samples')) ;var oFCKeditor = new FCKeditor( 'FCKeditor1' );oFCKeditor.BasePath = sBasePath;oFCKeditor.Height = 250;oFCKeditor.Create();</script></form>5. XinhaXinha is a powerful WYSIWYG HTML editor component that works in Mozilla based browsers as well as in MS Internet Explorer.Its configurabilty and extensibility make it easy to build just the right editor for multiple purposes, from a restricted mini-editor for one database field to a full-fledged website editor. Its liberal, BSD licence makes it an ideal candidate for integration into any kind of project.Do you have any suggestion about this topic? Add your comment or suggest a link, thanks!

Typography plays a big role in this type of design. If you have been struggling to find the right font for your clean designs, here are 40 of them that are both clean and beautiful.

JavaScript is an extremely useful scripting language for enhancing user experience and usability. It is becoming more and more popular as more developers begin to make cool techniques accessible. Here are 100 excellent JavaScript (and a few AJAX) techniques, plugins, and resources based on the major libraries of jQuery, Prototype, Scriptaculous, MooTools, and Dojo. Techniques and Tutorials Coda Pop-Up Tutorial

Build An Incredible Login Form with jQuery

Create a Slick Tabbed Content Area using CSS & jQuery

Create a Simple, Intelligent Accordion Effect Using Prototype and Scriptaculus

Create a Simple, Powerful Product Highlighter with MooTools

Creating a Dynamic Poll with jQuery and PHP

Creating a “Filterable” Portfolio with jQuery

Leopard Desktop with jQuery using jqDock

Adding to Our Leopard Desktop with jQuery

Use the jQuery UI to Control the Size of Your Text

Animated Drop Down Menu with jQuery

Animated Menus Using jQuery

Fancy Box

Creating a Slick Auto-Playing Featured Content Slider

Easiest Tooltip and Image Preview Using jQuery

jQuery Pagination

Using CSS and Mootools to simulate Flash horizontal navigation effect

How to Mimic the iGoogle Interface

Submit A Form Without Page Refresh using jQuery

Coda Slider Effect

A Mac OS X-style Dock In JavaScript

Starbox

Magic Zoom

Magic Magnify

Apple Slider Gallery

Building an Animated Cartoon Robot with jQuery

Animate a hover with jQuery

Learning jQuery: Fading Menu - Replacing Content

Using jQuery for Background Image Animations

Opacity Change

jQuery image upload and crop

Password Strength Meter

jQuery Autotab

Sliding Top Panel

context highlighting web forms

jQuery hover sub tag cloud

jQuery pageSlide

Create a simple ul list with a nice slide-out effect for <li> elements

Portfolio Layout Idea Using jQuery

Easy Image or Content Slider

mooSlide

jQuery.SerialScroll

Agile Carousel

Animated JavaScript Slideshow

Hyphenation in Web

Textboxlist Auto-Completion

syntaxhighlighter

CSS Sprites2

jParralax

BarackSlideshow

Galleria

date.js

ajax im

Ajax AutoSuggest

Taggify

MooFlow

amCharts

PlotKit

JavaScript tabifier

fValidator

jQuery Interactive Date Range Picker

NoGray Time Picker

Yetii - Yet (E)Another JavaScript Tab Interface

Creating a carousel with MooTools

Carousel.us

How to Load In and Animate Content with jQuery

iPhone Unlock Screen

Create an apple style menu and improve it via jQuery

AJAX Upload

Create Accessible Charts Using Canvas and jQuery

Simple jQuery Form Validation

jQuery Context Menu

Kwicks for jQuery

jQuery File Tree

jQuery iPod-style Drilldown Menu

MooTools Home Page-Inspired Navigation Effect

jQuery books widget

Revealing Photo Slider

Facebox Image and Content Viewer

Simple Controls Gallery

Fix Overflow

Setting Equal Heights with jQuery

Scrollable

Jcrop

Music Player Using Mouse Gestures and Hotkeys

Moo Canvas

iCarousel

Rich Text Editor

Creating a table with dynamically highlighted columns

Simple selector list using CSS and Javascript

Change the layer background color using a simple Javascript functions

Simple images slider to create Flickr-like slideshows

Lightbox using mootools and pathfusion multibox

Fantastic News Ticker Newsvine-like using Mootools

Articles 10 Smart Javascript Techniques to Improve Your UI

jQuery Tutorials for Designers

What You Need to Know About jQuery 1.3

Websites Sikbox

Javaspript & AJAX on NETTUTS

Woork

JQuery.com

MooTools

Share Your Favorites! Please, share your favorite techiques or leave a nice comment.