Five awesome tools for web designers (Free open source)

If you are looking a free open source web design tools then your search ends here now. In this post I am going to share some very useful web design tools for day to day designing.

This collection includes image editing tools, 3D animation tools, Icon creating tools etc.

Blender

Blender is a free open source 3D modeling and animation program, available for all major operating systems under the GNU General Public License. It is comparible to Maya, but without any cost. Maya is approx. $2,500 while many prefer Blender which costs $0. You can create studio quality 3D animation with Blender.





Paint.NET

Paint.NET was originally created as a free replacement for Windows Paint, but with a full set of features that you see in costly programs such as Photoshop. Features include special effects, unlimited undo and layer support. The only way it compares to MS Paint is in simplicity, but certainly not in lack of features.



Phoenix

Phoenix is a Web-based image editor. From basic image retouching to complex effects, Phoenix delivers the key features of a desktop image editor with the simplicity and accessibility of a web-based application.









GIMPshop

GIMPshop is a modified version of GIMP that's made to look and feel like Photoshop. GIMPshop has all the same features, but addresses confusion issues for people making the switch from the costly Photoshop program to the free GIMP program. Another advantage to mimicking Photoshop is that tutorials written for Photoshop are applicable to GIMPshop.



IconArt

IconArt is an editor and creator for icons and cursors, including animated cursors. You can create icons or cursors from existing images or draw them from scratch in a highly magnified canvas from 16x16 pixels up to 64x64 pixels.



Do you have any opinion, leave a comment.

Simple CSS tips to styling a Table

Styling a Tables in CSS is complicated by the fact that there are two different models available:

Collapsing borders

Seperate borders

The Collapsing borders allows one border to appear while the Seperate border allows multiple borders. The Seperate border is the default. Suppose we have the table:

<table title="Membership of W3C" summary="Test Table">
<caption>W3C Membership</caption>
<thead>
<tr>
<th>Type</th><th>America</th><th>Europe</th><th>Pacific</th><th>Total</th>
</tr>
</thead>
<tbody>
<tr>
<th>Full</th><td>62</td><td>29</td><td>17</td><td>108</td>
</tr>
<tr>
<th>Affiliate</th><td>240</td><td>123</td><td>47</td><td>410</td>
</tr>
<tr>
<th>Total</th><td>302</td><td>152</td><td>64</td><th>518</th>
</tr>
</tbody>
</table>

If the style sheet is:

table {border-collapse:seperate; font-family:Verdana, Arial, Helvetica, sans-serif; font-size:11px;}
td{border:solid blue 1pt;}
th{border:solid red 1pt;}

The result would be:



By changing the styling to:

table {border-collapse:seperate; font-family:Verdana, Arial, Helvetica, sans-serif; font-size:11px; border:1px dashed green;}
td{border:solid blue 1pt;}
th{border:solid red 1pt;}

The result becomes:



Now lets apply some other CSS styles:

table {border-collapse:collapse; background-color:#FFFFFF; font-family:Verdana, Arial, Helvetica, sans-serif; font-size:11px; border:1px dashed green;}
td{border:solid blue 1pt;}
th{border:solid red 1pt;}
colgroup.a{background-color:#FFFF00;}
tr.three{background-color:#FFFFFF;}
col.col1{background-color:navajowhite;}
col.col2{background-color:navajowhite;}
col.col3{background-color:navajowhite;}
col.col4{background-color:navajowhite;}
col.col5{background-color:navajowhite;}
tbody.second{background-color:powderblue;}
colgroup.b{background-color:lime;}
tr.two{background-color:pink;}
th.grand{background-color:#FFFF00;}

Here's the table that we have to apply above CSS style:

<table>
<colgroup class="a"><col class="col1" /><col class="col2" /><col class="col3" /><col class="col4" /><col class="col5" /></colgroup>
<thead>
<tr>
<th class="grand">Type</th><th class="grand">America</th><th class="grand">Europe</th><th class="grand">Pacific</th><th class="grand">Total</th>
</tr>
</thead>
<tbody class="second">
<tr class="two">
<th>Full</th><td>62</td><td>29</td><td>17</td><td>108</td>
</tr>
</tbody>
<tbody class="second">
<tr>
<th>Affiliate</th><td>240</td><td>123</td><td>47</td><td>410</td>
</tr>
</tbody>
<tr>
<th>Total</th><td>302</td><td>152</td><td>64</td><th>518</th>
</tr>
</table>

The result would be:



Applying a CSS styles to a table not easy but having a good knowledge of CSS makes it easy.

Do you have any opinion, leave a comment.

15 Exclusive iPhone Forums for iPhone Lovers

If you are a iPhone user you would always love to join a iPhone forums to share or download iPhone apps, wallpapers, themes, accessories, tips and tricks etc.

Here I am sharing fifteen exclusive iPhone forums for iPhone lovers. So review following forums and choose your favorite one to join. Start sharing and downloading your favorites activities.

Apple.com
Apple's official iPhone forum has millions of users across the globe. Here you can find solution of your all issues related to iPhone.



Everythingicafe
You'll enjoy complete features of this forum. This iPhone forums now support Facebook Connect, allowing you to login with your Facebook account. No waiting. The forum has some interesting categories for iPhone users, like Apple iPhone, Apple iPhone Software, Apple iPhone Accessories, Apple iPod Touch, Wireless Carriers etc.



Planet-iPhone
This is your ultimate online iPhone community. Here you can share and download free iPhone Icons, Wallpapers, Themes, Apps, 3GP Videos and much more.



Talk iPhone
Apple iPhone news and discussion forums. Talk iPhone covers the latest iPhone software, firmware, unlocking and sending news for the Apple iPhone. The RSS feed keep you up-to-date with daily iPhone news. The forum has feature to connect with Facebook Connect. You'll definately enjoy forum's latest iPhone discussion.



TheiPhoneBlog
The iPhone Blog (TiPb) is for those who dare to phone different. Featuring in-depth news, help and how-to, the latest App Store and accessory reviews, the iPhone Live! podcast, and the best darn iPhone forums in the ‘verse, you can engage with us right here on the site, through RSS, on Facebook, and via @theiphoneblog on Twitter.



ModMyi.com
This is your premier Apple & iPhone community. Affectionately coined MMi, the community has over 400,000 users who love modifying your iPhones. The forum has some good features like News, Mods, Hacks, Themes, Skins, Downloads and much more.



iPhone Dev SDK
This is good forum especially for iPhone apps developers. The forum has good nos. of users.



iPhone Dev Forums
This is good forum especially for iPhone apps developers. The forum has good nos. of users.



iPhone World
iPhone World is your prime source of information on Apple’s iPhone, be it in Canada or anywhere else in the world. The forum has daily news section, in-house written iPhone articles and interviews, iPhone videos, photos, skins, downloads, and much much more.



MacRumors:Forums



Apple iPhone Forum



iPhone Alley



TouchTip



HackintOsh.org



MyPhone Apps Forum



Do you have any opinion, leave a comment or share any good forum you know.

10 Essential Ajax Scripts for Web Developers

Ajax Script is one of the most widely used languages across the globe for web development. It is simple, yet very powerful, and the number of ways that it can be used are almost limitless.

In this post I'm going to share ten essential Ajax scripts to help web developers with direct download link. The following list includes Progress Bar, Ajax grid, Ajax Menus, Ajax Event Calander, Ajax Tag Clouds, Ajax Image Transition etc.

1. Simple Javascript Progress Bar with CSS

WebAppers have created a simple Javascript based Percentage Bar / Progress Bar which is inspired by Bare Naked App. Bare Naked App taught us how to display Percentage Bar with 2 images only by using CSS.

| Click Here for Demo

2. Sigma grid-Ajax grid for php java & .net

Written in pure javascript, Sigma Grid is an Ajax data grid for displaying and inline editing data in a scrollable and sortable table. IE 6.0+ \ FireFox 2.0+ \ Safari 3.0+ \ Opera9.0+ supported. Pure javascript codes, Seamless Integration with any server side solution, such as j2ee, .net, PHP, perl. Inline editing, keyboard data navigation, nested multiline headers, sortable and frozen columns. Slice rendering and built-in paginal output allow you to manipulate huge datasets on the fly.

| Click Here for Demo

3. Instant.js

If you're looking to add some interesting backgrounds, rotations and other effects to images, Instant.js might be just what you're looking for. The JavaScript degrades gracefully, so browsers who don't have JavaScript enabled won't notice a difference.

| Click Here for Demo

4. Phatfusion image menu

Phatfusion image menu is horizontal menu, reveals more of the image as you rollover it.

Main features:

2 optional onClick events - open & close

href passed to onClick events

stays open when clicked

closes when clicked

select item to pre-open

| Click Here for Demo

5. dhtmlxScheduler :: Ajax Event Calendar

dhtmlxScheduler is a web-based event calendar which provides simple in-browser scheduling solution. With smooth Ajax-enabled interface dhtmlxScheduler allows users to add, modify or delete events without refreshing the web page. dhtmlxScheduler is very lightweight (about 19KB gzipped), cross-browser and highly customizable.

| Click Here for Demo

6. DrasticCloud

DrasticCloud is a configurable tag cloud. The example on the left presents the mountains in the grid ordered and scaled by height. Mountain names in green have been climbed. Change the settings in the cloud menu to change the cloud.

| Click Here for Demo

7. AJAX Rating Stars

Based on the prototype.js javascript framework, these rating stars are really easy to implement on your website. They feature form field binding, javascript callback function support, and XMLHttpRequest value sending (AJAX).

| Click Here for Demo

8. Ajax Image Transition Manager

The image transition manager is a javascript library based on scriptaculous and prototype. It supports several image transitions, such as fading, appearing, sliding, growing and shrinking. Because it uses the unobtrusive javascript technique, no inline javascript is needed and hyperlinks still function when javascript is disabled.

| Click Here for Demo

9. Sigma Visual Ajax builder

Sigma visual builder is web based tool for AJAX RIA application GUI rapid design and involved scripts programming.WYSIWYG GUI builder. Do everything by drag & drop. More than 40 common components, including Tabs, Dialog, TreeGrid, TimeLine and many other web GUI components. Rich client-side API, works with any backend or static HTML pages. Wide cross-browser compatibility.

| Click Here for Demo

10. Smooth Counter

It's been a while, but a new piece of Javascript is here to add some dynamics to your web-page. SmoothCounter is a script that enables you to count between 2 numbers (with a given precision) in a given period of time.

| Click Here for Demo

Do you have any opinion, leave a comment.

10 Utile tools and resources for design community

In this post I am going to share some useful tools and resources for web design and development communities. This includes Typography, Color tools, Background image maker, Free style menus and CSS Menu generator etc.

I hope these tools and resources would be very helpful to all my readers.

1. TYPETESTER

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.

Typetester’s code structure is XHTML, styled with the finest CSS and driven by the JavaScript for manipulating DOM structures. Typetester will not work without JavaScript enabled.

2. Type Select

Beautifully rendered & selectable typefaces controlled by CSS. You shouldn’t have to compromise the design or the user's experience to have selectable text. By leveraging typeface.js, jQuery, the canvas, toDataURL, CSS background properties and real overlayed text, Type Select is able to combine custom fonts with your browser's native text selection funcationality. You can now interact with beautifully rendered typefaces just like you do with normal text.

3. Colorotate

ColoRotate is an interesting new site that picks a novel approach to the traditional color picker design. Instead of 2D circles or sliders, ColoRotate features a 3D cone. At the core of the cone is the spectrum of colors. Intersecting that is the tint which lies on the z-axis. You can manipulate each one separately to help you arrive at your color. You can also blend two colors together.

4. Logospire

Logospire is a logo inspiration gallery. You can browse logos, upload your own logos, rate logos and leave comments and feedback. Logospire is different in that there is no moderation queue. You can upload your logo and it will go live straight away. By default, the front page sorts logos by highest rating, so even if there are low quality submissions, these won’t make it to the front pages.


5. Web Genome Project

The Web Genome Project add-on delivers personalized search results with total privacy; unlike other search-enhancing technology, it does not track click streams or retain browsing history. The Web Genome Project is built on the mathematics of human intention.

The Web Genome Project works by creating a numerical profile, or ‘genome’, for people and pages on the internet. Personal profiles are generated by survey results and refined by surfing behaviour.

6. XHTML Character Entity Reference

This page contains the 252 allowed entities in HTML 4 and XHTML 1.0, as outlined in section 24 of the official HTML 4 specifications, published by the W3C. If you're new to this site, you can find help on how to use this reference.




7. Background Image Maker

An easy to use online tool to make horizontal and verticle background strips. In this tool you can adjust Background color, Line color, Margin, Size, and Alpha etc. I am sure that web developers who are not that much expert in design definately will enjoy this tool.



8. CSS Menu Generator

CSS Menu Generator will generate both the CSS and the HTML code required to produce a text-based yet appealing set of navigation buttons. As text links are fast becoming preferred over images where search engine optimization is needed, a CSS menu can give the affectiveness of text links with a better look than standard text links. For an example of a CSS menu, look at our navigation on the left.

9. FreeStyle Menus

This is an XHTML compliant, CSS-formatted menu script, designed to work with the current generation of standards-based websites. The menu data is stored in the HTML document itself (unlike other JavaScript menus) as either nested lists or disparate DIV tags, and the script manages the showing and hiding of these elements with customisable timer delays.

10. Cross-Browser.com

A collection of loosely-bound, cross-browser, Javascript functions and objects. It is intended to be a resource from which you pick and choose - you do not have to include the entire library in your application. It contains core DOM/Style functions, unobtrusive enhancements, utility functions, objects such as menus and tab panels, and also has some experimental stuff.

Do you have any opinion, leave a comment.

15 Good CSS Forums for Web Designers and Developers

If you are intermediate in CSS and looking to enhance your CSS knowledge then this post going to help you. By joining any of the following CSS forums will help you to boost your CSS knowledge.

In this post I'm have shared some good CSS Forums that every Web Designers and Developers must join.

Here's the following CSS forums:

1. CSS Drive



2. Dynamic Drive



3. CSS Tricks



4. WELOVECSS - CSS Forum for everyone



5. CSS Forums



6. Sitepoint CSS Forum



7. Webmaster World



8. CSS Creator



9. forums.devshed.com



10. BYTES



11. Webmaster-Talk



12. WebdesignerForum.co.uk



13. CSS Chat



14. TalkDev



15. TUTORIALFX



Do you have any opinion, leave a comment.