Setup theme.json with custom colors for WordPress 5.8

This post is more of a “research” note I had while looking into the theme.json file for themes on WordPress 5.8. You can read the introduction post here: Introducing theme.json in WordPress 5.8 – Make WordPress Core or the documentation here: Global Settings & Styles (theme.json) | Block Editor Handbook | WordPress Developer Resources.

What is the theme.json? You can think of it as the style guideline a developer can set for a theme. This file will define what colors the editors will have access to, what font sizes, what type of values can be written and what options different build-in blocks will support.

Continue reading “Setup theme.json with custom colors for WordPress 5.8” →

Resources for web developers and designers

I am tasked with collecting interesting things to read at DevriX each week. To help out anyone else that might want to add them to something like Feedly, I decided to make this short list here:

Front-end and backend

Design:

Others:

If you have any other great resources you use on a weekly basis, please share!

5 practice projects to learn HTML and CSS

HTML and CSS (just the two, yes, classic front-end stuff) are often overlook in favor of JS. Many developers reach a point where they understand the base concept for layouts, standard styling properties and the way to build elements. Often accompanied with a library like Bootstrap or Foundation.

But it turns out that there is a lot more to building layouts than just that. In fact, it’s rather easy to spot the TON of badly written front-end code. Its truly rare to see a project where things make sense, there is no useless properties, overly-complex stylings and hacks left and right to solve problems caused by bad code in the first place.

More than once I’ve deleted 300+ lines of code to write 50-60 lines that do the same job with less bugs and it’s easier to understand.

So, if you think that there is still some room to grow, try out the following projects in your spare time! Note, the order is not in terms of difficulty or anything.

Continue reading “5 practice projects to learn HTML and CSS” →

Responsive Containers in CSS

Responsive is nothing new — you build a page, it looks great on desktop, it has to look great on mobile as well. To achieve this we most often use media queries, but there is one other way – responsive containers

We should all know by now how to achieve that. You have media queries, you have relative values, you have grid systems and so forth.

Continue reading “Responsive Containers in CSS” →

Should you wrap block elements with anchor tags?

Kid hugging a dog. Kid represents tag and dog the tag

A question that pops every now and then — should you wrap block elements with anchor: <div> with anchor tag <a> ? This is one of the many decisions front-end developers have to make on a daily basis.

TLDR: Yes, you can. Don’t sweat over it.

First – what is the difference between a block and an inline element like <a>?

By default, a block-level element occupies the entire space of its parent element (container), thereby creating a “block.” 

Block-Level Elements, MDN
Continue reading “Should you wrap block elements with anchor tags?” →

If you feel down

It’s been two years since my last post here…

Shame. And I was writing a lot before. Well, for my standards, that is;

I would say that I have been focusing on my work more, trying to deal with the various tasks that are coming in daily. But then when I get home, I feel kinda tired. In fact tired enough to not even go to my backpack, open up my laptop and work on something new, be it an article, learn new stuff etc.

Continue reading “If you feel down” →

How I crafted my view for the League of Legends champions select screen

It all started in my school years when I and my buds were playing together online in the hours after school till midnight (and after more often than not).

Now, I wasn’t a hardcore gamer, not even close, though I could say that I am more or less proud of my “Global Elite” rank achievement on CS:GO.

So it was then when I stumbled upon League of Legends – an MOBA style game by Riot Games – a game with more than 100 million active users each month!

So you can see how quickly I got addicted to it, hitting hours and hours every day. In case you don’t know it (or the MOBA genre in general) it’s a team based 5v5 game where each player controls a champion with a set of unique abilities.

I won’t get into details about the gameplay as this is not the goal of this writing, but I must say a few general words to explain it better anyways.

Continue reading “How I crafted my view for the League of Legends champions select screen” →

Decision making as a designer and front-end developer in a WordPress agency

First, let’s start with what “decision making” is, and more importantly – good decision making.

When trying to make a good decision, a person must weight the positives and negatives of each option, and consider all the alternatives.

Clients come with problems. And they want them solved. Most of the time that’s a business problem, not technical. They want growth, they want improvement, they want income. Designing and developing must come with this core idea in mind. You want to provide a product that will improve your client’s business.

But to do so as an agency, you have to understand the business of your client. Why a certain design decision is better than another. What is the user base? How will this design decision affect the technical implementation of it and therefore the budget of your client? Long term commitment is crucial for understanding this.

Continue reading “Decision making as a designer and front-end developer in a WordPress agency” →

Colors in web design

Why are the right colors for your website so important? This article will outline when, why and how to pick your colors in order to make your visitors feel comfortable and convert into buyers/users of your product.

Adobe’s color scheme; Source: brandcolors.com

Color theory is often used in marketing and branding. Warm colors attract spontaneous buyers, while cooler ones are more create the sensation of security and elegance.

Continue reading “Colors in web design” →