Follow by Email

Monday, February 27, 2012

Top 10 Web Design Trends - 2012

Web design trends keep changing every year. Adding on the prevalent design and working out some new innovation is the need of the hour. Though some of the web design trends being followed in 2011 will be carried over, new additions are in the offering. Below are listed some of the web design trends that will gain popularity in 2012.

1) Getting mobile compatible

Over the last few years, minimalistic designs have gained immense popularity. This trend is expected to be carried over to 2012. The findings of a research study conducted reveled that over 1/5th of the web searches intended to be carried out will be done through mobile devices this year. Making the websites mobile compatible is the need of the hour and will help bring exponential growth in business.

2) Demise of Flash and emergence of HTML5

Flash used to be extremely popular till late. Adobe recently announced its policy changes that will have a significant effect on usage of flash, when it comes to mobile web use. Keeping these changes in mind, websites have started switching over to CSS3, JQuery and HTML5.

The interactivity of flash has no equals though, but 2012 will still see emergence of CSS3, JQuery and HTML5. Real time communication and multimedia support are some of the innovative features of the emerging technology that will propel its growth in 2012.

3) Emergence of 3D technology

Visually rich applications appeal to all. 2012 will see emergence of 3D technology thereby making the desktop more attractive. Increasing number of websites is working on devising 3D effects ranging from shadows to textures. Visually interactive applications are in the pipeline and 2012 will see emergence of some of these. This can be in form of graphics and interactive layouts that is sure to take web design trends to a higher level.

4) Interactive Typography

Use of creative fonts is being discussed in business circles and many websites are in the process of mixing fonts to come up with a masterpiece that is sure to make web more interactive. CSS3 has come as a boon in this endeavor of making web interactive. It allows free typography making the work of designers easy. Expect to see interactive typography techniques in 2012.

5) Making it big

Designers are thinking differently. Expect to see innovative headings, huge icons and designer logos. The idea is to make a lasting impression on the visitor. Creating an impression with the user seems to rule the mind of the web designers.

6) Interactive additions

Interactive additions in form of modal window are in the offering. This helps in adding inputs without the need of leaving the page. Login boxes and registration screens are sure to benefit from this innovative addition. This will not only save precious time of the users but will also ensure that web gets a creative look.

7) Hybrid layouts

2012 will see the use of hybrid layout technology. In this some aspects as text will be of fixed width making the other elements fluid. This is sure to give the screen a comprehensive look, without any inch of the monitor being wasted. Hybrid layouts will give the web a distinct character and make the web livelier.

8) Bright colors and fluid backgrounds

White or black backgrounds will be a talk of the past. Expect to see expandable backgrounds with bright colors. Bright colors will not only add life to the web but will also give the web world a raw an innovative look.

9) Compact information

Single page layout will be a great addition in 2012. All the required information will be compacted in a single page layout giving the web, an aesthetic touch. Precious time of the web user will be saved, as all the essential information will be available in a single page.

10) Social media

Social media sites as Facebook and Twitter will see increased presence on all web formats in 2012. This will not only make sharing information easier but will also bring increased web traffic to the site.

Evolution of new web design trends is a continuous process and 2012 will see emergence of new technology that is sure to bring a revolution in the web world.


Wednesday, February 15, 2012

WordPress for Android – A New Launch

WordPress for Android is pleased to announce their new launch of an innovative product that posts, edits and manages comments on your WordPress blog-site. Version 2.0 presents a new and exciting Dashboard UI with Quick Action bar.

These features offer an impressive new editor that makes for easy editing than ever. WordPress for Android supports self-hosted WordPress 3.0 and higher blogs and This is truly an exciting launch that WordPress and Android have been more than happy to present to the world.

The Dashboard

You will find everything you need to do locatedin a central location. At first sight you will observe the Dashboard item. You will observe when you start the application that it offers one-tap access to usual features when creating blog posts. You will find the diverse features on the Dashboard that will enhance your blogging needs.

There is a new standard count-ribbon that displays unapproved comments you have waiting for approval. If you want to attach media files, Quick Photo and Video buttons can show you to the camera where you can take pictures of the moment while attaching it to a new blog-post. The Dashboard also provides a new Action Bar that lets you switch quickly between blogs.

The New Editor Features

The post editor has been improved, allowing more power than ever over posting content. The format toolbar can be located on the top of the keyboard. This will allow for rich-text editing and addition of links. You add media content while editing “Titles”, Caption, Placement and Size of images. The editor contains a full-screen, so you can see the text while editing. Post Formats have been added. You will seea menu in the post-editor that lets you select the desired Posting Formats.

The Ready for Tablet

WordPress for Android version 2.0 has been optimized for daily-tablet use. When viewing Pages, Comments and Posts on the Android tablet, you will witness scrollable lists on the left- side of the screen. If you own an Android tablet, you will find that WordPress has it all covered. Special attention has been paid to larger-screen devices with the current market launch.

The What’s new?
  • Version 2.0.4
  • Swedish, Italian, Danish and Bosnian updates
  • Fixes for Post Editor
  • Bug fixes

The Other changes
  • Reliable improvements
  • Post Status can now be found in post-list
  • Improvement of Stats-chart
  • improvements with Read Feature
  • Background post-uploading AD

WordPress for Android has been created as an Open Source project. Various individuals worldwide have contributed to release and proves one-and-all have performed a marvelous job.

WordPress has come a long way with evolving to meet the needs of blog, website owners and business owners. WordPress has revolutionized into a popular tool in helping businesses and companies worldwide. The latest version proves the dedication and hard work that is entailed into software and programs in order to make not only businesses better but the world.

The post is contributed by William Taylor. William calls wordpress as multipurpose piece of software. Its creative concepts have really transformed, the way websites used to be. Visit his site for adsl internet and digital tv.


Tuesday, February 7, 2012

15 Web Design Trends to Watch Out For in 2012

I want to introduce 15 ideas which have grown very rapidly over the past year.

These trends encompass web and graphics design techniques which will likely play a big role moving into 2012. You have probably seen a few of these represented throughout many of your favorite sites online.
Thankfully the methods to implement these features are becoming easier to understand and much slimmer in code.

1. Responsive Interface Design

The average user’s experience is possibly the most important aspect to consider when designing a website. You want page elements to respond quickly to keyboard/mouse input and behave as expected. Some examples may include side fly-out menus, drop-down boxes, and popup windows.
Including famous JavaScript libraries such as MooTools and jQuery, it has become much easier to animate these features and even more. Most modern-day browsers support this code and even gracefully degrade when the scripts aren’t available. Ultimately you want to make the user feel comfortable when interacting with anywhere in the design.
bill gates foundation flyout menu 15 Web Design Trends to Watch Out For in 2012
Similarly you should take form input and data checking into consideration. On many registration pages you’ll receive small responses as you work through each input area. You can automate checking for valid e-mail addresses, duplicate usernames, and even double-check password inputs. This will save time on the user’s end and provides a handy guide throughout the signup process.

2. Touchscreen Mobile Devices

In the past couple of years it has become evident that smartphones are gaining support among even non-tech enthusiasts. But only since 2011 have we seen an explosion of mobile sites and mobile-specific templates.
touch gesture 15 Web Design Trends to Watch Out For in 2012
The popularity of iPhone and iPad devices along with Android-powered phones means you will have visitors fully interacting with your pages through touch commands. This has to become a realistic consideration with every design mockup. Trends in mobile web design have shown that building an entirely separate mobile theme often provides the best results. In this way you can keep all the dynamic content in place on your main layout while serving up a slimmed version of the site to mobile users.

3. Tons of Freebies!

Who can say they honestly don’t enjoy free downloads? Web designers have been sharing their content online for years, but only recently has this become a very popular trend among digital artists. There have been a few communities built specifically around offering free downloads for web and graphic designers.
Two of my personal favorites are Download PSD and Designmoo, both of which get updated frequently by top-quality members. Additionally the Hongkiat Freebies archive has plenty of sweet goodies to check out. In any era before it has literally never been this easy to download free web interfaces, layouts, logos, banners, and practically any other type of PSD/AI file!

Some Neat Downloads

Below are just a few cool freebies to check out from earlier in 2011. And if you think this list has some great files, just wait until 2012 rolls around!

Mini Web UI Set
01 uikit freebie 15 Web Design Trends to Watch Out For in 2012

Dark Mini Music Player
02 dark music player 15 Web Design Trends to Watch Out For in 2012

Sliding Tags
03 sliding tags psd 15 Web Design Trends to Watch Out For in 2012

Dark Photo Slider
04 dark photo slider 15 Web Design Trends to Watch Out For in 2012

Search Boxes
05 search boxes fancy 15 Web Design Trends to Watch Out For in 2012

Login in/Signin Form
06 login form 15 Web Design Trends to Watch Out For in 2012

Login Modal Box
07 login modal box 15 Web Design Trends to Watch Out For in 2012

Clean Login Form
08 clean login form 15 Web Design Trends to Watch Out For in 2012

Pricing Tables
09 pricing tables 15 Web Design Trends to Watch Out For in 2012

Minimal Loading Bars
10 minimal loading bars 15 Web Design Trends to Watch Out For in 2012

Attachment Pop-up
11 attachment popup 15 Web Design Trends to Watch Out For in 2012

4. HTML5 & CSS3 Standards

Both of these new design archetypes have accumulated an ever-growing following throughout 2011. Semantic web designers have been waiting years to churn out CSS-only designs rendering rounded corners and drop shadows. Additionally the W3C has made a lot of headway in garnering support from the most popular browsers.
I can only see good things for the future of HTML5/CSS3 web development. Front-end designers are often overlooked in today’s field, yet they serve such a great importance to the entire composition process. Try not to squeeze yourself into any set ‘label’ based on the techniques you know and practice daily. We offer a beginner’s how-to guide for HTML5/CSS3 coding if you feel the need to catch up.

html5 css3 for web designers 15 Web Design Trends to Watch Out For in 2012
Sticking with these new standards will also make developing in JavaScript and jQuery just that much easier. Developers have already been publishing and sharing their HTML5/CSS3 project code online, and if things continue we’ll surely notice a whole lot more of this going into next year.

5. Ribbons and Banners

Although this design technique isn’t exactly “new” it never truly broke through mainstream until just recently. You have probably seen examples of corner ribbons, banner navigation bars, and small ribbon badges. These trends have likely exploded because of the massive accumulation of detailed tutorials which can be found all through Google.

ruby robots banner 15 Web Design Trends to Watch Out For in 2012

Web designers are more competent these days in launching their own blogs to share information. Now simple techniques can easily be passed around between designers to duplicate the most popular effects. There are even free PSDs you can download to save yourself the effort.

6. Premium WordPress Themes

The final release of WordPress 3.0 included a host of long-awaited features such as custom post types and unique article images. Yet the most profound changes I have seen are coming from WordPress development shops which specialize in premium WP themes.

woothemes membership home page 15 Web Design Trends to Watch Out For in 2012

After you purchase such a theme the installation process is similar to any other. Yet it’s now possible to include custom plug-in functionality, child themes, new admin menus, and a whole bunch of other features right from within the theme! WooThemes, ElegantThemes and Rocket Themes are few brands which stand out to me above all the rest. Their quality is impeccable and I feel their developers go above-and-beyond to create the best templates and most intuitive admin menus.
Going into 2012 I can only imagine WordPress will become even easier to use. This means more high-quality themes to be released, and more amazing blogs to be launched.

7. Online Magazines

Speaking about WordPress themes we should also bring up the quickly-adopted success of online magazines. These websites are not so different from any generic WordPress blog aside from the general structure and page layout. You can spot these larger mags by the sheer presentation of their home page, and collection of authors writing for the site.

mashable online magazine layout 15 Web Design Trends to Watch Out For in 2012

As magazines begin moving online they will become a source of income for many writers. Granted a topic such as ‘web design’ targets a smaller niche than, say, gaming or economics. But the fact that we’re seeing more design magazines online than print goes to show where the world may be heading in the years to come.

8. Easy Drop Shadows

As a facet of CSS3 it’s now easier than ever for designers to implement a drop shadow anywhere on the page. Box text and box-style elements have been given respective properties to render clear-cut shadow effects.
The text-shadow syntax is very easy to memorize and follows along as box-shadow. With images now unnecessary in rendering these effects, web developers can focus on expanding these basic ideas further. I personally love Matt Hamm’s page curls which were developed entirely with CSS3. You can find all the code on his website to duplicate the effect and implement a similar style onto your own pages.

9. Dynamic Typography

Fonts are a big part of the sphere encompassing web design tradition. The most notable fonts including Arial, Helvetica, Georgia, and Trebuchet MS have been around for years now. Although they continue to serve a deep purpose in web standards, there are plenty of alternate options for advanced webpage typography.
Typekit for example only requires a couple lines of code to be included in your document head. After this you can specify which font names to include and append them into your CSS. The best part about this technique is that it relies mostly on JavaScript, so the end user isn’t required to have the fonts installed.

google web fonts display 15 Web Design Trends to Watch Out For in 2012

Another alternative is Google Web Fonts which behaves in a similar manner to Typekit. I recommend interested designers to check out CSS3′s @font-face media query, as you are given much more creativity. This code can be used to import a .ttf or .otf font file from your web server and include it as a usable stylesheet font! With so many alternate systems used for building dynamic fonts I’m expecting 2012 to hold a surge of innovation and design talent in this area.

10. Image Gallery Slideshows

With the subsequent popularity of jQuery I have spotted more and more image slideshows being dropped into web layouts. Galleries are perfect for demonstrating a quick glimpse of inner-page content. This could be a set of portfolio entries, photographs, blog posts with featured images, demo screenshots, etc.

hello themes magneto slideshow 15 Web Design Trends to Watch Out For in 2012

When you consider the many unique sliding and fading animations it has never been easier to construct a quick slideshow for your home page. I’m confident that 2012 will see an uptick in these trends, and not just between designers. Online web applications and software companies have been using slideshows as guided tutorials to display screenshots and unique features.

11. Modal Popup Boxes

I feel that modal boxes are still fairly new to the Internet considering they’ve been appearing in desktop software and mobile apps for years. The purpose of a modal window is to offer box content(such as user registration or login) on top of the current page without loading onto a new one.

digg login form modal 15 Web Design Trends to Watch Out For in 2012

Many of the open-source image gallery scripts use a type of lightbox effect where the background fades darker than the popup box. I really enjoy this feature whenever I see it, although it has yet to be adopted by many. And although modal boxes are sexy and sleek, they can also be very difficult to code and get working properly.

googleplus modal popup box 15 Web Design Trends to Watch Out For in 2012

To get ideas for your own websites check out some of the more popular social news sharing communities. Reddit and Digg are the first two which come to mind as they both feature register/login modal boxes with a typical layout. Additionally the UI effects for Google+ boast a considerable amount of modal functionality.

12. Inspirational Lists

Collections of list items have appeared since the very early days of web design. As we moved into the new century designers began using HTML ordered and unordered lists to house navigation menus. But nowadays lists can and are being used for much more.

flowapp lists todo format 15 Web Design Trends to Watch Out For in 2012

In most of the blog themes I find the entire sidebar is loaded with lists! Not to mention designers who have crafted awesome CSS styles for lists in their article entries. We covered inspiring list styles in another post earlier this year which may give you some more insight to the matter. Looking forward into 2012 I’m expecting some really creative examples, possibly on par with Flowapp’s custom layout for tasks & to-dos.

13. Generated Image Thumbnails

In the web universe we can agree that content is king. But most designers will also agree that a page of blank text becomes boring real quickly. Images can add that extra spice if you know how to sprinkle them in gently. One such method is using dynamic thumbnails to provide previews for each page or article.
Blogs today are continuing to adopt the featured image trend, so why not apply generated thumbnails into your theme as well? These often draw my attention towards the article headline and help to break up a page full of text links.

dribbble screenshot thumbnails 15 Web Design Trends to Watch Out For in 2012

As another example Dribbble provides a whole gallery listing of thumbnails for each design shot. In such a table row-style layout it’s super easy to catch a glimpse of each thumbnail and scroll through to find what you’re looking for. This tactic has proven to grab the attention of the whole design community! Er, at least the members of Dribbble at best. I can only expect that 2012 will see further exertion of these ideas building upon such examples from the past.

14. Oversized Icons

This unique trend semi-originates from the popularity of Mac OS X icon designs. As programmers began to launch websites for their Mac applications we all too frequently have seen the enormous sizes represented in branding. Accordingly this trend has also been picked up through iOS developers and now comfortably rests within modern design culture.

panic transmit app icon 15 Web Design Trends to Watch Out For in 2012

It’s difficult to predict how these trends will fair as we move into 2012. On the one hand these icons can be clunky and take up more space than necessary. Yet we’re not even close to hitting a shortage of iOS/OSX apps and designers are still churning out pixel-perfect icon specs. Not to mention that web designers are now including oversized icons within just about any page branding! It’s a good way to nab your visitor’s direct attention and build a name for your company.

15. Exaggerated Hyperlinks

Anchor links are certainly within the top five most important elements of any website. These have obviously come a long way since the 1990s and popular design trends have only been growing exponentially. It appears we are moving into an era where exaggerated design takes precedence.

simplebits studio links 15 Web Design Trends to Watch Out For in 2012

Check out a few of the link examples from Patterntap to see if any jump out and catch your eye. There are so many incredible ideas for hyperlink design, both in standard and hover effects. CSS3 rounded corners, text shadows, and custom font families add even more great ideas into the mix! One of my favorite examples is from SimpleBits which uses a short dynamic animation on each of their blog entry permalinks.


These ideas are only some of the more popular trends I have noticed gaining precedence throughout 2011. Great web design is always about focus and keeping user intentions as top priority. It’s unlikely these philosophies will differ moving into 2012, but how we build layouts and present data is always in change. Let us know your thoughts or questions in the comments discussion area.


McAfee, Inc

Wednesday, February 1, 2012

A Guide to Mobile Web Design Tips and Tricks

mobile-web-mash Having a mobile-optimized web site can really make your site stand apart from the pack. Even though smartphones like the iPhone and Google Android devices can display “the full web,” having a web page formatted for smaller screens and with features that can take advantage of a touch screen, geolocation, or address book functionality can make the mobile web browsing experience that much better.

Even just a few years ago, optimizing websites for mobile browsers was a painful and difficult process, in part because of the limitations of most mobile browsers. Today, thanks to the proliferation of WebKit (which powers the browsers on the iPhone, Android and webOS devices, with BlackBerry expected to join the mix next year), it’s much easier to decide on a strategy for making your website pop on mobile platforms.

We’ve put together a toolkit of resources for the designer and non-designer alike to get you started. Did we miss your favorite tool or service? Let us know in the comments!

Services for Optimizing Your Content for Mobile Browsers


If you don’t have experience with HTML and CSS (or you don’t have the time), there are a number of services that can create mobile versions of your website for you.

MoFuse and MoFuse Premium — MoFuse has been offering a simple way for bloggers and businesses to easily create mobile versions of their websites for quite some time. For bloggers or smaller sites, the company offers MoFuse for Blogs, which is a free and easy way to quickly mobilize your web site (it uses your RSS feed to generate the new site) whenever it is accessed by going to “” For businesses or larger sites that want a little more control, MoFuse Premium offers more customizable options.

Disclosure: MoFuse powers Mashable’s mobile website.

Mippin — Mippin is another free service that can create a quick mobile version of your website using your RSS feed. The options aren’t extensive, but the version that Mippin creates should be viewable on almost any WAP compatible mobile phone.

mobiSiteGalore — mobiSiteGalore can create quick mobile versions of websites, offers users some customization options, and can take advantage of the .mobi TLD. mobiSiteGalore will let you create your mobile site from a computer or from your phone.

Plugins for WordPress and Other Publishing Systems


Having a WAP-formatted site is fine, but if you want to be able to offer visitors from an iPhone or Android device some really great optimized mobile features, you want to consider creating a separate stylesheet for your website. For users of WordPress and other publishing systems, there are a lot of plugin options available that make adding a mobile theme to your site extremely easy.

WPtouch — WPtouch is a fantastic plugin available for users ( users can also take advantage of WPtouch with the recent addition of mobile themes) that automatically makes your site easy to read and access from an iPhone or Android device.

The plugin is extremely robust and even offers backend features like the ability to set an iPhone Favicon (so that when users add your web page to their iPhone’s home screen, it has a great looking icon), the ability to work with other WordPress plugins like FlickrRSS and, support for AJAX, customized headers, and more. What I really like about WPtouch is that users can choose to turn it off and access the full version of a website at any time by flicking the mobile on/off switch at the bottom of each page.

WordPress Mobile Edition – Crowd Favorite created this plugin that allows users to easily define what type of devices should be shown a mobile web page (and what shouldn’t — for instance if you want BlackBerry users to see your mobile page but you want iPhone users to see the full site) and it comes with Crowd Favorite’s Carrington Mobile Theme which is easy on the eyes and also fully customizable.

WordPress Mobile Pack — The WordPress Mobile Pack is from the dotMobi team and it is a whole suite of tools for mobile web optimization. It includes a base mobile theme, which is very attractive, a mobile admin panel, mobile ad support and the option for visitors to switch between the full and mobile versions of a website.

WPtap — WPtap is a plugin for WordPress, and the site also offers up some alternative themes for users who want a more customized look and feel to add to their sites. WPtap looks very similar to WPtouch, but the emphasis seems to be on offering pre-built mobile styles.

WordPress Mobile by Mobify — This is a plugin for the Mobify service (see description in the next section). It handles automatic redirection of mobile clients to your Mobify mobile view page.

Mobile Plugin for Drupal — Mobile Plugin offers Drupal sites a mobile optimized view, comes with a mobile version of the standard Drupal Garland theme and includes device detection, hooks for adding mobile-specific features and automatic YouTube mobile replacement.

OSMOBI — OSMOBI is a service and plugin for Joomla and Drupal users that makes it easy to customize your blog for mobile visitors. The service is free for 150 page views every day but premium plans are also available.

Tools for Designers


Mobify — Mobify is a really interesting service because it makes it easy for designers or users who know HTML and CSS to painlessly modify and optimize their website for mobile access. The service is free (though paid monthly plans are available for more features) and it works extremely well with systems like WordPress, Drupal, ExpressionEngine and any other system that has predictable URL patterns and well formed HTML.

Mobify has a visual editor that lets you see what your content looks like on different device types and you can then modify the CSS and see the changes in real-time. Some sites that have used Mobify to create mobile optimized versions of their content include A List Apart and revered web developers and designers, such as Jonathan Snook and Veerle Pieters.

iPhoney — iPhoney from Marketcircle gives Mac users a pixel-accurate web browsing environment that is powered by Safari. Why does this matter? Because when crafting the mobile version of your site, it’s important to be able to see how the final product will look on your phone. iPhoney hasn’t been updated in a while but is still a really useful tool.

iWebKit — iWebKit is a framework of sorts for creating iPhone-optimized websites or web apps that can take advantage of the iPhone’s UI elements and other features.

jQTouch — jQTouch is a really innovative jQuery plugin for mobile web development on the iPhone and iPod touch. With it you can create websites or web apps with animations, support for forms, customized UI elements, additional extensions, swipe controls, and more. The developer is really active with the project and some of the stuff you can do with it is amazing.

iPhone Compatible CSS Layouts — Matthew James Taylor created a bunch of liquid CSS layouts that are iPhone and iPod Touch compatible and free for anyone to use. If you’re looking for a starting point for building a mobile optimized site, you might want to give these layouts a look.

Other Resources

Mobile Web Design by Cameron Moll — This is a really great book (available in print or as an ebook) with tips, best practices, and examples on styling and optimizing your site for mobile content. If it suffers from anything it is that it was written before the iPhone explosion really took off, thus it isn’t as up to date as it could be. Still, for mobile web enthusiasts, there’s a lot of great information here.

Craig Hockenbery’s “Put Your Content in My Pocket” — In August of 2007, Craig Hockenberry (from the Iconfactory and one of the brains behind Twitterrific for the Mac and the iPhone) wrote a great article for “A List Apart” and although some of the technologies have evolved, much of what Craig wrote then still applies today. A great read.

Smashing Magazines’s Mobile Design Showcase – Need some inspiration? Smashing Magazine did a great roundup of iPhone optimized designs in September.

CSSiPhone — CSSiPhone is a CSS gallery dedicated to iPhone optimized site designs. Like Picasso said, “Good artists copy, great artists steal!”

Opera Mobile Developer Community — As some of our commenters pointed out, the Opera browser lets you see what a website will look like on a mobile handset by pressing Shift-F11. Also check out Opera’s developer documentation for optimizing pages to be viewed on mobile devices. Opera Mobile and Opera Mini is a common browser on many cellular phones.

Your Thoughts

What do you think about the direction of mobile web development? Do you have any favorite mobile sites or mobile design tips? Let us know! - Best affordable, royalty-free high resolution stock photos and vectors. 25 XXL downloads for $37.50/month.  More plans to choose from. Subscriptions as low as $9.99.