You are browsing the archive for Code.

Some useful tools and time-savers for web designers and developers

12:03 pm in Blogging, Vapvarun, Web Designing, Websites by vapvarun

An effective, well-organized workflow is an important asset of professional web designers. The more useful and time-saving your tools are, the more time you can focus on important things, thus creating a foundation for timely good-quality results. The problem is that there are just way too many tools, services and resources out there, so it has become difficult to keep track on them and find those tiny little time-savers that will spare you headaches and save time in a long run.

And this is where we come in. Back in old days, Smashing Magazine used to publish lists after lists, with plethora of links that covered different topics all somehow related to web design and development. We have undergone quite a development since then, and are now publishing almost only in-depth articles — written by some of the best professionals in the industry. However, useful, carefully prepared and filtered lists are still useful, and therefore we keep publishing them as well.

Below you’ll find 50 useful tools and time-savers for web designers and developers. Among other things, you will find recently released tools, useful reference sheets, articles and further resources. Such posts are prepared over months, each containing resources found, reviewed or bookmarked by the Smashing Editorial Team. We hope that at least some of them will help you improve your workflow!

Typography

Meet Your Type: A Field Guide to Typography (free PDF)
This eBook will help you better understand the foundation of typography and overcome common obstacles and problems when choosing type.

Useful-tool-122 in 50 Useful Tools and Resources For Web Designers

Web Font Specimen
This template lets you check the typography by analyzing the HTML-specimen in your browser. The specimen contains whole paragraphs in various line heights and font sizes, different headings, ordered and unordered lists, as well as italic and bold text. You can analyze the body size comparison that reveals aspects of the typeface that can’t otherwise be seen and study single glyphs, measure, grayscale as well as light on dark and dark on light previews. You may want to check out Good Web Fonts for the actual specimens of various legible screen fonts.

Handy-006 in 50 Useful Tools and Resources For Web Designers

Font Anatomy Wallpaper
This wallpaper (1920×1200) covers the terminology of typography, showcasing indi­vid­ual parts of the char­ac­ters of the alpha­bet.

Useful-tool-136 in 50 Useful Tools and Resources For Web Designers

Web FontFont User Guide (PDF)
This Web FontFont User Guide contains information about typography aimed at different groups of people: web developers, system administrators and website visitors. You may want to consider giving it to your clients or colleagues.

Useful-126 in 50 Useful Tools and Resources For Web Designers

AltFontPrev
This is a simple JavaScript bookmarklet that lets you view the font stack of any website and then deactivate each font with a single click. It makes it easy not only to make sure everything looks okay when certain fonts aren’t installed on a user’s system, but also to view the fonts included in the website’s font stack in a single click, rather than opening the source code. You can even specify a custom font, which makes it handy when you’re considering changing a design’s current font.

Altfontprev in 50 Useful Tools and Resources For Web Designers

Typografix
This tool is an HTML re-processing script for creating beautiful typography. It corrects things like ellipses and smart quotes and adds tags for <script>, <pre> and <code> automatically. The en dash, for example, is created automatically when a hyphen is surrounded by spaces, and the em dash is created when two dashes appear in a row. Typografix is written in C#, requires Windows Installer 3.1 and .NET Framework 3.5 SP1.

Unicode Codepoint Chart
This chart is broken down neatly by type of character and symbol (and by language in many cases), with a visual reference under each category. From there, just click on the symbol or character you want and you’re brought to a page with detailed information about the character, along with a browser test page, an outline (in SVG format) and a variety of encodings and character sets (HTML entity, UTF-8, UTF-16, UTF-32, ISO-8859-8, etc.).

Bookmarklets

Quix
We have covered Quix several once already, but when one talks about bookmarklets, it is just necessary to mention Quix as well. Wouldn’t it be nice to have a powerful command line in your browser, some kind of shell that lets you use handy commands and shortcuts for a quicker and more productive workflow? That’s exactly what Quix offers. The tool is a clever extensible bookmarklet that lets you both access your bookmarks and perform various operations on other websites.

Quix in 50 Useful Tools and Resources For Web Designers

WP-Toolbar bookmarklet
This tool will save a lot of clicks as you edit or update posts on your WordPress-powered blog. The bookmarklet gives you quick access to the entire administrative back-end directly in your browser’s window. There is also a GreaseMonkey script that automatically loads the toolbar when you visit a particular website.

Wp-toolbar in 50 Useful Tools and Resources For Web Designers

Print Friendly Bookmarklet
This bookmarklet strips advertising, navigation and all things that you don’t want to have when you decide to print out a page. It formats the content of an article or a document for great readbility and generates a minimal and clean PDF for printing.

Useful-tool-125 in 50 Useful Tools and Resources For Web Designers

Bookmarklet Combiner
This tool creates a master bookmarklet which can either run all bookmarks at once or display a menu at some area of the page. Nice service for users who wants to avoid using a special folder only to hold all bookmarklets.

The Printliminator
The Printliminator is a bookmarklet with some simple tools you can use to makes websites print better. One click to activate, and then click to remove elements from the page, remove graphics, and apply better print styling.

Bespin Bookmarklet
Using the Bespin Bookmarklet, you can replace any textarea you encounter with a Bespin editor, making editing the text much more pleasant.

CSS, HTML and JavaScript Tools

eCSStender
Extensions built with eCSStender simplify the design process because you can author modern CSS using advanced selectors, properties such as border-radius, or custom font faces and rest assured that your design will work — even in IE6.

Useful-tool-1031 in 50 Useful Tools and Resources For Web Designers

CoffeeScript
This is a little programming language that compiles JavaScript while simplifying the code that developers actually have to deal with. It works with current JavaScript libraries and compiles clean code, leaving even comments intact. Once developers familiarize themselves with how CoffeeScript works, they could potentially save themselves a lot of time and headaches with the simplified code.

Coffeescript in 50 Useful Tools and Resources For Web Designers

#grid
#grid is a little tool that inserts a grid onto the Web page. You can hold the grid in place and toggle it between the foreground and background. To display the grid, just press a hot key on your keyboard, and you can set your own short keys to switch views.

Analog in 50 Useful Tools and Resources For Web Designers

Primer CSS
This tiny generator works online and has only one function: it extracts from an HTML page (copying and pasting will do) a framework of classes and IDs that can be used as the foundation of an external style sheet. This can be wonderful if you work by first doing the structure in HTML, and then the forms and colors in the style sheet.

Handy-008 in 50 Useful Tools and Resources For Web Designers

CSS Usage
CSS Coverage is an extension for Firebug which allows you to scan multiple pages of your site to see which CSS rules are actually used in your site. Each time you run a scan, the CSS files that are included in the current page are shown with the number of times the rules has been found applied on your page before it.

CSSUsage in 50 Useful Tools and Resources For Web Designers

JS.Class: Ruby-style JavaScript
JS.Class is a set of tools designed to make it easy to build robust object-oriented programs in JavaScript. It’s based on Ruby, and gives you access to Ruby’s object, module and class systems, some of its reflection and metaprogramming facilities, and a few of the packages from its standard library. It also provides a package manager to help load your applications efficiently.

Tools-138 in 50 Useful Tools and Resources For Web Designers

JS Bin
JS Bin is an application specifically designed to help JavaScript- and CSS-developers to test snippets of code, within some context, and debug the code collaboratively. JS Bin allows you to edit and test JavaScript and HTML (reloading the URL also maintains the state of your code, new tabs doesn’t). Once you’re happy you can save, and send the URL to a peer for review or help. They can then make further changes saving anew if required.

Useful-220 in 50 Useful Tools and Resources For Web Designers

jQuery 1.4.2 Visual Cheat Sheet
jQuery Visual Cheat Sheet is a updated version of the useful jQuery Cheat Sheet. It includes all the reference you will need for jQuery 1.4.2 API.

Useful-tool-404 in 50 Useful Tools and Resources For Web Designers

Turbine
Turbine is a collection of PHP-powered tools that decrease CSS development time and help you avoid headaches. Among other things, it has a simple syntax, automatic packing and gzipping of multiple style files, OOP-like inheritance and templating features as well as a shell for experiments and debugging.

Useful-tool-405 in 50 Useful Tools and Resources For Web Designers

Jo: JavaScript Application Framework for HTML5
Jo embraces JavaScript’s object model and leverages CSS3 to handle as much of the presentation and animation as possible. It also provides a consistent and modular event model between objects and plays nicely with other libraries like PhoneGap.

Useful-tool-411 in 50 Useful Tools and Resources For Web Designers

Sencha: HTML5 Mobile App Framework
Sencha Touch allows you to develop web apps that look and feel native on Apple iOS and Google Android touch screen devices.

Useful-tool-407 in 50 Useful Tools and Resources For Web Designers

Aloha Editor, The HTML5 Editor
Aloha Editor is an advanced browser-based editor that is faster than other editors and provides you with better and richer formatting in real-time in your browser.

Useful-tool-106 in 50 Useful Tools and Resources For Web Designers

JavaScript Regex Syntax Highlighter
Do you want RegexPal-style regex syntax highlighting on your webpages? This library takes care of it for you, so you can spend more time writing regular expressions and less time deciphering them. Currently, JavaScript regexes only are supported.

Useful-tool-126 in 50 Useful Tools and Resources For Web Designers

OpenStack Open Source Cloud Computing Software
The goal of OpenStack is to allow any organization to create and offer cloud computing capabilities using open source software running on standard hardware. OpenStack Compute is software for automatically creating and managing large groups of virtual private servers.

Useful-tool-102 in 50 Useful Tools and Resources For Web Designers

sweet-template
Sweet (Simple WEb front-End Template) is a lightweight JavaScript template with high performance. It’s small, fast, easy to use, and, most important, extensible. It also can be integrated with jQuery.

Useful-tool-128 in 50 Useful Tools and Resources For Web Designers

jQuery Deconstructed
The Deconstructed series is designed to visually and interactively deconstruct the internal code of JavaScript libraries, including jQuery, Prototype and MooTools. It breaks the physical JavaScript into visual blocks that you can easiliy navigate. Each block opens to reveal its internal code. Clickable hyperlinks allow you to follow program flow.

Useful-tool-104 in 50 Useful Tools and Resources For Web Designers

Alloy UI
Alloy is a UI metaframework that provides a consistent and simple API for building web applications across all three levels of the browser: structure, style and behavior.

Useful-tool-406 in 50 Useful Tools and Resources For Web Designers

Google JavaScript Style Guide
This document provides a set of conventions (sometimes arbitrary) that hold the style guidelines used for Google code. It covers general good practices for open-source projects and well-written and well-documented code. It covers a lot of ground, from “use camelCase for variable names” to “never use global variables” to “never use exceptions.”

gleeBox
Gleebox provides a way to navigate web pages via keyboard. For instance, it allows you to hit the ‘G’-key and every link on the page will be highlighted. This application is available as an extension for Firefox and Google Chrome.

shellinabox
Shell In A Box implements a web server that can export arbitrary command line tools to a web based terminal emulator. This emulator is accessible to every browser that supports JavaScript and CSS and does not require any additional browser plugins.

Juicer: a CSS and JavaScript packaging tool
Juicer is a new command line tool that helps by resolving dependencies, merging and compressing files. It can check the syntax, add cache busters to and cycle asset hosts on URLs in CSS files.

Jake: A Build Tool for JavaScript
Jake is a new build tool built entirely in JavaScript that runs on top of the CommonJS. As its name suggests, it is based on the existing and already popular Rake tool and benefits from the same simplicity.

Closure Compiler
The Closure Compiler is a tool for making JavaScript download and run faster. It is a true compiler for JavaScript. Instead of compiling from a source language to machine code, it compiles from JavaScript to better JavaScript. It parses your JavaScript, analyzes it, removes dead code and rewrites and minimizes what’s left. It also checks syntax, variable references, and types, and warns about common JavaScript pitfalls.

Useful Online Tools and Services

ComparePSD (Win only)
This tool lets you compare two Photoshop files side by side and see every little difference. Look for differences by layer or by effect. You get a scaled view of the files, so you can see them next to each other and pick out differences more quickly. ComparePSD is available for Windows only and is free to download and use.

Handy-001 in 50 Useful Tools and Resources For Web Designers

Secure Passwords Generator
The tool lets you enter parameters, including the length of the password, whether to include uppercase and/or lowercase letters or numbers or punctuation and whether to eliminate characters that resemble each other (such as i and l, 1 and I, and o and 0). Then, just select the number of passwords to generate, and it returns a list. It even includes phonetics for each password to make it easier to read out loud (in case you’re giving a password to someone over the phone, for example).

Passwordgenerator in 50 Useful Tools and Resources For Web Designers

SwatchSpot: Random Color Swatch Generator
This tool creates random color swatches to inspire you. Lock in the colors you like and shuffle away the ones you don’t. Once you’re done, grab the color codes or download your palette.

Useful-tool-112 in 50 Useful Tools and Resources For Web Designers

Yuuguu: Instant screen sharing and web conferencing
This tool provides instant web-conferencing, online meetings and collaboration and enables you to work with your cusomers, partners and colleagues right away, without a single download. The free version allows for 100 minutes per month of web conferencing.

Useful-tool-403 in 50 Useful Tools and Resources For Web Designers

Web Form Recovery Firefox Plugin
Lazarus securely auto-saves all forms as you type, so after a crash or server timeout you can go back to the form, right click, “recover form”, and breathe a sigh of relief.

Tools-106 in 50 Useful Tools and Resources For Web Designers

Which loads faster?
This tool lets you see two websites load side by side in real time. Then it shows how long each took to load and the percentage difference.

Whichloadsfaster in 50 Useful Tools and Resources For Web Designers

Faary
Faary is an online form builder that operates with the help of text lines, and the form is generated as such. The tool creates an HTML form with CSS, which can be downloaded as a ZIP archive.

Faary in 50 Useful Tools and Resources For Web Designers

Scr.im
Scr.im lets you use a shortened URL to give out your email address safely and securely on forums. Just enter your email address on Scr.im and it will give you a link to a page with your email address, with security to prevent bots from viewing it.

Scrim in 50 Useful Tools and Resources For Web Designers

Name Checklist
This tool will help you find out if your brand name, username, domain and vanity url are still available online or they are already taken.

Useful-tool-121 in 50 Useful Tools and Resources For Web Designers

Quora – Web Design
Quora is a continually improving collection of questions and answers created, edited, and organized by everyone who uses it. You can follow web design, usability and related discussions and ask your questions as well.

Useful-tool-130 in 50 Useful Tools and Resources For Web Designers

Todo.txt Command Line Interface
If you’ve got a file called todo.txt on your computer right now, this script is for you. You probably don’t want to launch a full-blown text editor every time you need to add an item to your to-do list, or mark one that’s already there as complete. With this simple shell script, you can interact with todo.txt at the command line for quick and easy, Unix-y access.

Tools-126 in 50 Useful Tools and Resources For Web Designers

Note and Point
This gallery highlights beautiful Keynote, PDF and PowerPoint-slides on the Web (mostly Web design-related) which is great for inspiration if you are thinking about creating beautiful and attractive slides for your next presentation.

Noteandpoint in 50 Useful Tools and Resources For Web Designers

ManyBooks
This site offers a huge collection of public domain e-books, as well as other newer books that have been released in the public domain or under Creative Commons licenses, in a variety of formats.

Manybooks in 50 Useful Tools and Resources For Web Designers

Tweetment
This service allows you to design sexy web pages for your tweets.

Useful-tool-117 in 50 Useful Tools and Resources For Web Designers

Browser Cover Generator
This simple tool generates a browser preview of an uploaded image and can add address bar URL, window title, shadow, status bar and various browser skins to the image.

Linkification Firefox Plugin
Linkification Converts text links into genuine, clickable links. To view and set options, you can use the Linkification right-click context menu.

Useful References and Guides

Design Is History
This resource showcases the evolution of design through time. It was created as a teaching tool for young designers just beginning to explore graphic design and as a reference tool for all designers. As a designer it is important to understand where design came from, how it developed, and who shaped its evolution. The more exposure you have to past, current and future design trends, styles and designers, the larger your problem-solving toolkit. The larger your toolkit, the more effective of a designer you can be.

Desishistory in 50 Useful Tools and Resources For Web Designers

User Interface Style Guides
This page features some useful links to style guides used by large websites, corporations and news agencies (e.g. the BBC Style Guide), including editorial guidelines, quality guidelines and online standards.

Styleguides in 50 Useful Tools and Resources For Web Designers

Trademarkia
Trademarkia is a free search engine for U.S. federally registered trademarks on the Internet. They provide up to the minute contextual information about the current use of interesting business names, slogans, and logos through pictures, commercials, and conversations from Flickr, Google, Youtube, and Twitter for each U.S. trademark filed with the United States Patent and Trademark Office (USPTO) since the year 1870.

Ultimate in 50 Useful Tools and Resources For Web Designers

Icon Reference Chart
This chart, created by Jon Hicks, was created to collect the sizes, formats and the related information about icons used on different devices. At the moment it covers browsers, Android, iPad, iPhone, iPhone 4, Linux, Mac OS X and Windows. And you can also download a template for iPhone and iPad icons. Useful.

Useful-tool-124 in 50 Useful Tools and Resources For Web Designers

OpenWith.org
OpenWith is a directory of existing file extensions and free tools to open them. You’ll find a free program for just about everything you would ever need to open, including source code, data files, disc images, spreadsheets and video files.

Openwith-org in 50 Useful Tools and Resources For Web Designers

ScriptSrc.net
This site puts all the latest versions of script tags from the various JavaScript libraries in one place. Whether you use jQuery, swfobject, Chrome Frame, MooTools, Ext JS, YUI, Prototype, Dojo or Scriptaculous, you’ll find the most recent script tags here.

Scriptsrc in 50 Useful Tools and Resources For Web Designers

Colours In Cultures Chart
This map shows how colours are perceived in different cultures and nations across the globe.

Tools-130 in 50 Useful Tools and Resources For Web Designers

Guidelines and standards manuals
Handy examples of guidelines and standards manuals used by companies and brands online. Also check Branding & Corporate Identity Design page.

Tools-101 in 50 Useful Tools and Resources For Web Designers

Code Standards and Front-End Development Best Practices
This document outlines de-facto code standards in professional modern front-end development. The primary motivation of the document is code consistency and best practices. By maintaining consistency in coding styles and conventions, we can ease the burden of legacy code maintenance, and mitigate risk of breakage in the future. Nice and useful overview.

Tools-133 in 50 Useful Tools and Resources For Web Designers

Essential Tools You Always have Handy When Fixing a PC Problem?
This forum thread features must-have tools that you should keep loaded on your thumb drive when asked to deal with a family member of friend’s personal computer issue.

Tools-114 in 50 Useful Tools and Resources For Web Designers

Project Management For Dummies
Because of the ever-growing array of huge, complex, and technically challenging projects in today’s world, project management has become a critical skill. This page provides a nice project management cheat sheet that will help you handle your project management assignments, such as confirming a project’s justification, developing project objectives and schedules, and maintaining commitment for a project.

Useful-tool-109 in 50 Useful Tools and Resources For Web Designers

Expression Engine Reference Chart
A quick and useful reference guide for ExpressionEngine users. A PDF-version is available as well.

Useful-tool-135 in 50 Useful Tools and Resources For Web Designers

Computer Hardware Chart
A detailed and handy hardware chart for notebook RAM, desktop RAM, CPU sockets, hard drives, ports, processor card slots, processor card sockets, peripheral cards, desktop card slots and power connectors.

Useful-tool-408 in 50 Useful Tools and Resources For Web Designers

Corporate Identity / Logo Usage Guides
A collection of documents that illustrate how organizations and companies ensure that their branding remains consistent online and in print.

ASCII: The Pronouncation Guide
ASCII stands for American Standard Code for Information Interchange. Computers can only understand numbers, so an ASCII code is the numerical representation of a character such as ‘a’ or ‘@’ or an action of some sort. The non-printing ASCII characters are rarely used for their original purpose. This page features an ASCII character table and includes descriptions of the first 32 non-printing characters and the guide to their pronouncation.

Name Pronunciation Guide
Inogolo is a practical, easy-to-use website devoted to the English pronunciation of the names of people, places, and miscellaneous stuff. The site contains a searchable database of names with both phonetic and audio pronunciations in English.

Usability and User Experience

Hand picked UX related resources
UXMARKZ is a collection of hand picked UX related resources, updated daily. You will find interesting sites, articles, videos, images and slideshows from the field of interaction design, usability, information achitecture, user interface design and other. All submissions are moderated.

Useful-tool-107 in 50 Useful Tools and Resources For Web Designers

UX Myths
This ressource is supposed to help you build your website based on evidence, not false beliefs. UX Myths collects the most frequent user experience misconceptions and explains why they don’t hold true. And you don’t have to take their word for it, the site shows you a lot of research findings and articles by design and usability gurus.

Useful-tool-105 in 50 Useful Tools and Resources For Web Designers

User Interface Design Patterns for Ideas and Inspiration
A user interface design pattern library. It is a collection of Web design patterns and best practices which helps you to find inspiration and design interfaces with great user experience. It is also a user interface gallery full of real world examples of our patterns.

Useful-tool-137 in 50 Useful Tools and Resources For Web Designers

Last Click

How Do I Win Rock Paper Scissors Every Time?
Now, that’s a handy resource: have you ever gotten tired of being crushed by Rock, cut to shreds by Scissors, or smothered by Paper? This graphic has information compiled about Rock, Paper, Scissors (RPS) from the World RPS Society, the masters of Rock, Paper, Scissors, to help you overcome your opponents and understand the strategies needed to win Rock, Paper, Scissors every time.

Useful-tool-103 in 50 Useful Tools and Resources For Web Designers

The Universal Packing List
This tool generates a custom packing list for your journeys. You have to provide some basic information about the journey and a packing list appears immediately.

Tools-131 in 50 Useful Tools and Resources For Web Designers

Ex-blocker
The Ex-blocker is a plugin that hides any information about your ex online. The tool is available as a Firefox and Chrome extension.

Useful-tool-115 in 50 Useful Tools and Resources For Web Designers

Not Beans Again
An online tool that finds a recipe from your ingredients. Enter what you have got in your fridge to the “Ingrediometer” and see if the tool can come up with a recipe for you.

Useful-tool-108 in 50 Useful Tools and Resources For Web Designers

A Coder’s Guide to Coffee
As most software and creative professionals know, coffee is an important technology for boosting mental acuity and maintaining peak on-the-job performance. But did you also know that coffee can be a damn tasty beverage? All you need is the appropriate amount of disrespect for the mainstream coffee industry and a desire to enjoy a better beverage.

Useful-tool-134 in 50 Useful Tools and Resources For Web Designers

Flipboard
Flipboard is a free personalized social magazine for your iPad. It allows you to quickly flip through news, photos and updates your friends are sharing on Facebook and Twitter. The emergence of tools like this is what will make iPad a truly useful and handy device for many people.

Useful-tool-119 in 50 Useful Tools and Resources For Web Designers

Android Source and application links

11:22 pm in Blogging, Tech, Tricks by vapvarun

With its intuitive and open-source platform and support from the huge mobile phone manufacturers HTC, Samsung and Sony Ericsson, Androids year-on-year smart-phone marketshare has shown a massive growth of 886%! Just to put this into perspective, the iPhone has shown only 61% growth. These figures may give you an insight into the popularity of both platforms, but in actual fact, it shows that it is mobile app developers who are the real winners. With smartphones becoming ever more popular, there has never been a better time to jump on the mobile app development bandwagon, and especially on the rapidly growing open Android platform.

Compared to other platforms, Android does not rely on a proprietary OS that restricts the use of third-party applications (off-topic: US regulators have recently announced it was lawful to hack or jailbreak an iPhone), it is an open-source and level alternative. And this reflects in its now huge development community, were everything, from samples, tutorials, GUI downloads… all seem to be freely offered. It is on that theme in which this article focuses. We have selected our favorite 20 free to use, some open-source, tools, resources, guides and downloads that will hopefully help you with your next Android app.

 

Free Android Developer Ebook: andbook!

Free Android Developer Ebook: andbook!

Free Android Developer Ebook: andbook!If you are just stepping into Android Development for the first time this free ebook is perfect for you. It is a 62 page PDF ebook choc-full of easy to follow tutorials that shows you how to start coding an Android app without having any Android-dev knowledge whatsoever.
Free Android Developer Ebook: andbook! →

Free Android Developer Ebook: Professional Android Application Development

Free Android Developer Ebook: Professional Android Application DevelopmentThe Professional Android Application Development PDF ebook is a hands-on guide to building mobile applications, this book features concise and compelling examples that show you how
to quickly construct real-world mobile applications for Android phones. It covers all the essential features, and explores the advanced capabilities of Android.
Free Android Developer Ebook: Professional Android Application Development →

Free & Open-Source Sample Applications

apps-for-android (Open Source Applications) →
This is a popular collection of useful, open source applications that demonstrate the features of the Android.

List of Sample Android Apps →
The list on this page offers a summary of the sample applications that are available with the Android SDK. Using the links on this page, you can view the source files of the sample applications in your browser. You can also download the source of these samples into your SDK, then modify and reuse it as you need.

Android Cookbook (Examples in Cookbook Form) →
This is a collection of several useful Android examples in cookbook form that you can re-use and play with.

OpenIntents →
OpenIntents design and implement open intents and interfaces to make Android mobile applications work more closely together. They freely offer prefessional and complex sample applications to demonstrate their usage.

Android Snippets (Share Useful Snippets of Source Code) →
Android Snippets is a repository of useful code-snippets for android, to share good and reusable code; thus not having to reinvent the wheel if not necessary.

Android on Windows

Android on WindowsFor those of you who want to test drive Android you can use this emulator, which is patched to run on a Windows PC as a standalone app, without having to download and install the complete and complex Android SDK. You can even install and test Android compatible apps on it.
Android Emulator on Windows →

Android Emulator from The Developer’s Guide

Android Emulator from The Developer's GuideThe Android SDK includes a mobile device emulator which mimics all of the hardware and software features of a typical mobile device (although, without the calls). It provides a variety of navigation and control keys, which you can "press" using your mouse or keyboard to generate events for your application. It also provides a screen in which your application is displayed, together with any other Android applications running.
Android Emulator from The Developer’s Guide →

SensorSimulator

SensorSimulator
Sensor simulator is a java standalone application that simulates sensor data and transmits them to the Android emulator. It will allow you to simulate sensor data from accerelometer, compass, and orientation sensors and the data can then be used in an Android application, to steer them live through the sensors.
SensorSimulator →

DroidEx: Projecting Android on the Big(ger) Screen

DroidEx displays a copy of your attached Android device’s screen on your own development machine’s screen. Mostly, this is useful for presentations, as you can attach an Android device to a notebook attached to a projector, and your audience can see what is on the device. In particular, this is good for demonstrations of things that cannot readily be demonstrated via the emulator, such as GPS access or the accelerometer.
DroidEx: Projecting Android on the Big(ger) Screen →

App Inventor for Android

App Inventor for Android

The App Inventor for Android is a new tool from Google that allows non-developers to create there own app very, very easily. You can have a look at this video for an overview of all of its features.
App Inventor for Android →

Common Tasks and How to Do Them in Android

Common Tasks and How to Do Them in Android
This is a collection of some of the most common tasks you will come across with Android development, and offers quick and to the point — how-to’s to help you on your way.
Common Tasks and How to Do Them in Android

Fastboot Cheat Sheet

Fastboot Cheat Sheet
The Fastboot Cheat Sheet is a very useful and quick list of some common tasks in fastboot.
Fastboot Cheat Sheet →

User Interface Guidelines

Here you will find links to the official articles, from the The Developer’s Guide, that describe the Android UI developing guidelines for the interaction and visual design of Android applications.

Icon Design Guidelines →
The Icon Guidelines describe each kind of icon in detail, with specifications for the size, color, shading, and other details for making all your icons fit in the Android system. You can download the Icon Templates Pack, which is an archive of Photoshop and Illustrator templates and filters that make it much simpler to create conforming icons.
Download the Android Icon Templates Pack »

Widget Design Guidelines →
These design guidelines describe how to design widgets that fit with others on the Home screen. They include links to graphics files and templates that will make your designer’s life easier.

Activity and Task Design Guidelines →
These guidelines describe how activities work, illustrates them with examples, and describes important underlying principles and mechanisms, such as multitasking, activity reuse, intents, the activity stack, and tasks. It covers this all from a high-level design perspective.

Menu Design Guidelines →
These guidelines describe the difference between Options and Context menus, how to arrange menu items, when to put commands on-screen, and other details about menu design.

Understanding User Interface in Android via mobiforge.com
In this four part article, from mobiforge.com, you are walked through the various elements that make up the UI of an Android application. In the first part of the article, it discusses the various layouts available in Android to position the various widgets on your screen.
Understanding User Interface in Android – Part 1 →
Understanding User Interface in Android – Part 2 →
Understanding User Interface in Android – Part 3 →
Understanding User Interface in Android – Part 4 →

Android UI Patterns

Android UI Patterns
Android UI Patterns →

DroidDraw : Graphical User Interface Editor for Android

DroidDraw : Graphical User Interface Editor for AndroidDroidDraw is a User Interface (UI) designer/editor that can be used to build GUIs for Android. It is standalone executable, and its available for Mac OS X, Windows and Linux.
DroidDraw : Graphical User Interface Editor for Android →

Android GUI PSD Vector Kit

Android GUI PSD Vector Kit
The Android GUI Starter Kit comes with several button elements as well as different interface options for Android GUI. is based on elements of Android 1.5 GUI and has been made to help the open-source community with Android applications mock-ups. Most of the elements and phone illustration are made in vector path so they are easily resizable. For text Android Sans was used.
Android GUI PSD Vector Kit →

Fireworks Template for Android

Fireworks Template for Android
In this Fireworks template the Android user interface elements have been redrawn as vector images. In the folders the elements have been mostly labeled according to the Android vocabulary.
Fireworks Template for Android →

Android Wireframe Templates

Android Wireframe Templates
The wireframe PDF is Letter size (8.5 inches by 11 inches) and the handsets are all to scale, so you can use these quite easily for paper prototyping and getting a realistic sense of scale. There’s a subtle 10×10 grid on the screens to help you with your pencil based needs. If you’re short on Letter paper, you can get away with printing them on A4.
Android Wireframe Templates →

Fresh high-quality free fonts

10:44 pm in Blogging, Web Designing, Websites by vapvarun

Every now and then we look around, select fresh high-quality free fonts and present them to you in a brief overview. The choice is enormous, so the time you need to find them is usually time you should be investing in your current projects. We search for them and find them so that you don’t have to.

In this selection, we’re pleased to present Piron, Nobile, St Marie, Code, Arcus, Crimson Text, Quadranta, Juice, Prociono, Mr Jones, Ibarra Real and various useful symbol fonts. Please note that some fonts are for personal use only and are clearly marked as such. Please read the license agreements carefully before using the fonts; they can change from time to time.

New Free High-Quality Fonts

Piron
Piron is a highly legible typeface, very well suited to any display or text usage: Web, print (especially magazines), brochures, logos, posters, flyers, motion graphics. The font comes in two weights: regular and oblique. Designed by Alexander Nedelev and Veronika Slavova. Available for free and commercial use, and available in OpenType format.

Piron in 30 New Free High-Quality Fonts

Fonts-130 in 30 New Free High-Quality Fonts

Fonts-131 in 30 New Free High-Quality Fonts

Fonts-1320 in 30 New Free High-Quality Fonts

St Ryde Regular (Registration required, PDF Specimen)
St Ryde is a sans-serif, very casual typeface, that works perfect in your bodycopy within the regular weights. The whole family comes in 5 weights including the matching italics, so you can choose from thin, light, regular, medium and bold. Regular is available for free download. St Ryde has a wide range of characters, including small caps, lining, proportional and tabular figures plus small caps figures, too. Designed by Sascha Timplan. Available in OpenType format.

Ryde-1 in 30 New Free High-Quality Fonts

Ryde-2 in 30 New Free High-Quality Fonts

Nobile
The font is designed to work on digital screens and handheld devices without losing the distinctive look usually found in fonts designed for print. The aim here was to design a font that would function well, have good legibility on screen yet also look good — not only at larger display sizes but also right down to small text sizes. The font is available in the Google Font Directory and was released under the Open Font License. The family comes in four weights (regular, italic, bold and bold italic).

Nobi in 30 New Free High-Quality Fonts

Mr Jones Book and Mr Jones Book Italic (Registration required)
Mr Jones was originally conceived as a family for print design, consisting of a sans and a headline. The lowercase forms are wide for legibility at small sizes, while the caps are narrower to save space and keep an even balance of negative space when used in body copy. The overall widths of certain characters have been adjusted to almost extremes to keep an even balance of white space around each letter. The font works well in body copy but will need decreased tracking in larger settings. It comes with proportional, old-style and tabular figures and discretionary ligatures.

Fonts-136 in 30 New Free High-Quality Fonts

Pigiarniq Inuktitut (Download link)
An oldie but a goodie. Heard of Nunavut? A small territory in Canada with one of the lowest population rates of the world? Probably not. Only 0.01 people live there per square kilometer, mostly Inuit. The citizens of Nunavut speak four languages: French, English, Innuinaqtun and Inuktitut. A few years ago, the government of the region decided to design a new typeface to enable its 28,000 citizens to use all four languages in a uniform manner. The result was a beautiful, rich and professional free sans-serif. The family includes bold, heavy, italic, light and regular weights, all available for free use.

Pig in 30 New Free High-Quality Fonts

St Marie
St Marie is a rich type family designed for online applications and print. This release is a preview of the upcoming family, and the designer has released two weights (St Marie Thin and St Marie Thin Web) for free. The download package contains the weights in the formats OTF, WOFF, EOT and SVG, as well as a @font-face kit. See this example of St Marie Thin Web (HTML-page).

Fonts-101 in 30 New Free High-Quality Fonts

Code: Free Font
This sturdy yet playful little font family can be applied to different kinds of graphic design work: Web, print, motion graphics, t-shirts, posters, logotypes. The font contains 192 characters and two weights (regular and bold) and is available in OTF for PC or Mac.

Fonts-102 in 30 New Free High-Quality Fonts

VAL Stencil
A quite distinctive, memorable font with two variations: lowercase letters bend to the left and uppercase letters bend to the right. This unique font will give your headlines originality and dynamism. Designed by Svetoslav Simov of Fontfabric, available in OTF.

Fonts-103 in 30 New Free High-Quality Fonts

Fonts-146 in 30 New Free High-Quality Fonts

Fonts-1471 in 30 New Free High-Quality Fonts

akaDora (For personal use only)
akaDora is a fairly simple script font with wide character support. Designed by James Daniel Milligan.

Akadora-sample in 30 New Free High-Quality Fonts

Arcus and Arcus Italic (Registration required)
Arcus is a geometrically constructed font with rounded curves. The font contains a wide range of alternative signs, small capitals, lining and old-style numerals, fractions, superiors, inferiors, ligatures and discretionary ligatures; all this is within the frame of OpenType functions. The type family was designed for headlines, logotypes and corporate identities, and it is not a good fit for long text. Available for free and commercial use.

Fonts-105 in 30 New Free High-Quality Fonts

Crimson Text
Open that old tome from the bookshelf over the fireplace, stick your nose in its pages and smell the ink, the glue and the immortality of the printed words. That is what Crimson Text is meant to be like. The font is released under the Open Font License.

Fonts-107 in 30 New Free High-Quality Fonts

Acid (Free for personal use only)
Acid was designed by Stephan Baum specifically to be used in logotypes and body copy. The form of glyphs is similar to the design classic B42 by Marcel Breuer (Bauhaus) and has a very geometric character. The font contains 103 glyphs, comes in six weights (regular, regular italic, medium, medium italic, bold and bold italic) and is in the process of being developed. Released under Creative Commons.

Fonts-148 in 30 New Free High-Quality Fonts

Real Origami (Free for personal use only) (PDF specimen)
The designers based this font on an origami alphabet by Japanese artist Taichiro Hasegawa. A very original, distinctive and playful font.

Fonts-109 in 30 New Free High-Quality Fonts

Fonts-110 in 30 New Free High-Quality Fonts

Quadranta
According to its creator, this design was started with quadrant arcs. Quadranta is a display font that would fit logo designs and playful headlines. Available for personal and commercial use. Designed by Darim Kim.

Fonts-111 in 30 New Free High-Quality Fonts

Balonez Fantasia
Yet another distinctive, playful font with rounded glyphs. This would be great fit for brochures, magazine and t-shirts. Designed by Thiago Calza. Freely available for personal and commercial work. Available are two weights in TrueType.

Fonts-112 in 30 New Free High-Quality Fonts

Juice
Juice is a modern, dynamic sans-serif type family. The font contains six weights (light, light italic, regular, italic, bold and bold italic), each containing 161 glyphs. The font is available in TrueType format. Designed by Dhany Arliyanti.

Fonts-113 in 30 New Free High-Quality Fonts

Geomancy Typeface (Free for personal use only)
Geomancy is a chunky, retro geometric font that hearkens to French and American art deco. With some letterforms taken directly from posters and ephemera of the period, the all-uppercase set comes with many alternates and ligatures, so you can give a little of that varied, hand-painted feel to your work. Available in two weights: hairline and extra bold.

Fonts-115 in 30 New Free High-Quality Fonts

Fonts-136 in 30 New Free High-Quality Fonts

Prociono
Prociono is an Esperanto word meaning either the star Procyon or the animal species known as the raccoon. It is a roman typeface with blackletter elements. The release includes both OTF and TTF. Source files are available as well.

Fonts-106 in 30 New Free High-Quality Fonts

Edelsans (Free for personal use only)
Edelsans was designed as a noble geometric font for the screen, with few corners and mostly rounded glyphs. The typeface is not completely finished but is free for non-commercial use.

Fonts-116 in 30 New Free High-Quality Fonts

Fonts-117 in 30 New Free High-Quality Fonts

Fonts-118 in 30 New Free High-Quality Fonts

Neu Eichmass
Neu Eichmass (German for New Etalon) is a typeface based on the weight 100 grams. The name is a reference to International Prototype kilogram, as a base unit of mass in the International System of Units. The typeface has a modern, cold, measured feel to it, reflecting its origin (its metal “parents”). It is a sans-serif font and takes inspiration from famous grotesques and stenciled types associated with marketplaces and street traders. Further inspiration comes from 1920s and ’30s constructivism. The font can be easily stenciled and is appropriate for different uses (street art, retail, independent shops, street markets). It comes in a headline font and a medium point body text suitable for print. Designed by Ivan Khmelevsky.

Fonts-1381 in 30 New Free High-Quality Fonts

Ingleby Font
A beautiful, carefully crafted serif font, with signs of the fine antiqua tradition. Designed by David Engelby, the font comes in four weights: regular, italic, bold and bold italic.

Fonts-149 in 30 New Free High-Quality Fonts

Ibarra Real
Ibarra Real is a public domain font of Ibero-American character. Created in 2005, Ibarra Real is an elegant design, mixing tradition and modernity; a genuine badge of the particular Spanish culture that was created by Joaquín Ibarra in 1780. Available for Windows, Mac and Linux.

Ibarrareal in 30 New Free High-Quality Fonts

Notice 1: Packaging Symbols (Download)
A symbols font with various weather, packaging and usage symbols.

Fonts-121 in 30 New Free High-Quality Fonts

Notice 2: Navigation symbols (Download)
Yet another symbols font, this one containing symbols for public transit, car and flight navigation.

Fonts-120 in 30 New Free High-Quality Fonts

Notice 3: Cloth Symbols (Download)
This symbols font contains pictograms for the clothing industry. The font is available in OpenType and was designed by the Russian studio Otlab.

Fonts-119 in 30 New Free High-Quality Fonts

Glyphyx (Registration required)
This set of two free fonts features symbols and icons for use in data visualization. Glyphyx One includes symbols related to transportation, while Glyphyx Two has symbols related to leisure activities. Available in OpenType and TrueType formats for Windows and Mac.

Fonts-144 in 30 New Free High-Quality Fonts

Free Symbol Signs Collection
Here is a collection of 50 common symbols for signage, professional designed. The symbols are free for use and are available in OpenType format. All were designed by Sander Baumann, set to the proportions of a regular typeface, so you no longer need to copy and paste such icons into your designs.

Fonts-145 in 30 New Free High-Quality Fonts

Rally Character Set (Specimen | Preview | Download)
Lukyan Turetsky released this character set of car rally symbols. The font contains standard signs of control in rallies, rally-related infographic icons, blanks for logos and other graphics, symbols for legends and other symbols and marks. In OpenType and available for free.

Rally in 30 New Free High-Quality Fonts

Oblik Serif Bold (Registration required)
Oblik Serif Bold is a sophisticated contemporary font with vivid and playful glyphs. The font could be a great fit for headlines and posters but is hardly usable for long body text. The font has wide character support and is available for free and commercial use. Comes in OpenType format.

Fonts-139 in 30 New Free High-Quality Fonts

Paranoid
Paranoid is a yet another experimental font, collaboratively designed by Simon Carrasco, John Stuart and Kevin Yeun Kit Lo. Paranoid is a purely geometric display face, conceived as a contribution to (and subtle critique of) the still growing trend of bold, geometric and counterless typography. It is equally suited to bringing back the joy of ’80s dance parties or expressing the ominous foreboding of inevitable nuclear disaster. A flexible face in spite of its limited form. Please contact the designers before using this font commercially.

Fonts-133 in 30 New Free High-Quality Fonts

01.BASE
This free font is bold and experimental. It would come handy for bold statements on t-shirts and posters. The font was designed by Fabian De Lange and is licensed under the Creative Commons Attribution Share Alike license.

Fonts-152 in 30 New Free High-Quality Fonts

Fonts-151 in 30 New Free High-Quality Fonts

Fonts-150 in 30 New Free High-Quality Fonts

Last Click

Typedia
Typedia is a community website dedicated to classifying typefaces and educating people about typefaces. Think of it as a cross between IMDB and Wikipedia, except for type. Anyone can join, add or edit pages for typefaces and the people behind them.

Typedia in 30 New Free High-Quality Fonts

Blogger Template Designer

1:49 pm in Adsense, Blogging, Tricks, Web Designing by vapvarun

Blogger has recently introduced "Blogger Template Designer" feature for Blogspot users and give more benefits to the end users as far as designing of blog is concerned. I personally have tried this fascinating feature and i am very very happy while using it. it is using a very handy process called wizard, you need to do is just select some options and apply and save it and your blog’s design template will be no more remains the same as old one. you will get the same feeling as i have feel, so why not check this feature in Blogger Draft. Those who have less knowledge about CSS and HTML can also create their own personalized template for blogspot blogs. The feature “Template Designer” is now on Blogger Draft and soon it will be placed on Main Blogger area.
To try this Blogger Template Designer first open this Link: http://draft.blogger.com/
Now Click on Layout and there you will see Template Designer feature.
Blogger Template Designer
There are Four Main features. Template, Background, Layout and Advance.
Template: In this section you can select different style of templates provided by popular template designers.
Blogger Template
Background: If you want to chage background color you can do that from background properties. Plenty of colors and customization are available to add in your blog in this section.
Layout: This is one of the most useful feature for bloggers. you can easily change the Layout of your blogspot blog to Two Column, Three Column and make customize template. you can also customize your blog headers and footer section withing layout. you can Move the position of all widgets to left, right top or down (which was not possible before without having XML knowledge).
Blogger Template Layout
Advance: Using this option you can change color for Page Text, Background, Blog Title, Tabs Text, Date Header, Post, and Links color. There is anotherfeature under Advance option called CSS. You can add any CSS code in side the box to add new stuffs to your blogspot blog.
Advanced Templates
So just go ahead and try this very nice feature of blogger :)

Note: Before making any changes to your blog design and template don’t forget to take full backup of your template.

So are you pleased with this move from blogger? Share your experience with me.

Vanilla Surf

12:57 pm in Tech by vapvarun

VanillaSurf browser for iPhone.Features

  • You have the ability to add bookmarks that can also be organized into folders; you can also import bookmarks from Safari desktop or Firefox, or export them from VanillaSurf using the built-in web server.
  • Rotation lock allows you to look the screen so that it stays in that position no matter how you turn your device.
  • You can open the current page you’re viewing in Safari.
  • You can sear the web via Google, Yahoo, Wikipedia, Amazon or eBay search engines.
  • You can share the current web page via email.
  • You can take a screenshot of the current web page.
  • You can download and save images by tapping and holding the image.
  • You can choose to hide images in order to speed up the loading time of web pages.
  • You can turn on the ad-blocker and/or private surfer under settings; both are off by default.
  • “If you’re in Safari and want to open the current page in VanillaSurf add this code as a bookmarklet in Safari: “javascript:document.location.href=’vsurf://’+document.location.href;” and then just open this bookmarklet on the current page.”

Likes

  • It’s totally free – there is only ONE version so, there’s no paying for a “full” version.
  • Full screen browsing with the ability to minimize the toolbar down to a single button (that is used to bring the toolbar back up).
  • Tab support with offline viewing support.
  • You can download files from any website right within VanillaSurf and then transfer those files to your Mac or PC via the bult-in web server.
  • You can set ANY page as your home page.
  • You can change your theme but, there are only 2 to choose from.
  • Address bar history – when entering a new web address you get a drop-down list of possible matches.

Dislikes

  • Tabs can only be viewed in list view (like mobile Safari) as opposed to desktop style.

VanillaSurf offers a lot of features that you just can’t beat for free! With only one dislike, this browser is definitely in my top list.

Use WordPress as a cms for designing websites for your clients

11:12 am in Blogging, Tricks, Wordpress by vapvarun

WordPress on a site that is decided non-blog like.

1. Pick a Good Non-Blog Theme

This one might seem obvious, but you don’t want to create a non-blog site using a theme designed for a blog. WordPress has a growing selection of magazine-style themes that can work well for a business site or even just a non-traditional blog. There are many themes designed to work with static home pages and, in some cases, themes designed to work without any posts at all.

If you choose a theme that looks like the type of site you’re trying to create, you’ll have a head start. Even if it isn’t perfect, if it’s close and serves as a good “jumping off” point, you’ll have made a lot of progress very quickly.

2. Ignore the Posts/Pages Paradigm

Thinking of posts and pages as posts and pages is only useful if you’re running a blog and you need a clear distinction between static content (about, contact, etc.) and your actual news items. The truth is that posts and pages are both pages and both can be used for static content.

The only significant difference between the two is how themes treat them. Since posts can be placed into categories and pages can be children of one another, themes put them in specific places. However, that doesn’t mean you have to use them as designed.

For example, on CopyByte, the individual areas of business are actually separate categories, each with one post. If I posted a new item in the category, it would bump the previous one off the page. However, since I’m not adding content to those categories, the posts remain statically fixed to the front page, exactly as if they were pages. On CopyByte, the pages are actually across the top, representing the about page, contact page and so forth.

Though it isn’t how posts and pages were meant to be used, it certainly works well for the purpose.

3. Alter Your Permalinks

If you’re not using WordPress to power a blog, you’re most likely going to have only a very small number of pages/posts. As such, you can afford to be much more tight with your permalinks.

Under Settings/Permalinks, use the custom permalinks option to change your URL structure to this:

/%postname%/

What that will do is make it so that your URL is just your domain followed by the title of the post.

However, we’re not done there. You then need to go into your individual posts and pages and further whittle down the URL, especially if you are using long titles.

Looking below the title on your edit page, you can convert the permalink to whatever you want. For example “contact-us” can become just “contact” and so forth. This makes the URLs easier to remember and makes the site look much more clean and professional.

4. Use Widgets

Widgets are already a powerful tool in WordPress design and development but they become even more useful when building a non-blog site.

The reason is that widgets are an easy way for creating custom navigation elements that can’t be easily replicated using traditional theme design. For example, if you need to create a custom list of your services or product areas, it might be difficult, especially if you had to mix posts and pages, do this the traditional way. However, you can do it easily with widgets and a few minutes of patience.

It’s also worth noting that widgets don’t have to live in your sidebar, they can also be in other parts of your site including your footer (as with CopyByte) and even your header. Any part of your theme can be widgetized if needed.

This is much easier than trying to hard code custom link lists or other into your theme as there is less code to mess around with (and screw up) and you can trivially move the elements around as needed.

5. Use Category Feeds

Though the primary function of your site is not a blog, that doesn’t mean you won’t want to have some blog-like elements, such as a news section. However, if you’ve used some of your blog categories as static pages, as per item 2, you probably won’t get much good use out of your RSS feed as it will also have unrelated and non-blog content.

The way around that is to use category feeds. Simply add the following code after the ? in your feed URL and replace the “#” with the actual category number for your news category.

cat=#&

Once you do that, you should have a new URL that only displays content in that one feed. You can provide this URL to FeedBurner or just put it as is into your HTML. You can even place it in the header of your site by replacing the following code (or anything similar) with your full feed URL.

< ?php bloginfo('rss2_url') ?>

This will set it up so that browsers and RSS readers will default to this category feed rather than the site’s main feed, which includes all categories.

Bottom Line

WordPress is designed for blogs. However, it is flexible enough for just about any kind of site to get some benefit out using it. I’ve seen WordPress on everything from personal blogs to sites for large nuclear engineering firms. From someone’s first home page to a major newspaper using it for a significant portion of their site.

The biggest problem with using WordPress for non-blog sites is that the terminology and structure that WordPress uses is designed primarily for blog sites. This makes sense as it is the most common use for the platform. However, that does mean that using it for a non-blog site requires putting things into a different context.

But, with just a little bit of rethinking and retooling, you can trivially use WordPress to manage just about any kind of site (within reason) and, if you’re already familiar with it, there is little reason to learn another CMS for the purpose.

In short, it is much easier to tweak what you know about your existing CMS than to try and learn a whole new one. It’s that simple.

64 Ways to Promote your Website and Increase Traffic!

1:56 pm in Adsense, Wordpress by vapvarun

Here are some methods to increase traffic to your blog or website. Some of these techniques will help increase sales as well as hits.
1. Have Your Own Domain – If you use WordPress or blogger, try to avoid using sub-domains or free hosting services. Pay for some web hosting and get your own unique domain name. This will make your website more memorable and encourage visitors to return.
2. Create a Professional and Unique Design with Logo – Code your own template or modify an existing theme for your site or blog. What makes your blog so special if it looks the same as 1000 others on the Internet? Make sure you have a great memorable logo so when people see it; they know it’s your websites. Your design should be clean and simple so it’s easy to navigate. Once you have made it, test it and check everything works, a site with errors will lose visitors.
3. Content is King – You need to consistently write great content on your blog or website. The posts that you make need to be worth reading and have some impact on the visitor. If I am visiting your website for the first time, I want to be impressed and bookmark your website so I return to see what else you compose.
4. Post Linking – When a link is made to your blog from another blog, if activated, it places a link in that blogs comments back to the relevant post. This will help increase back links to your blog and therefore increase traffic.
5. Personality – Do not pretend to be someone you are not as a blogger. Be yourself and do not act otherwise. This is best because your readers want someone to connect with, someone who is a real person and not just a blog with no face.
6. Always Room for Improvement – Always strive to improve your blog or site any way you can. Play around with ad placement, colours and graphics and other features to make your blog more appealing. Ask for reviews to find area’s for improvement.
7. Reply to Your Readers – This means replying to comments and any e-mails that you receive. This is part of your personality and showing that you are a real person who exists and cares about the topic you are blogging about.
8. Real Posts – Ensure that you sound human in your posts. Do not post in the third person. Use words such as “I” and talk about your personal experiences.
9. A Picture – A picture paints a thousand words so why not show your readers who is writing the blog. Upload an image of yourself onto your about page, or if you are not quite comfortable to do that then have a cartoon of yourself made.
10. Comment on Other Blogs – This is a very powerful technique, I know I find myself clicking the link to a person’s website after I have read their comment and this is what you can achieve by leaving your comment on as many other blogs as possible. Blogs that are about the same topic will help you get targeted traffic. Ensure your comment is worth reading and not just a load of rubbish.
11. Question Your Readers – Ask your readers questions in posts, this will help to provoke a response from them. You give them an important role to play and they respond by commenting their opinion. This will encourage repeat visitors to respond to your posts with their opinions.
12. Internal Linking – Linking to previous posts that you have made will create more back links and also encourage readers to re-read or look at some of your older work. Readers of a particular post will be interested in related posts so ensure you link to them.
13. Alternate Text Images – When you use images on your site, ensure that you use alternate text “alt” tags to insert keywords or the name of the image. This will help get the images listed on image search engines and result in traffic from that source.
14. Submit to Directories – Submit your site to online directories. Do this to as many as you can to improve your PageRank. This increased back links to your website and there for you receive higher rankings on search engines. Quality back links are important so try and obtain some from high Page Ranking sites that have similar content to your websites.
15. Image Use – Try to use images when posting on your blog. These make posts more fun to look at and can break up boring text.
16. Join Forums – Join many forums and message boards that are related to your websites content. Place a link back to your website in your profile and signature and frequently post useful information to other members.
17. Keyword Rich Content – When writing articles or posts on your site or blog, ensure you include relevant keywords so that people searching for the topic will have an easier time finding your article.
18. Write Intriguing Post Titles – Ensure that you write intriguing post titles that have keywords in. This is what is going to show up on search engines so ensure your spelling is right and that you would want to click it.
19. Meta Data – Get as much use out of Meta data as you can. Try to have a different page description and keywords on every page of your website.
20. Write a Press Release – Write a press release about something to do with your website and publish this on news sites or press release websites along with sites that are relevant to your niche.
21. Merchandise – Create pens, pencils, t-shirts, mouse mats etc that have your websites logo and address on. Maybe sell the t-shirts from your website however give you the free pens in your local area.
22. Advertise Locally – Place an advert in your local business newsletter or in a local shop. List what the purpose of your website is and hopefully you will receive some interest. Local traffic can really help especially if you are selling something. Visitors will be much more inclined to purchase from someone locally than from the other site of the world.
23. Share a Secret – It is likely that your website will be based on something you have an interest in, so why not share some inside knowledge that many of your readers may not know. Let them know something that has helped you and only you in the past. Curiosity is a marvellous thing.
24. Advert Experiments – Naturally most will want to make some money from their website and therefore adverts will be on there. Try and experiment with your adverts placement to see which gets better results. Do not overload your website with adverts because this will deter visitors. Maybe implement a membership system that removes 50% of adverts when logged in.
25. Social Bookmark Posts Plugin – If you have a blog then get a plugin for your posts that allows your readers to click a button and this will then bookmark your site on digg, stumbleupon, reddit etc. 
26. Ask for Diggs – There is no harm is asking your readers to Digg posts that you have written. This will help increase the number of dig users visiting your website.
27. Ask for Comments – Ask your visitors in your posts to post their comments about the post. If you are not getting as many comments as you would like then anything is worth a try. 
28. Ask for Subscriptions – While asking for comments you may was well ask for other things such as subscriptions to your RSS feed. Ensure there is a big button that can be clicked that allows subscriptions to be made simple and stress free.
29. E-mail Subscription – Allows users to sign up by e-mail so that your blog posts are delivered to their e-mail address. This will ensure visitors do not miss any of your posts.

30. MyBlogLog – This is a great service that shows an image of your visitors on your website if they are registered. There are similar blog social networking sites that can also be used for this.
31. Post Rating – Enable a plug-in on your blog that allows visitors to rate your posts. This is a simple way that does not require registration to enable readers to report on how good a post is.
32. FeedBurner – Using a service such as Feed Burner allows you to monitor the number of subscribers you have. Many readers will be interested to see how many other users are reading your blog and are subscribed to it. Use their publicize services to show the number of readers.
33. Commenting – Try enabling and disabling the “must be registered to comment” feature to see which yields more results. You should find that without registration, more comments will come through; however this does mean that you should implement some spam protection feature.
34. Online Homepages – Many people use Google for example and have iGoogle activated. This is why you should have an RSS plug-in that allows users to click and it adds to feed to such services.
35. Write a List Post or Article – Writing a bulleted list can sometimes be easier on the reader and writer if you have lots on information to roll off in one post. This is a list post and makes for easy reading.
36. Article Marketing – Write an article and post it on sites such as article beech or ezine articles. Ensure you include a link back to your site in the article. Make sure the article is great so that people will want to read more of your work.
37. Autopinger – use sites such as autopinger.com to submit your blog to lots of websites.
38. Submit Site to Search Engines – Manually submit your site to the major search engines on the web and also use auto submitter websites for lesser known search engines. Organic search engine traffic is great and will increase your ad revenue.
39. DMOZ – Submit your website to dmoz.org. if you manage to get listed this will really help your traffic stats.
40. Site Contests – Offer a prize to the 1000th subscriber or commenter to encourage whatever activity you want. The prize could simply be a text link on your website, however the more appealing the better.
41. Banner Exchanges – You could try a banner exchange service however you may not be able to choose what type of banner is placed on your site. Try and contact other bloggers with similar content and ask for a link exchange.
42. Site Load Time – Check how long it takes your website to load and increase the speed if necessary. This is important to ensure visitors are not leaving before the site has fully loaded. Try to use smaller images or multimedia if your site is slow.
43. YouTube – Create a YouTube account and add you link in your profile so that you might get traffic from people who view any videos that you upload. Make videos relating to your website content so any traffic is targeted.
44. About Us – Get your site listed at Wiki – about Us Wiki Page, this is another way to increase back links. On the site you can put information about your website.
45. Tags – Tagging your posts or articles on your website is a great way of entering keywords to help search engines. Make the most of these where you can.
46. Categories – If you have a blog then use blog categories with meaningful names that use keywords so that these show up in the websites URL and on SERPS (Search Engine Result Pages)
47. Permalink – Check to see if this features is enabled. If its not then enable it and have the post title in the URL.
48. Holidays – These are great for marketing so ensure that you are ready. Start making posts and site content about Christmas / Easter or whatever about a month before the event. This gives search engines chance to list your posts. Then when people search for Christmas XXXXXX your site will be there. – Maybe decorate your site to suit the holiday theme.
49. Interviews – Interview other sites and post the interview on your website. Alternatively get interviewed by other sites yourself.
50. Selling your site? – Pretend to sell your website. I sold a site recently and the traffic shot up. If you can list your site free then you have nothing to lose apart from responding to offers. However the chances of any of the traffic you received returning is slim. You may benefit from padding out your MyBlogLog section.
51. Surveys – Have a survey or poll on your website, not large, just a small one in the sidebar somewhere that allows visitors to vote on a controversial question or something that will change on your website depending on a vote.
52. Blog Networks – Create a blog network where you can link all your blogs together. This will take up a lot of your time, however if you have it spare the more the better providing the content is unique and remains at a high standard.
53. Create a Site Template or Blog Theme – As the title states, create a theme and have a link back to your website in the footer. 
54. Plugins / scripts – If you have the knowhow, create a plug-in or script for a website and have a link back to your website.
55. Comedy Writing – If you can write funny content, this will attract lots of readers. I know I have returned to a blog in the past due to its humour.
56. Social Networking Site – Use social networking websites such as MySpace, gain lots of friends and then post a bulletin about your website.
57. Reviewing – If you are honest and able to post great reviews then review sites and products and post about them on your website. If this is successful then other sites will want to be reviewed by you.
58. Get Reviews – Go to other sites and ask them to review your website. No one like’s criticism so be prepared to take some. It is likely to benefit your site in the future though.
59. Post News – Try and be first to post breaking news in your niche. Get listed on news websites such as Google News which will increase your traffic.
60. Awards Program – Create an awards brand. Get webmasters to submit their site and you offer prizes or just a graphic that states they won or passed your tests for a great website. Use your imagination.
61. Resources – Write posts that link to resources that may be useful to your type of reader. A webmaster blog may link to free stock photo sites as a post and list them in order of best first.
62. Treat others as you wish to be treated – This speaks for itself. If a reader of yours needs a hand then take the time out to help them. They will appreciate you for it.
63. Edit Posts – Go back over old content on your website and update it if it needs updating. Insert relevant links into old pages that go to content that is similar.
64. Yahoo Answers – Get an account at Yahoo Answers and post your blog URL in answers where appropriate. Only do this when you have a good reputation and the content is relevant and will actually help the user.
Great! That’s it for this time. If you learned at least one thing from this post it was worth reading!

WordPress Tutorials/Hacks

2:15 pm in Wordpress by vapvarun

WordPress Tutorials/Hacks

1.WordPress Theme Hacks (Source: Web Designer Wall)

2. No More CSS Hacks (Source: Style Gala)

3. Create a Dynamic Sticky (Source: Maxpower)

4. Styling Individual Posts Using the_ID (Source: WP Designer)

5. Show Category Images (Source: JTPratt)

6. Separate WordPress Comments and Trackbacks (Source: Hack WordPress)

7. Customize your WordPress Login (Source: David Airey)

8. Date Image Hack (Source: YugaTech)

9. How to place a login form in the sidebar (Source: WP Designer)

10. WP: KeyBoard Shortcuts (Source: Tip Monkies)

11. Making Better Use of Your Error “404″ Page (Source: Hack WordPress)

12. Customize Your 404 Page (Source: Theme Playground)

13. WordPress accessibility hacks (Source: Bruce Lawson)

14. Reset your Lost WordPress Administrator Password (Source: Village Idiot)

15. The Definitive Guide to Semantic Web Markup for Blogs (Source: Pearsonified)

16. Do-It-Yourself WordPress Hover Menu (Pop-Up) (Source: WP Designer)

17. How to Protect CSS Mods for ANY WordPress Theme (Source: Pearsonified)

18. WP Contact Manager (Source: Design Canopy)

19. WordPress and the custom fields, a overlooked feature (Source: Gate 303)

20. DiggProof your WordPress (Source: Circle Six Blog)

21. WordPress Ajax Commenting revisited (Source: Zeo)

22. Widgetizing Themes (Source: Automattic)

23. Cloaking to Stop Scraping (Source: Plagiarism Today)

24. Server load button for blogs (Source: Jesse Chilcott’s Journal)

25. Giving each WordPress post a thumbnail, and display the thumbnail on the home page(Source: WordPress Garage)

26. How to create overlapping tabs (Source: WP Designer)

27. How to Optimize Your WordPress Title (Source: Hack WordPress)

28. Blocking Your WordPress Categories and Archives From Google (Source: Hack WordPress)

29. Adding An Author Page To Your WordPress Blog (Source: Hack WordPress)

30. Make a Mobile Friendly Version of your Blog with Google Reader (Source: Digital Inspiration)

31. How to Use WordPress as a Membership Directory (Source: WP Designer)

32. How to Format Images for Feed Readers (Source: Pearsonified)

33. Add Del.icio.us Daily Blog Posting To Your WordPress Blog (Source: Hack WordPress)

34. Huge Compilation of WordPress Code (Source: Hack WordPress)

35. 4 Simple ways to Speed up WordPress (Source: WP Candy)

36. WordPress Date Button (Source: WP Designer)

37. Wicked WordPress Archives in One Easy Step! (Source: Pearsonified)

38. Make Yourself Available to Readers with a Contact Form (Source: Hack WordPress)

39. WordPress as a CMS – Content Management System (Source: Graphic Design Blog)

40. Installing Xampp and WordPress (Locally) (Source: Tamba 2)

41. WordPress Category Page Hacks (Source: Jehiah)

42. 3 WordPress Hacks For SE-Friendly Blog Archives (Source: SEO Egghead)

43. Opening Links in New Windows (Source: Ajay)

44. WordPress Thumbnail Size Limit Hack (Source: Lorelle on WordPress)

45. Restore your WordPress Database (Source: Tamba 2)

46. Validating WordPress (Source: WordPress Codex)

47. Backing Up WordPress (Source: Lorelle on WordPress)

48. Moving Your WordPress Blog to a New Directory (Source: Big Biz Blog)

49. Moving Your WordPress Blog to a New Directory (Source: Big Biz Blog)

WordPress Video Tutorials

50. The Best WordPress Plug-ins

51. How to embed YouTube Video in WordPress

52. How to Upgrade WordPress

53. Make Your WordPress Blog Search Engine Friendly

54. WordPress.com – Step-by-Step Tutorial on How to Blog

55. How To Create A Custom WordPress Page Template

56. WordPress tutorial–installing on a local server

57. Recover WordPress Password When You Have Forgotten It

58. WordPress Tutorial – Edit a Sidebar File Using a Text Editor

59. WordPress Tutorial – Make Menus of Links With the Blogroll 2

60. How-to: Use WordPress/PodPress to podcast to iTunes

61. How to Put Adsense on Your WordPress Blog

WordPress Podcasts

62. The WordPress Podcast

63. The WordPress Weekly