15 Tutorials To Help You Build WordPress Themes

WordPress is one of the most popular applications in the web design community not only for its ease of use as a blogging platform, but for its versatility in any kind of content managed website. Building custom themes for WordPress is pretty straight forward, making it one of the easiest templating systems to master. This post rounds up 15 of the best WordPress theme tutorials, each taking you through the process of building your own WP theme from scratch.

How To Create a WordPress Theme: The Ultimate WordPress Theme Tutorial

This thorough 11 part tutorial series takes you through every detail of creating your own WordPress theme from scratch. The series begins with a look at the structure of a WordPress theme before taking a close look at each of the various template files.

Read more on 15 Tutorials To Help You Build WordPress Themes

Read More...

Facebook Timeline Cover : Creative Examples

Just if you didn’t know, Facebook Timeline is the latest feature that was introduced in the recent Facebook Conference, F8. It’s generally a complete overhaul of the profile page with the new ability to view your status updates in a list sorted by time, hence the name.

With this new feature comes a new way of introducing yourself though graphic other than profile photo, and we call it Timeline Cover. And yes, what you can expect is thousands of facebookers try to be creative with their new timeline cover, spawning the hype all over the web.

In this showcase we’re gonna show you 40 awesome and creative timeline covers which either inspire you, amaze you or just make you burst out into laughter.

Read more on Facebook Timeline Cover : Creative Examples

Read More...

Facebook Timeline Design using JQuery and CSS

I know what my readers are expecting from DesignBomb blog, after long time I'm going to discuss about jQuery usage. Facebook timeline design makes big revolution in social networking world and it gives new feel to the user profile pages. In this post i explain how easy & simple it is to create facebook timeline using jQuery and CSS. Try this demo with modern browsers like Chrome, Firefox and Safari (IE is dead).

Live Demo

Read more on Facebook Timeline Design using JQuery and CSS

Read More...

Resizer: A Responsive Design Bookmarklet

Resizer allows you to quickly change the dimensions of a webpage to test responsive design.

Source Website

Read More...

Tinycon: A Small Library for Manipulating the Favicon

Tinycon allows the addition of alert bubbles and changing the favicon image. Tinycon gracefully falls back to a number in title approach for browsers that don’t support canvas or dynamic favicons.

Alerts in the favicon allow users to pin a tab and easily see if their attention is needed.

Demo & Source Website

Read More...

Wonderflux – The advanced open source framework for WordPress

Wonderflux has been built from the ground-up to take advantage of WordPress 3.0 and above. It allows you to rapidly develop highly sophisticated, custom WordPress themes with just a handful of files (minimum is just style.css) using the principle of a Child theme.

Wonderflux supports all the latest and greatest WordPress functionality to deliver unparalleled design opportunities for both new and experienced WordPress designers. It's a solid, easy to update, flexible platform you can use for any WordPress website.

---

Homepage: http://wonderflux.com Docs: http://wonderflux.com/guide/ Google Code: http://code.google.com/p/wonderflux-framework/

---

Read More...

Type Effects and Modification

Understanding type modifications can help designers focus on readability for chunks of type or a hint of flair for a more artistic approach.

Setting type effectively in any project requires a little more thought than just selecting a font and point size. The way the letters relate to each other can be just as important of a consideration.

Type can be manipulated to be shorter or wider, have large gaps or lack thereof between letters, and have lines with varying depths of space between them. Each of these attributes affect the readability of a project and whether certain modifications work for your project or not can hinge on the message you are trying to convey.

Take time to play with various type options before settling on a final selection with each type driven project.

Read more on Type Effects and Modification

Read More...

3D Gallery with CSS3 and jQuery

Today, we want to share an experimental 3D gallery with you that uses CSS 3D transforms.

With 3D transforms, we can make simple elements more interesting by setting them into three dimensional space. Together with CSS transitions, these elements can be moved in 3D space and create a realistic effect. Today, we want to share an experimental 3D gallery with you that uses CSS 3D transforms.

The main idea is to create a circular gallery where we have an image in the center and two on the sides. Since we are using perspective, the two lateral images will appear three dimensional when we rotate them.

View Demo & Downloads

Read more on 3D Gallery with CSS3 and jQuery

Read More...

Bear CSS – Helping you Build a Solid Stylesheet Foundation based on your Markup

Bear CSS is a handy little tool for web designers. It generates a CSS template containing all the HTML elements, classes & IDs defined in your markup.

Source Website

Read More...

A Multi-Directional Hover Effect in CSS

A Multi-Directional Hover Effect in CSS.

Demo & Download

Read More...

Designing Microsites: Factors To Consider

When creating a website, so many things need to be planned and considered before even beginning the design — content, audience, goals, usability, color schemes, and so much more.

The design of a microsite, on the other hand, would seem to be an easier task to execute. But this isn’t always the case.

A microsite will sometimes have more sensitive issues to deal with, and could see just as many design iterations — possibly due to branding issues, or a host of other factors that arise due to company politics.

Because of the vast array of possibilities for designs of microsites, there really is no way to properly define any “best practices” in this area of web design.

Certainly many of the same habits and practices would apply (valid code, progressive enhancement, usability, etc.). So, while I’ll be refraining from making any definite statements here, I think it would be valuable to consider the different ways to approach the design of a microsite, discussing some of the potential benefits and drawbacks to each one.

Read more on Designing Microsites: Factors To Consider

Read More...

CSS3 breadcrumbs

A breadcrumb navigation allow users to know where they are in a hierarchical structure and navigate back to higher-level pages in the hierarchy. Also, the breadcrumbs can reduce the number of actions a user need to perform in order to navigate back. Today you’ll learn how to create your own cool CSS3 breadcrumbs.

View Demo

Read more on CSS3 breadcrumbs

Read More...

Turn.js: The Awesome Paper-Flip Like Effect made for HTML5

Turn.js is a plugin for jQuery that adds a beautiful transition similar to real pages in a book or magazine for HTML5.

Features

• Uses Hardware acceleration
• Works on tablets and smart phones
• Easy to manipulate
• Lightweight, only 15K

Demo & Source of the website

Read More...

35 Best Free HTML5 and CSS3 Templates

HTML5 and CSS3 are hottest topics among for web developers. HTML5 and CSS3 templates are another stepping stone to make the web experience more enjoyable and grafting. Coming up with all browsers are compatible with all HTML5 and CSS3 functionality and features. In web development, it’s important to move with the times and embrace the latest changes.

There have been dramatically changed HTML to HTML5 and CSS to CSS3. Some of us however don’t have the time to code our sites in HTML5 formats. There have been best HTM5 and CSS3 templates developed. So, we have collected some 35 best Free HTML5 Website Templates for you.

If you like This article, Do folow us on Twitter.

ElegantPress

( Demo || Download )

Touch The Future

( Demo || Download )

Read more on 35 Best Free HTML5 and CSS3 Templates

Read More...

Top 50 Free Online Web Apps For Designers and Developers

Designing and maintaining a website is not an easy task and it requires a lot of time, that is the reason designers and developers are always lookig for apps that can help make their work easy and quick. Many web apps are present out there, but not all of them are good.

So today we have a list of some web apps, that will definitely prove to be helpful for you. Those web apps include designers and developers toolbox, webmasters tools, developer toolbar and apps to create comprehensively designed charts, diagrams and flowcharts, as charts and graphs are a great way of representing information. We also have a list of awesome apps that will help you know what the error you encountered means and apps that let you test site loading time testers, optimization testers, site comparison tools, and performance tools of any web page. Check them out and pick the one that suits your needs that best.

Read more on Top 50 Free Online Web Apps For Designers and Developers

Read More...

How to create animated tooltips with CSS3

In today’s tip we’ll show you how to create some simple, animated tooltips using CSS transitions and the pseudo-classes :before and :after.

The idea is to have a list with links or in our case, social icons, that reveal a little tooltip on hover.

View Demo

Read more on How to create animated tooltips with CSS3

Read More...

An Introduction to jQuery for Designers

I found approaching jQuery to be an intimidating experience because I’m not a developer. Implementing JavaScript was what “they” did on the back-​​end of a website, but had little to do with my process when creating a design for a website.

But as a designer, I need to know the full range of options — and limitations — I have at my disposal when building a design for a client. jQuery presents some amazing options for design. If I want to be at the top of my field, I felt I needed to push myself out of my box and learn what the heck this whole jQuery thing is all about.

Read more on An Introduction to jQuery for Designers

Read More...