resizing Archives

WCAG 2.2 Removes 4.1.1 Parsing and How axe-core is Impacted

Earlier this year, for the first time ever the World Wide Web Consortium (W3C) proposed to remove a success criterion from WCAG 2. Success Criterion 4.1.1 Parsing ensures that pages written in markup languages like HTML and SVG are written in a way that allows browsers and assistive technologies to understand them consistently. Let’s take… Continue reading WCAG 2.2 Removes 4.1.1 Parsing and How axe-core is Impacted

How to create responsive cards with the help of auto-layout in Figma?

Auto Layout is one of the most powerful features of Figma and today we will be creating a card design inside Figma using Auto-Layout which will be fully responsive, i.e would respond to the screen size. demonstrates the responsive design of the card Before we get started, there are 3 main things we are talking about in… Continue reading How to create responsive cards with the help of auto-layout in Figma?

How to Update UIkit Components

Here’s the demo page that we’re going to create to demonstrate things: Be sure to scroll down the page to notice how specific elements become sticky. As with other UIkit tutorials, familiarity with this framework will be beneficial to follow along. The Demo Project Our page will consist of the following sections: The header… Continue reading How to Update UIkit Components

How to Crop or Resize an Image With JavaScript

It’s very easy to show a resized or cropped version of an image on a website using CSS. However, this doesn’t change the original image data. What if you want to create an actual cropped or resized version of an image for your visitors or clients? We’ve already published a couple of tutorials on how… Continue reading How to Crop or Resize an Image With JavaScript

WordPress Website Analysis: Before & After ImageEngine

WordPress is by far the world’s most popular CMS. Not only does it dominate the CMS market with a 64% market share, but it also powers 39.6% of all websites. It has taken the internet by storm by democratizing the web for all. Now, anyone can build, manage, and host a successful website without needing… Continue reading WordPress Website Analysis: Before & After ImageEngine

CSS Charts: How to Create a Horizontal Organizational Chart

In a previous tutorial, we learned how to create a CSS-only vertical organizational chart. Today, as some folks requested, we’ll go through the process of building its corresponding horizontal one. CSS CSS Charts: How to Create an Organizational Chart George Martsoukos And here’s the twist; we’ll create this new chart without changing a single line… Continue reading CSS Charts: How to Create a Horizontal Organizational Chart

7 Bad Tips for a Newbie Designer

3 Shares It’s funny that some people look for write-ups on examples of bad web design online instead of directly learning from articles that show the good practices. It’s the reverse approach to learning the best practices, and it is even funnier to learn that other people even ask about popular websites with bad designs.… Continue reading 7 Bad Tips for a Newbie Designer

How to Create a Thumbnail Image in PHP

Today, we’ll discuss how you could create thumbnail images in PHP with the help of the GD library. When you’re working on projects that are related to media, more often than not you will need to create thumbnails from the original images. Also, if you’ve enabled image uploads on your website, it’s essential that you… Continue reading How to Create a Thumbnail Image in PHP

How to Use Figma’s New Auto Layout Features

In this video I’ll show you how Figma’s new and improved Auto Layout features make designing responsive components and layouts easier than ever! Figma’s original Auto Layout features were introduced in December 2019–and now, almost a year later, Auto Layout has been completely reimagined, rebuilt and is (in my opinion) much better. Watch the Video… Continue reading How to Use Figma’s New Auto Layout Features

20 Unmissable Websites, May 2020

The world is a strange place at the moment, but design moves on apace, and sites are still being launched. Every month we post a roundup of the freshest sites we’ve come across in the previous four weeks. This month we’ve included some exciting portfolio sites, a strong selection of health and beauty sites, and… Continue reading 20 Unmissable Websites, May 2020

How to Resize an Image in Photoshop

What You’ll Be Creating Whether you are a beginner or an expert, resizing an image in Adobe Photoshop is one of the most commonly used skills. However, with so many tools available to you, it might be quite daunting to learn for someone who is just getting started. In this tutorial, you will learn how to… Continue reading How to Resize an Image in Photoshop

What’s New for Designers, July 2019

It’s hard to stay focused this time of year. With vacations coming up (or having recently passed) it’s easy to get distracted from work-related tasks. For that reason, this month’s roundup is full of design tools plus a few design diversions that you can have fun with. 404 Illustrations Have you ever wanted to create… Continue reading What’s New for Designers, July 2019

How to Create a Glowing, Fireflies Photo Manipulation in Adobe Photoshop

What You’ll Be Creating Have you ever caught fireflies on a warm summer night? When I was a kid we used to call them “lightning bugs.” I was always fascinated by how they would shine and glow against the sky, and loved releasing them back into the night. So in this tutorial, I’ll show you… Continue reading How to Create a Glowing, Fireflies Photo Manipulation in Adobe Photoshop

4 Easy Hacks To Improve Your Site’s Speed And Get Better Conversions

I have a confession to make; I’m the type of person who has no patience for a slow loading site. And apparently, I’m not the only one. Based on a research by the Aberdeen Group, a 1-second delay in a page load time can have the following negative effect: – Reduced page views by 11% –… Continue reading 4 Easy Hacks To Improve Your Site’s Speed And Get Better Conversions

Introducing Divi 3.0

Posted · Category: Information Divi 3.0 introduces a complete new front-end editor that has been re-built from the ground up using React, a modern JavaScript library for user interfaces. This new builder allows users to edit their WordPress pages on the front-end of their website using simple and beautiful visual controls. When you activate the… Continue reading Introducing Divi 3.0

How to Simplify Image-Rich Website Development with Cloudinary

Posted · Category: Information Even the most talented developer knows that a great website is time-consuming to build and a challenge to maintain. The reason: You need to meet graphic design requirements for every device according to current design trends, while ensuring that your website performance is optimized for any browser. Cloudinary can eliminate many… Continue reading How to Simplify Image-Rich Website Development with Cloudinary

How to Optimize Images on Websites to Improve Performance and UX

As the number of images and videos on a website continue to grow, slower load times, which result in a negative user experience, are growing concerns for any company. An article in The Fiscal Times, citing Internet data measurement company HTTP Archive, noted that the average website is now 2.1 MB in size, compared to… Continue reading How to Optimize Images on Websites to Improve Performance and UX

Enfold – Responsive Multi-Purpose Theme – 4519990

Enfold is a clean, super flexible and fully responsive WordPress Theme (try resizing your browser), suited for business websites, shop websites, and users who want to showcase their work on a neat portfolio site. The Theme is built on top of the fabulous Avia Framework and offers support for the WPML MULTI LANGUAGE plugin, just… Continue reading Enfold – Responsive Multi-Purpose Theme – 4519990

Interact.js – JavaScript plugin for drag and drop, resizing and multi-touch gestures

JavaScript drag and drop, resizing and multi-touch gestures with inertia and snapping for modern browsers (and also IE8+) Including: – Inertia – Snapping to a grid, custom anchors or paths. – Cross browser and device, supporting the desktop and mobile versions of Chrome, Firefox and Opera as well as Internet Explorer 8+ – Interaction with… Continue reading Interact.js – JavaScript plugin for drag and drop, resizing and multi-touch gestures

Tag: resizing