WebStockBox

The Tools of Modern Mac-Based Web Development

Tom — Thu, 09 Aug 2012 18:23:18 +0000

If you’re a web developer and using A Mac, you should watch this video. This video will show you tools that help you design and develop web application more efficiently.

Try Ruby – Learn Ruby Online With Interactive Tool

Tom — Wed, 08 Aug 2012 23:02:57 +0000

Ruby is a nice programming language, more and more programmers adopt it. Try ruby is an interactive tool that you should try if you want to learn Ruby.

Link: Try Ruby

DBeaver – Free Open Source Database Management Tool

Tom — Fri, 03 Aug 2012 08:31:01 +0000

If you’re working with database and looking for a free tool for managing database, Dbeaver is a good one. Dbeaver is an open source project and this tool currently cupport MySQL, Oracle, PostgreSQL ,IBM, DB2, Microsoft SQL Server, Sybase, ODBC, Java DB (Derby), Firebird (Interbase), HSQLDB, SQLite, Mimer, H2, IBM Informix, SAP MAX DB, Cache, Ingres, Linter, Teradata, Any JDBC compliant data source.

You can download DBeaver at no cost and this tool is available for all major OS, Windows, Mac OS, Linux and ect.

Link: More info and download DBeaver

Generate CSS Box With Arrow With CSS Arrow Please!

Tom — Mon, 30 Jul 2012 09:13:57 +0000

Useful tool for web designer. CSS Arrow Please! is a nice and simple tool for generate a CSS box code with arrow and no image used. You can put the arrow on the top, down, left or right of the box and adjust color and size easily.

Link: CSS Arrow Please!

Convert Photoshop Shape To CSS3 With CSS3PS

Tom — Fri, 27 Jul 2012 03:52:31 +0000

Nice tool for web designers to save time coding CSS. CSS3PS is a free Photoshop plugin that helps us convert shapes that we designed with Photoshop to CSS3 code.

You can create shapes with stroke, border radius, drop shadow, inner glow, outer glow, inner shadow and add gradient overlay to your shape, then the plugin will generate the CSS3 code for you.

This plugin work with Windows or Mac OS X and Photoshop CS3 and later. You can download CSS3PS at no cost.

How it works video

Link: CSS3PS

SEO Serp Workbench – Check the Position On Google

Tom — Fri, 29 Jun 2012 09:01:42 +0000

SEO Serp Workbench is a useful plugin for Google Chrome. It is a handy tool to quickly check the position of multiple sites (yours and your competitors) given a keyword. Many countries are supported.

Link: SEO Serp Workbench

Create Responsive Web Layout With Dreamweaver CS6

Tom — Sun, 03 Jun 2012 09:28:21 +0000

A new hi-light feature in Dreamweaver CS6 is fluid grid layout. Design web with responsive layout is more and more popular, Dreamwever CS6 provides a tool that will help web deveoper create a fluid grid layout more easy.

You can watch the introduction to fluid grid layout tool in Dreamwever CS6 in the video.

Test Your Responsive Site On iPhone, iPad and Android Online

Tom — Thu, 26 Apr 2012 17:57:21 +0000

The Responsinator helps website makers quickly get an indication of how their responsive site will look on the most popular devices. It does not precisely replicate how it will look, for accurate testing always test on the real devices.

Link: Test Your Responsive Site

CSS Position Video Tutorial

Tom — Tue, 17 Apr 2012 08:57:10 +0000

The video tutorial about CSS position by Chris Coyier from Css-Tricks. This tutorial will show you the overview of CSS position values, if you’re new to CSS or want to learn more about this topic I think this video is right for you.

This is a quick beginner-level overview of the different CSS position values. In a nutshell: relative allows you to “nudge” and leaves the element’s original position in the page flow. Absolute and fixed allow for exact placement of elements and remove them from the page flow. Fixed positioned elements are unaffected by scrolling. All of them set a new positioning context and allow z-index to work.

CSS3 Box Shadows Effects

Tom — Mon, 16 Apr 2012 15:29:53 +0000

Many web designers add shadow to content box to make it more stand out and also look good. If you’d like to have it on your site, I found a tutorial on how to create nice box shadows using CSS3.

The tutorial about CSS3 that I found will show you the sample CSS3 code for creating CSS3 content box shadows in 8 different styles use only CSS without image. Hit the link below for the tutorial or view the demo.

Link: Creating Different CSS3 Box Shadows Effects
View Demo