Social share scripts are convenient and easy to copy & paste but rely on JavaScript and add additional overhead to your site, which means more HTTP requests and slower load times. Instead, use share links that don’t require you to load scripts for each social site.

Modern web development is rich with an endless stream of new technologies, frameworks, tools and resources available at our fingertips. With new tools becoming available seemingly every day, it’s easy to dive in and get lost in trying them out, but once you’ve found the right ones, there’s a lot of value in developing consistency and sticking with what works.

From our new daughter, one year at my new job, and my spiritual growth to learning and giving back as a developer, 2014 has been a full, enlightening year. As the year closes, I want to take time to pause, reflect upon, and be thankful for some of its moments.

A few months ago, I launched the redesign of my website. I enabled HTTPS a week later, and since then I’ve noticed a significant increase in organic searches—both impressions and clicks. Impressions went up by 144% and clicks by 94% on HTTPS.

If you’re working with JSON (JavaScript Object Notation) and either need to convert a JSON string to array or object and loop through it or vice-versa, take an array or object and convert it to a JSON string to return, both can be done in PHP or JavaScript.

CSS allows you to create animations with transitions and keyframes that once were only possible with JavaScript or Flash. Unfortunately, with CSS there’s no way to perform a callback when an animation is complete. With JavaScript, it’s possible to detect the end of a CSS transition or animation and then trigger a function.

Animating SVG with CSS is like animating any other element with CSS—it can be done with transitions, transforms, and keyframe animations. Once you’re familiar with the markup of an SVG, the rest is fairly straight forward.

To ensure your images are sharp and crisp on retina-enabled devices, you want to serve images that are twice as large and scale them down appropriately; however, keeping mobile users and their limited speeds and data plans in mind, it’s important to only serve retina images on retina-enabled devices or when necessary.

Here’s a quick-and-easy way to do it with just a few lines of vanilla JavaScript or jQuery.

By default, WordPress is set up to run in one environment—it has one configuration file, wp-config.php, that holds one set of database credentials along with authentication keys/salts and debugging options. With just a few tweaks, you can get WordPress set up to handle multiple environments with different databases and options for each environment.

Now that you’ve started to integrate Grunt into your development workflow, here are a few tips to tidy up and optimize your Grunt setup along with plugins that you may find useful for development.