Scalable images have become a lot more popular in recent years. As modern browsers slowly accept the notion of SVG images we can see many techniques being released out on the web. These range from scalable responsive logos to animated line drawings – all through the use of dynamically-generated images.
This collection of tutorials should be more than enough to get you all caught up to speed with the latest trends. Even if you know absolutely nothing about SVG images or how they’re created, these articles should provide insight along with a few industry tips & tricks. SVG resources appear to be a growing solution amongst web designers. Take a look over this showcase to understand what all the fuss is about.
Today I wanted to share with you a quick and easy way to building a countdown landing page with a simple email sign up form.
To complete this demo I will be using a jQuery plugin called FlipClock.js to power the countdown clock and MailChimp to power the email sign up form.
View The Demo or Download Source Code.
Web development tutorials often cater towards beginner starting topics. However there are plenty of intermediate-to-advanced level tutorials focused on complex development techniques. Even people with years of practice may one day look towards an online tutorial to educate themselves on an unfamiliar topic.
In this gallery I’ve put together a handful of brilliant tutorials related to designing and coding a personal portfolio. You can find help on HTML/CSS, jQuery, and Photoshop design mockups. Some articles will be pretty simple while others get into the more nitty-gritty details. Take a look over these headlines and see if there’s anything you may want to learn about.
Many newer social media communities and web applications are pushing the boundaries of interface design. Form inputs have changed a lot over just the past 4-5 years. One such feature is the tag select input field, where users can enter tags which appear as block items within the field itself.
For this tutorial I want to demonstrate how we can build this effect to be used in any website. To save time I’ll be using the jQuery Tags Input Plugin which is free and open source to use on any project. I prefer this plugin over some others because of the many parameters and options for customizing the experience. Take a peek at my live demo to see what we will be creating.
WordPress has become one of the most popular open source blogging systems around and keeps getting better & better. It is a great content management system, not because big sites like Mashable use it, but because of its community which is always ready to help you without wanting anything in return.
Not just that, there are a number of useful WordPress resource sites that offer extensive tutorials & WordPress-related content. In this post I’m going to share top 8 best WordPress resource sites. I have tried to collect the best resources, but there are too many high quality sources to list them all.
When developing premium WordPress themes and plugins it is essential that you build them with localization as standard, this allows the theme user to easily translate their WordPress themes so that the theme can be used by all languages.
In todays tutorial I wanted to show you how to add translation and localization support to a WordPress theme and how you can easily create the translation .po and .mo files.
Looking back 5 or 10 years ago the process of designing website buttons was very tedious. CSS could handle a lot of the outer edges, but gradient backgrounds and icons required static images. And these newer design trends are still at the cusp of innovation. This means you will find plenty of modern websites still using images in place of CSS3 effects.
I want to focus this tutorial on the power of CSS3 icon fonts for designing user interfaces. We will be creating some generic CSS3 buttons with added icons for design aesthetics. However the icons will not be loaded from static images or sprite sheets. Instead we will be using the Entypo icons font for generating pictograms inside your website layout.