2013年5月29日 星期三

40 Bootstrap Tools and Generators for Web Developers

Bootstraptor

bootstraptor For those who would like to have more templates than what’s just being offered with the bootstrap template sets, Bootstraptor brings you so much more to work with.

Brag Themes

bragthemes
Bring new life to business and personal websites with themes that maximize the ease and beauty of the Twitter Bootstrap framework through Brag Themes that makes everything different with unique features that’s apart from other bootstrap themes.

Bootply

bootply Bootply is a programming playground for programmers and curious fellows alike, who would love to work with bootstrap, CSS, JavaScript, and jQuery while testing different things, such as compatibilities with mobile devices or PCs.

Bootstrap CDN

bootstrapcdn Bootstrap CDN is for programmers who want to have their bootstrap pages and websites to load a lot faster.

25 Examples of Fashion Logo Design

Shoe Splash

21-Fashion-Logo-Design Shoesplash would be great for any type of footwear related business but mostly for manufacturers selling shoes to women.

Boom!Box

22-Fashion-Logo-Design

Abakka

23-Fashion-Logo-Design Abakka is a modern typographic logo design that can be used by variety of companies.
Source Link

Diamondtie

24-Fashion-Logo-Design Unique logo design with an easy to remember mark depicting a tie as a diamond.
Source Link

45 Free PSDs Files Template To Download

Colorful Cell Phones Vector PSD

Colorful Cell Phones

Free PSDs files Dark Toolbar

Dark Toolbar

Database Backup PSD Icons

Database Backup Icons

Free PSDs files of Calendars

Free Calendars

2013年5月24日 星期五

2012’s most popular CSS Reset scripts, all in one place

2012’s most popular CSS Reset scripts, all in one place

10 Best CSS Tools to Save Your Time

10 Best CSS Tools to Save Your Time

CSS Menu Maker

This CSS Menu Maker tool provides every freelancer to create custom cross browser compatible CSS menus. You do not need any background of programming because it provides source code for all CSS menus.
cssmenumaker

CSS Compressor

It is another amazing CSS Tool to compress CSS code and helps for to speed your website loading time. It can save your server bandwidth as well compressed CSS in a good balance.
CSS Compressor

3D Transforms

Another CSS 3D Transforms online tool provides various level Transforms. This tool is on experimental mode and require specify prefixes in all browsers.

50 Useful CSS Snippets Every Designer Should Have

50 Useful CSS Snippets Every Designer Should Have
好用耶

2013年5月23日 星期四

30 Free Vintage Photoshop Brushes

Halloween IV: Vintage

Vintage Halloween Brushes

Vintage Paper Brushes

Vintage Paper Brushes

Vintage Flora Brushes Vol. 1

Vintage Flora Brushes Vol. 1

10 Essential HTML5 Frameworks

HTML5 Boilerplate

html5 and boilerplate If you are new to HTML5-based web design, this is arguably the most essential resource you can start with. If you’ve been around HTML5 for awhile, then you know how awesome it is. Self-described as not-a-framework, the HTML5 Boilerplate has been used as one for over two years now, powering a large number of HTML5 websites, themes and second-gen frameworks, some of which grace this list. After more than three years in iterative development, you get the best of the best practices baked in: cross-browser normalization, performance optimizations,print stylesheets, caching, security and the most semantic, valid HTML5 markup and gloriously commented CSS3 possible.

52 Framework

52framework In addition to being built with valid HTML5 markup, the 52 Framework comes packed with CSS3 styles for drop shadow, rounded corners and the new “selection” selector for customizing selected text. All currently supported HTML5 elements are here, including form elements and HTML5 multi-media. Special scripts and styles are provided for graceful degredation all the way back to IE6! To help with layout, the framework even includes a 16 column grid template.
View the Demo or Download

40 CSS3 Button Tutorials For Designers

n this article, we will go through some hand-picked, awesome tutorials for wonderful buttons you can put on your site using only CSS3.
Some of these buttons play with colors, gradients or shapes while others are programmed to animate with hover or click actions, giving effects like it’s being pushed down; extending, shrinking or switching frames to reveal more information. Anything you can think of to do with buttons, there’s probably an example of it here.
So without further ado, here are 40 Awesome CSS3 button tutorials for web designers. Drop a comment at the end of the article stating your favorite.
Animated Buttons with CSS3 [Demo | Tutorial]
Fancy 3D Button with CSS3 [Demo | Tutorial]
Just Some Awesome CSS3 Buttons [Demo | Tutorial]

Animated Buttons with CSS3



很漂亮的CSS做的動畫按鈕。
Animated Buttons with CSS3

2013年5月20日 星期一

33 Best Free HTML5 Tutorials

33 Best Free HTML5 Tutorials

Thecodeplayer

Thecodeplayer.com is a great way to learn HTML5, CSS3, JavaScript and a lot more. You will find walkthroughs of code writing and view demos as well.
1 - Thecodeplayer

Create an Video Player

In this tutorial, you will able to create video player using html5, css3 and jquery. This video player supports all browsers using flash and Silverlight.
Create an Video Player

An Introduction to the HTML5 Gamepad API

This allows you to connect and use your old console’s gamepad in your computer and utilize it for various browser based games.
2. An Introduction to the HTML5 Gamepad API

Creating a Mobile-First Responsive Web Design

Since responsive designing is the new ‘IN’ things, this tutorial will help you in designing a responsive website.
3. Creating a Mobile-First Responsive Web Design

Create an Upload Form using jQuery, CSS3, HTML5 and PHP

Plupload allows you to upload files using HTML5 Gears, Silverlight, Flash, BrowserPlus or normal forms, providing some unique features such as upload progress, image resizing and chunked uploads.
Create an Upload Form using jQuery, CSS3, HTML5 and PHP

Using semantic HTML

This article will develop your interest in semantic HTML and you will for sure look for more information on it.

HTML5 Demos and Examples

You will find some of the best HTML examples and demos on this website and that too according to the browsers.
5. HTML5 Demos and Examples

WebGL 2D Translation

First chapters can actually help you a lot in getting started with HTML5. Obvious stuff but helpful.
6. WebGL 2D Translation

HTML5 Web Applications

For browser compatibility related to HTML5, you should visit this website. It has everything to offer you.
7. HTML5 Web Applications

Getting Started with the HTML5 Track Element

If you want to add subtitles, captions, descriptions and chapters in Audios and Videos, this track element is the best for you.
8. Getting Started with the HTML5 Track Element

Move the Web Forward

For beginners, this is a good reference. You will find some best HTML5 examples here.
9. Move the Web Forward

Capturing Audio & Video in HTML5

No more unreliable browser plugins. Learn how to capture audio/video with HTML5.
10. Capturing Audio & Video in HTML5

Understanding HTML5 and CSS3 for Web Design

Discover a lot of new tools with HTML5 and CSS3 for web development and designing.

Cool HTML5 Games

Well, if you fed up of your regular work, you should try creating games with the usage of HTML5 and JavaScript. Follow the tutorial.
12. Cool HTML5 Games

Case Study: Building Technitone.com 

You can learn about almost everything related to production here. From Plan to server, from sounds to visuals and off course the regular workflow.

An in Depth Analysis of HTML5 Multimedia and Accessibility

Want to present your media content in a different way; this tutorial will help you in doing so.
14. An in Depth Analysis of HTML5 Multimedia and Accessibility

Designing a blog with HTML5

Want to set up a blog on your own and feel lost? Well, this place will help you in setting up a blog.

HTML5 Tutorial: How to Build a Single Product Page

This is a fictional work however; you will learn how to build a single product page.
16. HTML5 Tutorial How to Build a Single Product Page

HTML5 File Uploads with jQuery

If you want to learn the development of a small web application, this is the place to be.
HTML5 File Uploads with jQuery

Making a beautiful HTML5 Portfolio

This tutorial will help you in designing an awesome HTML5 portfolio. It is definitely, a great way to showcase your portfolio.
18. Making a beautiful HTML5 Portfolio

How to build Cross-Browser HTML5 forms

This tutorial will help you in building cross-browser HTML5 forms. You will be able to accommodate modern and old browsers.
20. How to build Cross-Browser HTML5 forms

Implementing HTML5 drag and drop

If you plan to build a shopping cart interface, this tutorial is the right place for you. You will be able to design drag and drop feature with ease.
21. Implementing HTML5 drag and drop

Retro Shop – single page layout for your e-shop

Build a retro template using HTML5/CSS and JavaScript by following this tutorial.
22. Retro Shop single page layout for your e shop

Convert your WordPress theme to HTML5

Learn the conversion of WordPress theme from XHTML to HTML 5, bit by bit with the help of this tutorial.
23. Convert your WordPress theme to HTML5

HTML5 and CSS3 without Guilt

Obviously, not every browser support HTML5 so this tutorial will help you in using these tools even on old browsers.

Create an interactive bubble chart with HTML5 canvas

With this tutorial, you can create a bubble chart with HTML5 canvas. It will work on desktop mobile and will help in populating the data in real.
25. Create an interactive bubble chart with HTML5 canvas

Have a field day with HTML5 forms

Want to make an attractive HTML5 form? This tutorial is for you.
26. Have a field day with HTML5 forms

HTML5 Canvas Element Guide

It will help you in understand the canvas element.
27. HTML5 Canvas Element Guide

Build a lightbox for a responsive HTML5 touch interface:

This tutorial will explain how you can create a lightbox.
28. Build a lightbox for a responsive HTML5 touch interface

Creating an AD in HTML5

We all know that HTML5 is competing with latest technologies like Flash. Flash is used to ads and since HTML5 is evolving, this tutorial will guide you on how to create ads with hTML5.
29. Creating an AD in HTML5

HTML5 Geolocation Tutorial

This tutorial will help you in learning geolocation capabilities and basic principles of HTML5. Once you are familiar with them, you can use them in developing your next app.
30. HTML5 Geolocation Tutorial

2013年5月18日 星期六

10 Excellent CSS Accelerating Development Time

CSS lets you to do various things, but developers miss out on some features like variable, constants, and general faster syntax? Ordinary CSS does not have the ability to do all that, so many preprocessors have been created to let you use variables on CSS files and then parse it to regular stylesheets.
We have collected 10 Excellent CSS Accelerating Development Time.  We have already amazing articles on CSS that might help you as well free online web generators, Free CSS Libraries and Resources and CSS Frameworks.

Compass

sencha Compass is an open-source CSS Authoring Framework. Sass is an extension of CSS3 which adds nested rules, variables, mixins, selector inheritance, and more. Sass generates well formatted CSS and makes your stylesheets easier to organize and maintain.

CSS Cacheer


It is an awesome preprocessor that lets developers make plugins. It requires PHP and Apache with mod_deflate and mod_rewrite to work.

CSScaffold

scaffold CSScaffold is a CSS framework written in PHP. Unlike pure CSS framework (e.g., Blueprint, etc) that uses the standard abilities of CSS, it uses PHP to extend CSS. The syntax looks and feels exactly like CSS, except that you have additional features.

Sass

Sass claims that it has made CSS fun again. This project can do some very interesting things. Like Less CSS, it also lets you use variables and have a simplified syntax. It is an amazing tool, but as far as I know it is only available for Ruby.

Less CSS


Less is one of the most popular CSS preprocessor. It lets you have a simplified syntax and utilizing the variables. It is for the Ruby programming language, but it seems like Aaron Russel built an extension for making cached stylesheets that your PHP projects can utilize.

Turbine

This one is for all the PHP Lovers out there, as it has been created for your favorite language. Turbine is really good and it allows a minimal syntax, automatically gzip multiple css and fix cross-browser issues etc. A must try if you love PHP.

Switch CSS

This one is a full featured, production ready tool that works under Apache with mod_python, or as an environment-agnostic command line tool. Another good one.

CSS Preprocessor

CSS Preprocessor is written in PHP 5. This tool lets you do many things and you can also use expressions like margin-left: (200px * 3/2 – 10px); in your stylesheets.

DT CSS

This preprocessor accelerates CSS coding by extending the features to CSS like nested selectors and color mixing etc. DtCSS reads the CSS file with particular syntax written for DtCSS, and outputs the standard CSS. It also boasts clever caching system.

CSS PP

This one is still in alpha status, but the creator says the code will be launched very soon. One great thing about this projects is that it will be available in PHP, Python and Ruby. So this will prove to be an awesome tool for the developpers who work with all of these languages.

google ad