Designers and bloggers all face a common goal – we want our visitors to read important site notices, to know about current happenings (giveaways, announcements, etc) or even encourage them to follow/vote for us on various social networks. We want all these to messages to be delivered and at the same time, to be assured that they are not irritated by the way we present it. But how?

You probably have an answer already, or some tricks up your sleeves. But if you don’t, here are some solutions that we’ve come to know of and we are going to share them with you.

In today’s post, we list a couple of unobstructive methods (scripts and services) that allow you to send notifications, or messages to your readers while they visit your website. In our opinon, their scripts are lightweight and their methods, understated and elegant.

Full list after the jump.

1. ViperBar
ViperBar is a unobtrusive notification bar for WordPress sites. It has some pretty amazing features, i.e, real-time analytics, custom bar styling, A/B testing, and much more. On top of that, ViperBar also works with newsletter campaign services like Aweber, Mailchimp and Feedburner. The best news is: it is free.

More: Get ViperBar | Screenshots

2. FooBar
Foobar is a WordPress notification bar that allows you to do all sorts of things. You can create unlimited number of bars, customize it, insert custom HTML, finetune its look and feel via WordPress Admin, and more. Foobar cost $12 and is available at CodeCanyon.

More: Demo | Screenshots | FooBar Reviews

3. Hello Bar
Hello Bar has both free and a paid versions of a notification bar with full-blast features ranging from analytics to A/B testing. The free version limits you to 25 successful click-throughs/month while the paid version, starting from $4.95/month, offers packages from 100 click-throughs to 2500 click-throughs and opens up to an array of advanced features. Hello Bar is a great for budding bloggers to build up their RSS subscribers and Twitter followers.

More: Get Hello Bar | Demo | FAQ

4. Quick Notice
Quick Notice Bar is a free WordPress plugin that displays a row on your WordPress header. It allows you to include almost anything, like site notices and announcements, social network buttons, tweets, titles of the latest posts, just to name a few. It is customizable, and it even supports Google link ads. Quick Notice Bar also has a small arrow button on the right that allows visitors to toggle the bar hide/shown.

More: Get Quick Notice | Demo

5. SimpleReach Slide
SimpleReach Slide takes a different approach. It’s a small rectangular box that slides out from the bottom right when visitors scroll towards the end of the post. It can contain post recommended by you for your readers, or you can also use it to encourage votes. It is pretty efficient to keep readers engaged. SimpleReach works for WordPress, Drupal, Blogger, or even static websites.

More: Get SimpleReach | Documentation | Demo (scroll down to page end)

6. Meebo Toolbar
Meebo Toolbar is perhaps one of the most widely used notification toolbar around the Web. One of its biggest advantage is the ability to allow users to share images and links to various social networks simply by dragging and dropping them. Meebo also allows publishers to participate in their ad revenue program by showing CPM-based ads on the toolbar.

Find out more about Meebo Toolbar and other social network toolbars.

More: Get Meebo Toolbar | Demo | FAQ

7. Digg Digg Floating Icons
Digg Digg is a social plugin for WordPress. It allows you to float a row of social network voting badges/buttons of your choice on your WordPress blog.

Use it to display badges/buttons of almost any social network, e.g, Google+, Facebook, Reddit, Digg, StumbleUpon, just to name a few. You can also manually place icons wherever you want on your website, as long as you are comfortable editing the theme’s codes.

One small tip though – if you’re using a floating bar, it may be better to fix its position than to allow it to scroll. A floating bar that moves along with page scrolling can be irritating to some readers.

More: Get Digg Digg | User Guide

More Unobtrusive Methods
Aside from the toolbars that occupy a portion of the screen, and/or hide upon user clicks, there are other methods to reach out to website visitors or send messages (notifications) across. Here are more alternative user engagement services/methods that I’ve come to know of.

Notif!Er
Notif!er allows you to prompt inline notification wherever you see fit. Use it to notify users when they clicked a button, edited an article, submited a comment, or anything at all.

It is unobtrusive, customizable and it runs on jQuery.

More: Demo | Download

Humane JS
Humane JS is framework independent and allows full customization, as long as you have basic knowledge in Javascript.

It will work on most setups, even on mobile.

More: Demo | Download

Notty
Notty is another option if you want to send a message to your readers without irking them with intrusive popups and slides.

The different thing about Notty is that it only appears when the user allows it to. It appears in an elegant manner and fades away just as elegantly as it came.

More: Demo | Download

Tipped
Tipped is a complete jQuery plugin with its own library that you can use to fully customize advanced notifications.

The demo version is free and has a watermark on it,. You can always have it removed by purchasing a license for as low as 3 Euros.

The good thing about Tipped is that it is fully customizable, you can do almost anything you want with it, from notifying people about new posts to simple on-hover notification.

More: Demo | Download

* * *

Create a Funny Wooden Type Treatment in Photoshop

* * *

3D Layered Text Effect

* * *

Crumpled Paper Textured 3D Text Effect In Photoshop CS5

* * *

Fantasy Spring Text Effect

* * *

Create Typography That’s Going Down the Drain

* * *

Colorful Retro Text Effect

* * *

Create a Realistic Folded Paper Text in Photoshop

* * *

Create an Underwater Typography Scene

* * *

Colorful Candy 3D Text Effect in Photoshop and 3D Studio Max Tutorial

* * *

Blossom Text Effect

* * *

Designed Stylish Embossed Text with Metallic Glow

* * *

Lace Stroke Text Effect

* * *

Cool Text Effect with the Puppet Warp Tool in Photoshop CS5

* * *

Create Colorful Ornamental Text Photoshop Tutorial

* * *

How to Create an Incredible Typographic Illustration

* * *

Colorful Plexi Text Effect using Photoshop

* * *

Recreate the Epic 80′s Metal Text Effect in Photoshop

* * *

Create Eye-Catching 3D Tech-Style Text Effect

* * *

Simple Fireflies Text Effect

* * *

Create a CMYK 3D Text Effect in Photoshop and 3D Studio Max

* * *

Design a Skin-Textured Typography Scene in Photoshop

* * *

Create Super Glossy 3D Typography in Illustrator and Photoshop

* * *

Banana Style Text Effect

* * *

Text in Stitches

* * *

Create a Distressed Vector Typographic Poster Design

* * *

Create Light Painted Typography From Scratch in Photoshop

* * *

Honey Bubbles Text Effect

* * *

Creating Retro Folded Typography Using Photoshop

* * *

Elegant 3D Text Effect in Photoshop

* * *

Create a Stunning Text on Wild Fire Effect

* * *

Jungle 3D Text in Photoshop

* * *

Extremely Glossy and Shiny Text Effect

* * *

Underwater 3D Text Effect in Photoshop

* * *

Create Abstract Shining Text Effect with Groovy Font in Photoshop

* * *

Create an Extruded Glossy 3D Text Effect in Photoshop

* * *

Honey Leaking Effect on the Delicious Pancake

* * *

Create A Dynamic Shattering Text Effect

* * *

How to Create the Aura Text Effect

* * *

Make Illustrious Type Using Airbrushing Techniques

* * *

Circles Text Effect

* * *

How to Create a Mysterious Poster Design with 3D Text

* * *

Glowing Polkadots Text Effect

* * *

Stone Text Effect

* * *

Snake Skin Text Effect in Photoshop

* * *

Leather Text Effect

* * *

Create Gold Ornamental Text in Photoshop

* * *

Photoshop Smoke Text Tutorial in 10 Minutes

* * *

Sparkling Text Effect

* * *

Learn to Create Party Text Effect

via: 50 Carefully Selected Photoshop Text Effect Tutorials | Template Monster Blog.

9GAG – Paper Planes!.

While designing web sites, it’s necessary to have a good toolset. Not only it will save you time, it will also give inspiration to create better site projects. In this post i will list you really useful free online tools you can use, to speed up your web design aspects.

Lorem Ipsum & Text Art Tools

1. Lorem Ipsum Generator

You can use this tool to generate lorem ipsum text for your template & theme design works. It is surely better than repetitive text.

2. Text Ascii Art Generator

This tool generates ASCII art for any text you choose. Could be used for a source signature like tumblr.

3. Mixed word art generator

With this free tool you can generate awesome & catchy text art for your sites.

Online Color Pickers & Color Scheme Generators

4. Kuler by Adobe:

Powered by adobe (R), kuler allows you to create custom color schemes to save & export to photoshop and various design tools. You can also visit this site for some colorful inspirations.

5. Color Scheme Designer:

This simple tools automatically picks generates various schemes for any color you choose. It allows you to pick a light or dark scheme.

6. Color Trends + Palettes :: COLOURlovers

This site gives you some inspiration about the colors to choose while designing your sites. Its web design tab includes custom colors and also color sets that users create for their designs. You should check out popular colors to get a fresh new look!

7. Ultimate CSS 3 Gradient Generator

This great tool creates awesome CSS Gradients you can use as your page background, button background and even content backgrounds. No image is needed, just css gradients makin’ your life easier.

Online Background & Pattern Generators

8. Pattern4u – Classic | Kollermedia.at

This site is a collection of all types of background patterns. You can find various types patterns like classic wallpapers, stripes, even grass, wood & chocolate! Great collection so check it out!

9. PatternCooler

This site gives you options to change pattern colors & size before using it on your site. It has a lot of funky backgrounds you can use with your music blogs, funny sites etc. It’s a little hard to navigate between steps though.

10. Stripemania – Striped background generator

A useful striped background generator allows you to add gradient stripes, change orientation and size of stripes. Makes awesome backgrounds for design specific blogs and gaming sites.

11. Dotted Background Generator

12. Tartan Designer – Tartan Maker – Tartan Background pattern generator

13. Stripe Generator – ajax diagonal stripes background designer

CSS grid systems, CSS edit & fix tools

14. 960 Grid System

This grid system allows you create awesome site layouts just using css classes. You can use custom shortcodes and this css framework together to create awesome startup pages for your blog. It is easy to implement and learn. If you are tired of setting widths and heights just give it a try.

15. Blueprint CSS

This is another awesome grid system comes with other usefull css source like print styles, forms & button interfaces, and even typography styles!

16. The Grid System

17. Free Online CSS Compressor

Your site load takes too much? Use this tool to compress your css files.

18. ie6fixer – onderhond.com

A great tool for fixing IE6 errors on your site. Thanks to onderhond for this great tool.

19. CSS Splitter

A css splitter to split your css files into layout and color scheme. You can easily modify your color schemes afterwards to create multi-scheme themes.

Icon converters, favicon generators & icon libraries

20. ConvertIcon!

You can use this awesome tool to convert any image file to icon files. It creates multiple sizes and allows you to create an icon library with great ease.

21. FavIcon from Pics

Create favicon for your site using any image, photo and even animated gif files. It also takes your facebook avatar to create a favicon for your site!

22. E-Mail Icon Generator

Create an e-mail address image to use on your site safely. Helps you prevent spam in your inbox.

23. Iconfinder | Search and download free icons

Awesome online icon library, browse through free icons to use on your site projects.

Preloader generators

24.  Ajax Loading Gif Generator

Using this tool you can create your own style ajax loading images. It is so easy to follow up.

25. Preloaders.net

Just another loading image generator.

Other tools

26. font-family.com

27. Box Shadows

28. Postable

This tool converts special chars to their html alternatives. Can be used while posting codes on your site.

29. Hillbilly random text generator

Another powerful text generator. This tool has some extraordinary text generation options like Greek, Pseudo German, Hillbilly, Metropolitan. You can choose which suits best for your site content.

via 25+ Free Online Web Design Tools You Should Bookmark – Featured | shailan.