Automatic responsive images with client hints

Over time, developers have wrestled with forcing images into responsive layouts. Media queries and fluid grids are constantly employed to achieve visually flexible images. Achieving such flexible images as pointed out by Ethan Marcotte in the seminal first edition of his book  is as easy as: img { max-width: 100%; } The image resources being… Continue reading Automatic responsive images with client hints

Turn Your Web App Into A Native App

Posted · Category: Tools Web apps are awesome, but many are not optimized for mobile, or are done so in ways that leaves much to be desired. These days, a poor mobile experience can quickly drive away users and kill engagement. While app users’ attention spans are shortening, they increasingly demand truly native mobile app… Continue reading Turn Your Web App Into A Native App

How to Send a Pull Request using the Github Desktop Client

In one of my previous posts, I outlined the process of contributing to open source software with a detailed account of each step. One of those steps was sending a pull request to the owner of the repository you forked from. I showed you how to send a pull request using Github‘s web interface. In… Continue reading How to Send a Pull Request using the Github Desktop Client

Using Subversion to Check Out WordPress

There are a lot of reasons to enjoy following open-source software, one of which is the ability to learn from the code that others have built.  Other examples include: following along with bug tickets seeing new features merged into the code base learning how to achieve something programmatically viewing the deprecation of an old feature… Continue reading Using Subversion to Check Out WordPress

Kick-Start WordPress Development With Twig: Timber Image, Menu, and User

By now you have read about the basic concepts of using Twig through Timber, while building a modular WordPress theme. We’ve also studied block nesting and multiple inheritance with Twig, based on the DRY principle. Today, we are going to explore how to display attachment images, WordPress menus, and users in a theme with Twig… Continue reading Kick-Start WordPress Development With Twig: Timber Image, Menu, and User

How to Use BrowserSync for Faster Development

BrowserSync is an automation tool that makes web development faster. In the past we’ve automated a lot of actions like compilation of SASS files, image compression etc. BrowserSync brings a whole new type of automation to the table with batteries included. BrowserSync makes your tweaking and testing faster by synchronizing file changes and interactions across… Continue reading How to Use BrowserSync for Faster Development

How to Work With Images in Shopify

When starting out with a new platform, such as Shopify, there’s a lot to learn. Whilst Liquid, the template language used in Shopify themes, is very readable and easy to get started with, one area of Shopify development which can often cause confusion for new theme developers is images. I believe the main reason for… Continue reading How to Work With Images in Shopify

Styleguide Toolbox – Templates, UI Kits, Tools & Generators

Styleguides are an essential tool for ensuring that everyone in an organization is on the same page. After all, maintaining a consistent style is vital to brand recognition, readability and it just looks more professional. The great thing about these Styleguide resources is that there is undoubtedly one that will let you work the way… Continue reading Styleguide Toolbox – Templates, UI Kits, Tools & Generators

A Beginner’s Guide to AJAX with jQuery

In the first article of this series, we covered the fundamentals of AJAX. In the second, we looked at a working example using vanilla JavaScript. In this tutorial, we’ll walk through a few of jQuery’s AJAX-related functions and methods. More specifically, we’ll take a closer look at the shorthand load method and the generic ajax… Continue reading A Beginner’s Guide to AJAX with jQuery

An Example of AJAX with Vanilla Javascript

Following on from our introduction to AJAX, here’s an example which uses the XMLHttpRequest API to initialize an AJAX request. AJAX Example Have a look at the following basic structure: <div> <img src=”http://webdesign.tutsplus.com/Einstein.jpg” alt=”Einstein”> <button id=”request”>Learn more about Einstein</button> <div id=”bio”></div> </div> Also, consider the related visualization: Here’s what we want to happen: when we… Continue reading An Example of AJAX with Vanilla Javascript

How To Add Azure Mobile Services to a Windows Phone App

Windows Phone apps that use live tiles, authenticate users with single-sign on, and share data between devices and users generally employ cloud services. Most cloud platforms offer general purpose capabilities to store data and execute code, but you have to add a lot of infrastructure code to glue these capabilities together. Azure Mobile Services let you add cloud… Continue reading How To Add Azure Mobile Services to a Windows Phone App

Create Code-free Websites with Webyo’s Cloud-based Platform – Now with New Features!

Designing websites can be an arduous task for those of who have no or very little understanding of code. Freelancers and design agencies who service hundreds or thousands of clients must use tools that allow them to seamlessly operate several websites from one cloud-based content management system. Webydo is a cloud-based web design platform that… Continue reading Create Code-free Websites with Webyo’s Cloud-based Platform – Now with New Features!

Installing and Using PHPMyAdmin With WordPress

PHPMyAdmin (PMA) is an excellent free, open-source, web-based database client which can be used to interact more easily with MySQL and WordPress databases. I’ll describe how to install PMA in Linux and with the WAMP and XAMPP server distributions. I’ll also describe ways to secure it and some common scenarios in which it can assist… Continue reading Installing and Using PHPMyAdmin With WordPress

20+ HTML Forms Best Practices for Beginners

* { box-sizing: border-box; } body {margin: 0;}*{box-sizing:border-box;}body{margin-top:0px;margin-right:0px;margin-bottom:0px;margin-left:0px;} Working with HTML forms can be somewhat daunting. They not only use some niche HTML elements, but also blur the line between static content and user interaction. Let’s review some things to remember when creating your next form. Good HTML forms require attention on at least four… Continue reading 20+ HTML Forms Best Practices for Beginners

How to Build a Dynamic Imgur Upload App Using jQuery & PHP

Many new online web services are providing backend APIs for developers. These allow anyone to connect into a web app and pull out specific information (or push or change bits of data). Today we’re specifically looking at the API for Imgur. In this tutorial I want to demonstrate how we can remotely mirror an image… Continue reading How to Build a Dynamic Imgur Upload App Using jQuery & PHP

14 Fantastic Free Tools for Design Collaboration

For designers, collaborating and sharing design concepts can be frustrating. The process is often initiated over email, while we wait for feedback and sort through comments and revision notes. However, there’s a wealth of excellent collaboration tools to make it easier to get feedback and approve artwork in a timely, professional manner. For freelancers or… Continue reading 14 Fantastic Free Tools for Design Collaboration