One of the visible traits in web 2.0 rich websites are either their logo, domain name or images i.e. they have some reflection better understood as mirror reflections or shadows at bottom (most of them having written ‘Beta’ alongside or superscript). This something like I did with IndianWeb2.com logo and image of a flower below;

This is better known as “Web 2.0 Style” Images and Fonts and to make a normal images or a text into this web2-style images/ text, tutorials are available as how to add reflections/ make mirror images with or without Adobe Photoshop.

TOOLS -

There are some tools to get Web20 style images in an instant and one of my favorite is – Reflectomatic, here you just give a URL of image and it will make a reflection to it just like web20 image/ logo, you can even adjust opacity, height of reflection and scale image. Others tools/ web20 logo creator are;
- Web2.0 Logo Creator by ALex P
- Web 2.0 Stylr

- Web2.0 Logo Creator
- Web2.0 text/ Logo generator

USING ADOBE PHOTOSHOP -

Adobe Photoshop can also be handy in making Web20-style images and texts without much hassle, core part is making duplicate of image/ text and flip it vertically and here you are with a Web2.0 style image or your own text. Some of resource and tuotorials are;

- Reflecting text and Images – Photoshop Tutorial
(nice tutorial with descriptive snapshot)
- How to create Faux Reflections in Photoshop
- Video Tutorial (How to make web 2.0 Style Logo)

WITHOUT USING PHOTOSHOP (using JavaScript)-

If you want to add this web 2.0 style in all of your website and don’t want to spend time in image editors, you can use JavaScript, integrate/ upload into your website and just add class=”reflect” to add that Web 2.0 style in images. The JS for same is at – Reflection.js,
(More at – http://cow.neondragon.net/stuff/reflection/)

VIDEO TUTORIAL –
Via – Alleba Blog