Best of the web for Design and Web Development May 2020

• June 1st, 2020
• News

The month of May has concluded another month where most of the world continues to still be on lock down, never the less online blog community has still continued to pull together to produce some great content worth reading through.

This round up includes some great Photoshop and illustrator tutorial from a great comprehensive guide to one of the most complicated illustrator tools the pen tool to creating a shiny text effect in Photoshop. The post concludes with some great web and design articles such as 30 Lessons After 30 Million SEO Visitors to a case study to complex table design.

Design tutorials

Illustrator’s Pen Tool: The Comprehensive Guide

If you use Adobe Illustrator, then it’s almost certain that you use the Pen Tool when creating your paths. This comprehensive Pen Tool Illustrator guide aims to introduce or remind you of features, shortcuts, and methods for working with what is arguably Adobe’s most essential tool. 

How to Create a Cyberpunk Photoshop Effect Action

In this tutorial, you will learn how to create a cyberpunk Photoshop effect action to add amazing vaporwave photo effects to your photos. I will explain everything in so much detail that everyone can create the effect, even those who have just opened Photoshop for the first time.

Create a Casio Watch in Adobe Illustrator

In this tutorial you will learn how to create a realistic watch using simple tools and techniques like the Align, Pathfinder, Clipping Mask, etc. in Adobe Illustrator. You will also learn how to use gradients and some simple effects to create an awesome 3D look. Let’s begin!

Create Abstract Shining Text Effect with Groovy Font in Photoshop

In this tutorial, you will learn how to create an amazing dispersion effect. 

How to create selfie portrait collage

A selfie collage can be the perfect project to blend art forms and styles. The cool thing about collages is that there is always something around in the real world that you can mix with digital elements in Adobe Photoshop.

How to Create an Awesome Dispersion Action in Adobe Photoshop

In this tutorial, you will learn how to create an amazing dispersion effect. 

Web and design articles

Let’s Take a Deep Dive Into the CSS Contain Property

Compared to the past, modern browsers have become really efficient at rendering the tangled web of HTML, CSS, and JavaScript code a typical webpage provides. It takes a mere milliseconds to render the code we give it into something people can use.

A CASE STUDY OF COMPLEX TABLE DESIGN

I just released a new version of Actual and a big change is a rewrite of the budget table. It might not look like much, but it pays down a lot of technical debt and is a big improvement in many ways. The previous design resulted in a poor user experience despite good intentions. This is a look at how I approach product design and all the considerations you need to think about.

30 Lessons After 30 Million SEO Visitors

As you can see from the screenshot above, I’ve driven 30 million visitors to my website from SEO.

The Fastest Google Fonts

For the most part, web fonts nowadays are faster than ever. With more standardised FOUT/FOIT behaviour from browser vendors, to the newer font-display specification, performance—and therefore the user—seems to have been finally been put front-and-centre.

Accessible Images For When They Matter Most

Creating accessible images seems like a simple topic at first glance — you just need to add alt text to an image, right? But the topic is much more nuanced than some people think. In this article, we will review the different types of images, dive into some real-world examples of inaccessible public service announcements (PSAs), and discuss which elements matter most when critical messages need to reach everyone.

How to Configure Cloudflare Settings for WordPress

By acting as a reverse proxy in front of your site, Cloudflare is an all-in-one security and performance product that is used by over 12% of websites around the world.  As a WordPress user, adding Cloudflare to your site can help boost site performance and reduce the impact of malicious bots and hackers.

Important CSS Concepts To Learn.

CSS(Cascading Style Sheets) is a rule-based language. It’s used to style and lay out pages by defining specific groups of styles that get applied to elements or groups of elements.

Moving from SCSS to styled-components: Advantages and caveats

Frontend frameworks like React have changed the way we interpret the separation of concerns. According to the vanilla approach, HTML, CSS, and JavaScript were all considered separate concerns. Your application’s markup, styles, and behavior were all separated and maintained in different files.