Web developers often struggles with different environments – local, production, performance test environment, etc. To make things more difficult, we’re usually taking care about multiple web sites.

This simple tool helps you out to change hosts quickly – by overwriting your C:WindowsSystem32driversetchosts file (which is serving as first level dns proxy) by set of predefined hosts.

Download

Web Storage is more secure and faster than cookies. The data is not included with every server request, but used only when asked for. It is also possible to store large amounts of data, without affecting the website’s performance.
The data is stored in key/value pairs, and a web page can only access data stored by itself.

The localStorage Object

The localStorage object stores the data with no expiration date. The data will not be deleted when the browser is closed, and will be available the next day, week, or year.

localStorage.name = 'Luca';
alert(localStorage.name);

Tip: Key/value pairs are always stored as strings. Remember to convert them to another format when needed.

The sessionStorage Object

The sessionStorage object is equal to the localStorage object, except that it stores the data for only one session. The data is deleted when the user closes the browser window.

sessionStorage.name = 'Luca';
alert(sessionStorage.name);

Browsers

Web storage is supported in:

• Firefox
• Opera
• Chrome
• Safari
• Internet Explorer 8+

Note: Internet Explorer 7 and earlier versions, do not support web storage.

W3C Web Storage

I’ve been thinking a lot about my linking strategy lately. Trying to get incoming backlinks, making sure I have good inner links…
But one area that I think is too often overlooked is outbound links.

I found this interesting article about linking and how to improve your Google rank. How in these years the web has changed and how search engines manages incoming links and backlinks.

Read article

Placehold.it it’s a quick and simple image placeholder service.

How it works

Just put your image size after their URL and you’ll get a placeholder:

URL:

http://placehold.it/350x150

Code:

<img src="http://placehold.it/350x150" alt="Alternative" title="Title" />

Enjoy it!

Enjoy it

About

Here is a quote from Google Webmaster Tool help website:

The HTML5 microdata specification is a way to label content to describe a specific type of information. Each information type describes a specific type of item, such as a person, and event, or a review. For example, an event has the properties venue, starting time, name, and category.

Microdata uses simple attributes in HTML tags (often <span> or <div>) to assign brief and descriptive names to items and properties. Here’s an example of a short HTML block showing basic contact information for Bob Smith.

Examples

Standard HTML:

<section>
	<p>I was born the 28th September 1989 in Switzerland, I live in Bellinzona and I'm web developer.<br />
My hobbies are metal music, movies, web development and I play electric guitar. 
I play from several years and I also had designed my personal guitar picks.</p>
</section>

With microdata:

<section itemscope itemtype="http://schema.org/Person">
	<p>
		I was born the <span itemprop="birthDate">28th September 1989</span> in 
		<span itemprop="address" itemscope itemtype="http://schema.org/PostalAddress">
			<span itemprop="addressCountry">Switzerland</span>, I live in 
			<span itemprop="addressLocality">Bellinzona</span>
		</span> and I'm <span itemprop="jobTitle">web developer</span>.<br />
		My hobbies are metal music, movies, web development and I play electric guitar. 
		I play from several years and I also had designed my personal guitar picks.							
	</p>
</section>

Result:

{
  "items": [
    {
      "type": [
        "http://schema.org/Person"
      ],
      "properties": {
        "birthDate": [
          "28th September 1989"
        ],
        "address": [
          {
            "type": [
              "http://schema.org/PostalAddress"
            ],
            "properties": {
              "addressCountry": [
                "Switzerland"
              ],
              "addressLocality": [
                "Bellinzona"
              ]
            }
          }
        ],
        "jobTitle": [
          "web developer"
        ]
      }
    }
  ]
}

How it works

In the first line, itemscope indicates that the content in the <div> is an item. itemtype="http://schema.org/Person indicates that the item is a Person. Each property of the Person item is identified with the itemprop attribute.
For example, itemprop="name" describes the person’s name.

About microdata – Webmaster Tools Help.

Features

• easy to get started
• customizable and skinnable
• lightweight (only 8KB minified and Gzipped)
• free and open source
• free plugins available
• multi-codec, cross-browser and cross-platform
• good documentation and getting started guide

Media Support

• HTML5: mp3, mp4 (AAC/H.264), ogg (Vorbis/Theora), webm (Vorbis/VP8), wav
• Flash: mp3, mp4 (AAC/H.264), flv

Demos

• Video player
• Audio player
• Circle player
• Video playlist player
• more demo…

Download source

Badge

You can add a free icon to your website that shows your PageRanks:

PageRank – WikiPedia

If you have two or more monitors, then Windows only puts the task bar at the bottom of one of those monitors, and although you can move windows to the second monitor, the task bar button for those windows still lives at the bottom of the primary monitor. This doesn’t “feel” right to me, so ZBar was born.

Download (126kb)