WordPress WordPress Full Site Editing on Speckyboy Design Magazine https://speckyboy.com/topic/full-site-editing/ Design News, Resources & Inspiration Fri, 15 Dec 2023 06:20:47 +0000 en-US hourly 1 How to Build a 404 Page with the WordPress Site Editor https://speckyboy.com/404-page-wordpress-site-editor/ https://speckyboy.com/404-page-wordpress-site-editor/#respond Thu, 05 Oct 2023 07:57:55 +0000 https://speckyboy.com/?p=154220 We show you how the WordPress Site Editor can help you build a custom 404 page. Don't take your 404 page for granted!

The post How to Build a 404 Page with the WordPress Site Editor appeared first on Speckyboy Design Magazine.

]]>
A great website has many ingredients. But some tend to fly under the radar. The venerable 404 page is a prime example.

Web designers spend hours perfecting a site’s layout, functionality, and content. However, we don’t always pay attention to the 404. Why is that?

It’s easy to take the 404 page for granted. It’s often hidden for one. We may not think of it until we stumble upon the page.

Content management systems (CMS) like WordPress make them even less visible. That’s because themes often come with preconfigured templates. We may not think to review what’s there.

That could be a missed opportunity. The 404 page is a place to help users navigate your website. They may look elsewhere if they can’t find what they need. And WordPress block themes open the door to customization. You can add features without touching code.

Let’s explore how the WordPress Site Editor can help you build a custom 404 page.



Start with a WordPress Block Theme

To start, you’ll need to install a copy of WordPress. You can use a local site or a web hosting account.

Next, it’s time to activate a block theme. However, a fresh install of WordPress will do this for you. The bundled default themes now work with the Site Editor.

We’ll use the Twenty Twenty-Three default theme for this demonstration. But you can use any block theme you like. The WordPress theme directory has several available for download.

Even better is that a basic 404 page doesn’t require plugins. WordPress includes enough blocks to build a functional page.

Edit Your 404 Template in the WordPress Site Editor

Now that we have a WordPress block theme, we can focus on our 404 page. Let’s start by navigating to Appearance > Editor inside the WordPress admin.

Next, we’ll click on the Templates link in the sidebar.

This screen displays all of the templates that come with your theme. The Twenty Twenty-Three default theme comes with a 404 template listed as Page: 404.

What if your theme doesn’t come with a 404 template? It’s possible to add a new theme template using the Site Editor. Just be sure to keep the WordPress template hierarchy in mind.

Assess the Template

Our 404 template is a bit sparse. It consists of a paragraph block and a search field. Both items are helpful. But we can do better, right?

A quality 404 page is there to guide users. Remember that they arrived here by mistake. The link they wanted to visit isn’t available.

What can we do to improve this page? We can think of a few additions that would make a positive impact.

The original template contained only a search field and some descriptive text.

Add Some Helpful WordPress Blocks

First, we’ll add a Page List block. This one provides a map of content for users to navigate. We love that the list shows parent and child relationships.

Adding the WordPress Page List block.

Maybe our visitor was looking for a blog post? Let’s add a Latest Posts block that shows six recent articles.

We can also include a button that links to the Blog page. Users can click it to gain instant access to our archive.

Adding the Latest Posts block with a button linking to our Blog page.

Let’s narrow things down a bit as well. Our blog has several categories and tags. We can use the Categories List and Tag Cloud blocks to add direct links to them. We’ll also use the Block Editor to create a multi-column layout.

Adding the Categories List and Tag Cloud blocks.

What if our visitor still hasn’t found what they need? We’ll add a Cover block that encourages them to contact us.

A Cover block contains a call-to-action.

It seems like we’ve covered all the bases. Our 404 page will serve as a launch point for users to find desired content.

The finished version of our 404 page template.

Helping Users Find Their Way

We’ve taken a basic 404-page template and turned it into a hub. And we did so with native WordPress blocks. A few minutes was all it took to enhance the user experience.

There’s always room for more enhancements, though. You could add some third-party blocks to help users navigate. And a live search feature would improve the core WordPress function.

All told, the Site Editor simplified the template-building process. It didn’t require us to write code. And it offers plenty of layout options.

Don’t ignore your website’s 404 page. Improving it is worth the effort. And the WordPress Site Editor makes it easier than ever.

The post How to Build a 404 Page with the WordPress Site Editor appeared first on Speckyboy Design Magazine.

]]>
https://speckyboy.com/404-page-wordpress-site-editor/feed/ 0
What’s in a Word? WordPress Terminology at a Crossroads https://speckyboy.com/word-wordpress-terminology-crossroads/ https://speckyboy.com/word-wordpress-terminology-crossroads/#respond Tue, 12 Sep 2023 10:59:26 +0000 https://speckyboy.com/?p=154159 WordPress tends to struggle with messaging. Could it harm its long-term future? What could be done to create a more user-friendly vocabulary?

The post What’s in a Word? WordPress Terminology at a Crossroads appeared first on Speckyboy Design Magazine.

]]>
WordPress isn’t like other content management systems (CMS) on the market. Sure, there are other free and open-source options. But they don’t have nearly as big of a market share.

That leaves WordPress to compete with commercial offerings. Platforms such as Shopify and Wix come to mind.

Again, these systems can’t match WordPress’ market share. But they do have an advantage in marketing muscle. They have the resources to create a seamless campaign. They can speak to their targeted audience with clarity.

WordPress tends to struggle with messaging. You can see it at both the macro and micro levels. It covers big things like defining what the platform does and who it’s for. And it also happens with individual features.

The result is confusion – even among seasoned users. It also makes things harder for those who teach others. There’s a lack of consistency. Not to mention frequent changes to the terminology we use.

How much does this impact WordPress? Could it harm the software’s long-term future? And what can be done to create a more user-friendly vocabulary? Let’s take a deeper look at the words that define WordPress.



Who Are We Speaking To?

WordPress is an incredibly flexible platform. We can use it in a variety of ways. Thus, it appeals to both technical and non-technical users.

This appeal is both a blessing and a curse. On the bright side, WordPress continues to thrive in part because it offers so many possibilities.

But the words we use to describe WordPress don’t apply universally. A conversation among developers is bound to be more technical. Some terms are likely to confuse everyday users.

Yet it seems like developer speak is the dominant language in WordPress. We use exclusionary terms that are difficult for others to understand. You see it in the core software and third-party themes and plugins.

Perhaps this stems from where WordPress and its ecosystem come from. Many developers are responsible for both building and promoting products. Most aren’t marketers by trade.

Product descriptions and documentation tend to be written by developers. As such, developer speak is likely to be used. The content isn’t as user-friendly as it could be.

It's important to avoid technical jargon when describing WordPress features.

An Ever-Changing WordPress Core

The past decade has brought significant change to WordPress. The advent of the Block and Site editors has impacted content creation and website design.

Each of these items has undergone a descriptive overhaul. The Block Editor was initially referred to as “Gutenberg,” for example. The name was derived from the Gutenberg project, which oversees this and other features.

As for the Site Editor, it’s also a part of the Gutenberg project. But the feature was initially called “Full Site Editing.”

The names were eventually changed. They now more accurately reflect what each feature does. These are positive and well-intentioned moves. But the cat was already out of the bag, so to speak.

We now see these terms used interchangeably. This may not impact veteran WordPress developers very much. But what about new users? Do they understand that the Site Editor is the same as Full Site Editing? And what to make of the differences between block themes and classic themes?

We’ve created an unnecessarily confusing situation. And there is plenty of blame to go around. For instance, writers like myself have added fuel to the fire.

The terminology surrounding the Block and Site Editors can be confusing.

How Do We Fix the WordPress Word Scramble?

Here comes the difficult part. How do we use terminology that everyone can understand?

I think it starts with the WordPress project. Feature names should be reflective of what they do. But they should be named and described in the simplest of terms.

Perhaps this sounds like no big deal. But WordPress contributors have a lot on their plates. There’s only so much time to argue about names.

We did see a lot of thought put into this recently, however. The Command Pallete feature that shipped with WordPress 6.3 underwent a name change. Project contributors debated the merits of the original name (Command Center). They realized that it might be taken out of context and addressed the issue.

The creation of user-friendly terms will trickle down to the community. Writers will use it in their tutorials. And product makers will use it in their marketing efforts.

The community also has a responsibility. We must speak to WordPress users in plain language. We must limit the use of developer terms.

A little guidance would also help. WordPress has a developer-focused glossary of terms and a user-focused Semantics page. We should study them.

But perhaps we can educate product makers on methods for creating user-friendly marketing and documentation materials. That’s not necessarily a responsibility of the WordPress project.

Still, it could help to make the platform easier to understand. And it’s a part of keeping WordPress on top for the long term.

Simplfying WordPress terminology starts with its open source project.

A User-Friendly Experience Starts with Words

The words we use matter. They can be the difference between friendly advice and an insult. People use them to form opinions.

What people read about WordPress will impact their decision to use it. If the software sounds confusing, they may head elsewhere. They may never fire up a demo to see for themselves.

It behooves all of us to think about how we talk about WordPress. Are we keeping new users in mind? Or are we losing them with technical jargon?

The impact may not be immediate. But by simplifying our language, we can attract more users than we lose. That’s highly important for the future of the project and its ecosystem.

The post What’s in a Word? WordPress Terminology at a Crossroads appeared first on Speckyboy Design Magazine.

]]>
https://speckyboy.com/word-wordpress-terminology-crossroads/feed/ 0
Essential WordPress Block Theme Features for Web Designers https://speckyboy.com/wordpress-block-theme-features-web-designers/ https://speckyboy.com/wordpress-block-theme-features-web-designers/#respond Wed, 23 Aug 2023 07:37:43 +0000 https://speckyboy.com/?p=152746 The number of block themes is increasing, yet not all cater to the needs of web designers. We explore those key block theme features designed for professionals.

The post Essential WordPress Block Theme Features for Web Designers appeared first on Speckyboy Design Magazine.

]]>
Web designers working with WordPress have always had options. There is a myriad of ways to build a quality website. It’s all about finding the right fit for your needs.

That’s why the newfangled world of block themes has been disruptive. They’re different than classic themes. They don’t rely as heavily on PHP. And then there’s the whole concept of using JSON to define styles and options.

Block themes do come with advantages, however. Using one may mean writing fewer lines of code. And a block-based approach means not having to reinvent the wheel. That’s because many layout and functionality features come standard with WordPress.

The number of available block themes is increasing. But not all are ideal for web designers. We need flexibility and easy customization.

With that in mind, let’s check out some essential WordPress block theme features that focus on professionals.



A Minimalist Approach to Design

Readymade WordPress themes are popular. They promise a faster start on web design projects. Yet they can also be very opinionated.

That clashes with our ability to build custom websites. It seems like you can waste hours ripping a theme apart. You then have to rebuild it to match your vision. Starting from scratch may have been more efficient.

Thus, a minimalist approach makes sense. A strongly opinionated block theme is no better than a classic counterpart. It requires too much effort to customize.

Blockbase may be the best example of a minimalist theme. It makes very few design decisions. It’s the proverbial blank canvas. Still, the theme offers enough options to please designers.

Minimalism is a subjective quality, though. Not everyone wants a blank canvas. A theme that offers a few extra bells and whistles is also worth considering.

The key concept is to spend the bulk of your time moving forward. Some themes make it nearly impossible to do so.

The Blockbase WordPress theme takes a minimalist approach to design

A Selection of Style Variations

Block themes are supposed to make web design easier. And style variations are among their most powerful features. They make it possible to switch color and typography schemes. It takes only a few clicks to transform your site.

Web designers can use this to their advantage. A style variation may make for quicker progress. For example, a theme that offers light and dark color schemes saves us from building them.

This concept also fits with minimalist themes. Style variations that serve as a solid foundation are ideal. We can choose a variation and further customize it within the Site Editor.

Style variations won’t fully represent a finished product. But they are a step in the right direction.

Block themes can offer multiple style variations

A Set of Basic Block Template Parts

Think of block template parts as reusable sections of a theme. They’re not full-blown templates. But we can use them to power smaller areas within a template.

It’s a highly flexible feature. For example, you might create a block template part to display a call-to-action on blog posts. You could also create a variety of layouts for a site’s header. There are so many possibilities here.

A block theme that includes a set of template parts would be helpful. We can add common elements using minimal effort. We’ll have more time to focus on project details.

Let’s use Blockbase as an example. The theme includes several header variations. Everything from minimal to full-width options is available.

We can change header layouts within the Site Editor. Customization is easy. We have the option to edit the existing blocks or add new ones.

But why stop at headers? A theme could also include block template parts for other areas. Footers, sidebars, author bios, and navigation styles are possibilities. Anything to improve efficiency is worth considering.

Block Template Parts can be strategically placed throughout your theme

Custom Block Patterns for Niche Sites

Like block template parts, block patterns are reusable. However, block patterns are implemented at the content level. We can add them to any page or post.

Patterns once again save us from reinventing the wheel. And they can range from basic layouts to (almost) fully-formed content areas.

WordPress offers a community-driven block pattern directory. Find a pattern you like and then paste it into your page. Or import custom patterns directly within the block editor.

Theme authors can also include custom block patterns. The advantage is that these patterns can better reflect the theme. For example, they may take typography and color into account. That makes for a seamless fit with the existing design.

Authors might offer patterns that fit the theme’s niche. Including grid patterns or card layouts to a magazine theme, for instance. A portfolio theme could also provide galleries or project listing patterns.

Block patterns can make it easier to add popular design features to a page

Regardless of Theme Type, Web Designers Have the Same Needs

For web designers, the decision to work with block themes is nuanced. Block themes are the future of theming. But they work differently than the classic variety. As such, it’s easy to lose sight of what makes a block theme worthwhile.

There are some common threads, though. Web designers still need flexibility. We need a solid and unopinionated foundation. And we can’t forget simple options to help achieve project goals.

These are the same qualities we look for in a classic theme. The good news is that some block themes take web professionals into account. They eschew bloated features and focus on real-world solutions.

Regardless of the type of theme we use, needs don’t change. That’s worth remembering as we navigate a new era of building websites.

The post Essential WordPress Block Theme Features for Web Designers appeared first on Speckyboy Design Magazine.

]]>
https://speckyboy.com/wordpress-block-theme-features-web-designers/feed/ 0
10 Free WordPress Block Themes That Utilize Full Site Editing https://speckyboy.com/free-wordpress-block-themes-full-site-editing/ https://speckyboy.com/free-wordpress-block-themes-full-site-editing/#respond Mon, 07 Aug 2023 06:49:54 +0000 https://speckyboy.com/?p=137439 A collection of free WordPress block themes that utilize full site editing (FSE). All themes are easy to customize and offer a lot of flexibility.

The post 10 Free WordPress Block Themes That Utilize Full Site Editing appeared first on Speckyboy Design Magazine.

]]>
Block themes have ushered in a new era for WordPress. Through the use of full site editing (FSE), they put every facet of a website’s design within reach. There’s no need to open up your code editor, as you can point-and-click your way to a fully custom design.

But before we get too far into the weeds, it’s worth noting that block themes are fundamentally different than the classic WordPress themes you’re used to. They’re specifically built to work with FSE and the Gutenberg block editor. Think of them as an entirely separate category of theme.

Now that we have those details out of the way, it’s time to start looking at themes! Block themes are a growing segment, and therefore, it will take time for their numbers to approach the massive quantity of classic themes on the market.

Still, there are plenty of compelling options. And the fact that these themes are fairly simple to customize means that you have a lot of flexibility. If a particular design element doesn’t fit your needs, you can always start from scratch.

To help get you started on your journey, here are ten free WordPress block themes that are worthy of your consideration.


The post 10 Free WordPress Block Themes That Utilize Full Site Editing appeared first on Speckyboy Design Magazine.

]]>
https://speckyboy.com/free-wordpress-block-themes-full-site-editing/feed/ 0
What Collaborative Features Will Bring to WordPress https://speckyboy.com/what-collaborative-features-will-bring-to-wordpress/ https://speckyboy.com/what-collaborative-features-will-bring-to-wordpress/#respond Sat, 05 Aug 2023 06:17:10 +0000 https://speckyboy.com/?p=151400 How will collaborative features improve WordPress? We discuss several scenarios that demonstrate how they can streamline working together.

The post What Collaborative Features Will Bring to WordPress appeared first on Speckyboy Design Magazine.

]]>
The Gutenberg project has changed WordPress dramatically. First, the Block Editor brought an entirely new interface to content creators. Then the Site Editor came along and did the same for designers. In short: everything’s a block now.

The project is more than just blocks, though. Phase 3 of Gutenberg involves adding collaborative features to WordPress. The main focus has been on design tools to this point. Now there will be a shift toward workflow.

Workflow is an overlooked subject. It’s relevant for websites maintained by multiple people. That’s likely a significant chunk of the WordPress user base. Websites in the publishing, education, and corporate enterprise sectors are all targets.

So, how will collaborative features improve WordPress? Here are a few scenarios that demonstrate how they can streamline working together.



Multiple Users Managing the Same Page

Let’s start with a personal pet peeve. I often provide technical support to my web design clients. Helping them create a page layout is a common request. It’s often a simple task. For example, it might consist of aligning an image beside the text.

This should be easy to resolve. But WordPress allows just one user at a time to edit a page. That means my client must exit the page so that I can access it.

It’s a small frustration. But it happens often enough to be a waste of time. Plus, this limitation makes training harder.

I usually end up creating a short video tutorial for them. It’s an effective tool, if not a bit overboard. There has to be an easier way to work together.

Allowing multiple users to collaborate would be a game changer. I could walk my client through the process while we’re on the same page. They’re more likely to remember it. And I won’t have to go to the trouble of making a video. Everyone wins in this scenario.

Collaboration can be useful even on small sites. It may not be used very often. But the feature is there to help when you need it.

WordPress only allows one user at a time to edit a page

Tweaking a Page Until It’s Just Right

WordPress currently allows users to work asynchronously. But tracking changes isn’t easy. And there’s no built-in way to communicate about them.

And what if you’re making edits to a published page? There’s no way to save changes now and release them later.

These are common roadblocks for collaborators. And both are part of Gutenberg’s Phase 3 roadmap.

We’ll eventually have a system that facilitates communication between users. Stakeholders can add notes to individual pages or blocks.

Meanwhile, changes to the revisions feature would enable users to work with the future in mind. Let’s say that we want to prepare our home page for Black Friday. We can make the necessary changes and save them. Then schedule publishing for that date.

Current methods don’t offer this kind of flexibility. Thus, a streamlined experience and increased efficiency will be welcome.

The ability to track changes to content would benefit WordPress users

Custom Guidelines for Publishing Content

Some organizations have guidelines for publishing content. They may include rules for branding, word counts, or the inclusion of a call-to-action (CTA).

But how do we ensure that content creators meet these benchmarks? WordPress doesn’t prevent users from clicking the Publish button. Thus, content may be published without some crucial elements.

Workflow has long been a struggle for publishers and web designers. Consider blog post layouts, for example. They often assume the user will add a featured image. But some users need constant reminders to add them.

This issue could be solved by creating a custom workflow. Users may see real-time checklists that measure progress. Or the software could prevent them from publishing content that doesn’t meet the established guidelines.

These functions may not be part of WordPress core, mind you. But the software could provide a way for developers to build them. From there, an organization can design a workflow that meets their needs.

This eliminates some manual labor from the process. Editors can then focus on content instead of its structure.

Working Together – Only Better

Initially, the Collaboration phase of Gutenberg sounded a bit boring. It seemed like a niche functionality that impacted relatively few users. But the information that has been released so far is quite the opposite.

Collaborative features have a broad appeal. They go beyond large publishers and will reach mainstream users as well.

They’ll make it easier for freelancers to work with clients. And they’ll increase the synergy between designers and developers.

What’s more, the features outlined are wide-ranging. They’re not just a case of “Google Docs meets WordPress.” Entire workflows can be constructed. And they can evolve as needs change.

The end product is still a ways off. But it looks like this phase will be well worth the effort.

The post What Collaborative Features Will Bring to WordPress appeared first on Speckyboy Design Magazine.

]]>
https://speckyboy.com/what-collaborative-features-will-bring-to-wordpress/feed/ 0
Do Clients Need To Know How Their Website Works? https://speckyboy.com/know-how-their-website-works/ https://speckyboy.com/know-how-their-website-works/#respond Mon, 12 Jun 2023 06:31:46 +0000 https://speckyboy.com/?p=150998 We explore the challenges in educating clients about their websites. Along the way, we share thoughts on why knowing it all isn't all that great.

The post Do Clients Need To Know How Their Website Works? appeared first on Speckyboy Design Magazine.

]]>
Web designers often fret about tools and technologies. We love to debate their merits and the impact they have on our projects.

One recent debate involves the WordPress Site Editor. The feature allows us to design and build an entire website within the browser.

Some find this to be a great leap forward. But others are concerned that it gives site owners too much control. They worry that there aren’t enough protections to keep a client from accidentally breaking the layout. I believe that there are valid points on each side.

But this discussion also got me thinking about how we train clients. Is the Site Editor (or any tool, for that matter) relevant to them? Do they need to know every aspect of how their website works? And where do we draw the line about what’s important?

Let’s explore the challenges in educating clients about their websites. Along the way, I’ll share my thoughts on why knowing it all isn’t all that great.



The Risk of Overwhelming Your Clients

Modern websites are becoming more complex. And it’s not just the high-end enterprise variety. Even an old-school “brochure” site can have several moving parts.

We can thank the proliferation of content management systems (CMS) for that. These apps allow for greater flexibility. But that also means more code. Themes, plugins, and custom creations each add another layer to the mix.

This makes educating clients more challenging. Limited time and resources may force us to leave out certain items. Thus, we can’t easily provide a complete explanation of every feature.

Perhaps this sounds like bad news. But that’s not necessarily the case. By focusing on the essentials, we’re helping clients understand what’s most relevant.

Take automobiles, for example. Cars come with all manner of complex systems. But do we know how each one works? To do so, we might have to spend weeks (or months) in a specialized course. And our heads would likely be swimming in superfluous facts and figures.

If the goal is to empower clients to perform specific tasks, it’s OK to skip past the things that don’t impact them.

A broad focus on website features can be overwhelming for clients.

What’s Important? Look at a Client’s Workflow

The areas of focus for client training aren’t always obvious. Some tasks, like logging in, are universal. But there will also be unique aspects as well.

Much depends on what your client wants to accomplish. Maybe they will be publishing articles or regularly adding events to a calendar. They might focus on processing eCommerce orders.

This information is vital. It helps guide us in how to effectively implement features. And it also gives us an idea of a client’s workflow. From there, we can design a training program that fits their needs.

It starts with the initial conversations you have with them. As you learn the project’s details, you’ll be able to ask questions about how they plan to interact with their site.

In addition, you’ll also have an idea of what can safely be left out. For instance, consider a client who won’t need to touch their home page layout. There’s no reason to spend precious time demonstrating a feature they won’t use.

Consider the common website tasks your client will complete.

Are Some Features Better Left Hidden?

Hiding or choosing to ignore certain features can sound suspicious. Some may see it as trickery. But that’s not the goal here.

To expand on that idea, let’s revisit the WordPress Site Editor. It’s a design tool intended to make for easier template changes. Thus, it’s not likely to be part of a client’s day-to-day workflow.

You might still mention that the feature exists. And you could even give a quick summary of its purpose. In that case, a friendly warning about the potential dangers should also be offered. But a deep dive into how it works is probably not necessary.

In my experience, clients tend to be focused on their to-do lists. Website tasks are often only a part of their responsibilities. Therefore, the more efficient we can be in training, the better it is for all parties.

And this doesn’t preclude us from exploring features later. As a client evolves, there could be an opportunity to dig into something you previously ignored. But initially, the features covered should be based on need.

It's OK to hide or ignore features that don't impact your clients.

Clients Don’t Need To Know It All

When you think about it, most of us buy products without understanding their every facet. Cars, mobile devices, and all manner of appliances come to mind.

The ability to operate these items is what matters. Do we need to know exactly how our microwave oven heats a meal? It may make for great party conversation. However, knowing how to use it is probably more important.

Websites are no different. We build them to suit our client’s needs. And we help them learn what they need to know to achieve their goals.

The most relevant information, therefore, is the best use of everyone’s time. Everything else is secondary.

The post Do Clients Need To Know How Their Website Works? appeared first on Speckyboy Design Magazine.

]]>
https://speckyboy.com/know-how-their-website-works/feed/ 0
How No-Code Tools Disrupt the Design Process https://speckyboy.com/how-no-code-tools-disrupt-the-design-process/ https://speckyboy.com/how-no-code-tools-disrupt-the-design-process/#respond Tue, 30 May 2023 07:37:58 +0000 https://speckyboy.com/?p=150804 Like many web designers, I’m a fan of routine. I like having a set process for getting things done. And crafting a design can greatly benefit from this practice. For...

The post How No-Code Tools Disrupt the Design Process appeared first on Speckyboy Design Magazine.

]]>
Like many web designers, I’m a fan of routine. I like having a set process for getting things done. And crafting a design can greatly benefit from this practice.

For me, it starts with opening my favorite design tools. From there, I experiment with color and typography. Complimentary images are chosen to enhance the look. Layouts are built and refined. The result is (hopefully) good enough to share with clients. After a few revisions, it’s time to build.

However, technology is starting to blur the lines between designing and building. No-code tools like the WordPress Site Editor are throwing a wrench into the process. It’s now possible to handle design while building a website.

This method may be a boon for efficiency. But it may also lead to reduced originality in design. It might even discourage us from trying to level up our skills.

So, what does this mean for the future of web design? And where should we draw the line between convenience and originality? Let’s take a deeper look at how no-code tools are disrupting the design process.



The Good Parts of Browser-based Design

Designing a layout in a web browser isn’t new. Tools like Figma have brought this functionality into the mainstream. But there was still a separation between design and code.

No-code site builders have broken that barrier. And they offer some potential benefits.

Web design has often been theoretical. For example, you can create a beautiful mockup in Photoshop. But you won’t necessarily know how it will translate to a fully-functioning website.

Manipulating HTML and CSS to match the mockup isn’t always easy. Plus, adapting the design to mobile devices is a whole other process. The ability to accurately test while we design is a game changer.

Thus, a browser-based design eliminates some of the common issues we face. It’s a more direct way to work. That could mean launching a project faster. Revisions could also be easier to manage.

Tools like the WordPress Site Editor made design more efficient.

It’s Easy To Settle For ‘Good Enough’

The downside may be in how these tools change our mentality. For some, efficiency might become the primary focus. That could send the practice of detail-oriented design to the wayside.

We may be more inclined to stick with the default options. On the one hand, this makes perfect sense. It’s never a bad idea to go with components that work. But there’s also an argument that the finished product won’t reach its full potential.

To be fair, similar points have been raised about frameworks like Bootstrap. Because much of the hard work is done for us, it’s easy to settle for something good enough.

This is great for non-designers. They can create without investing in expensive tools. Nor do they need to understand code. At the same time, some finer touches may be missed. And that’s what tends to make a website stand out.

It’s not necessarily the tool’s fault, however. Ultimately, the decision to go all-in with great design is ours.

A theme like Ollie with many included styles may lead you to stick with the default look.

Combining Convenience and Great Design

The challenge, it seems, is in taking advantage of no-code tools without relying too heavily on their default styles. Maybe that requires us to keep those old-school techniques in the mix.

In practice, that means employing traditional design tools. After all, no one is forcing us to start from scratch in a web browser. It’s merely an option.

Thus, building prototypes with Figma, Photoshop, or whatever you’re comfortable with is still valid. This allows you to focus solely on the design. Plus, you won’t be limited by the constraints of most no-code tools.

That provides a solid launching point. When you enter your preferred no-code builder, you’ll already have a plan. This can guide you through the build process.

Working this way may require a period of adjustment. It can be difficult to create certain features with these tools. But in time, you can learn to adapt your prototypes to better fit the development environment.

The existence of no-code tools doesn't mean you should give up your current workflow.

Tools May Change, but They Don’t Have To Change You

The tools and techniques we use exist to help us achieve our goals. For web designers, it’s about building sites better and faster.

It’s easy to fall into a trap, though. You might, for instance, feel like you have to dive head-first into no-code tools. Or that you’ll need to abandon your previous workflow. That’s not the case.

These apps don’t have to completely change the way you design a website. Instead, they can be used to improve the process and create efficiencies.

For better or worse, these tools are disrupting the industry. But we can choose how much they disrupt us.

The post How No-Code Tools Disrupt the Design Process appeared first on Speckyboy Design Magazine.

]]>
https://speckyboy.com/how-no-code-tools-disrupt-the-design-process/feed/ 0
WordPress Offers Two Very Different Paths: That’s a Good Thing https://speckyboy.com/wordpress-paths/ https://speckyboy.com/wordpress-paths/#respond Mon, 22 May 2023 06:35:24 +0000 https://speckyboy.com/?p=150692 Do we go with a battle-tested classic theme or opt for a newfangled block theme? Do we embrace the Block Editor or stick with the trusty Classic flavor?

The post WordPress Offers Two Very Different Paths: That’s a Good Thing appeared first on Speckyboy Design Magazine.

]]>
WordPress has evolved steadily. It has added significant features, while somehow maintaining familiarity.

But much of the user and developer experiences are based on our choices. Do we go with a battle-tested classic theme or opt for a newfangled block theme? Do we embrace the Block Editor or stick with the trusty Classic flavor?

These are defining decisions. They chart a path for how we work with the content management system (CMS). And they influence everything from how we build a website to how content is created.

You might even say they’re distinctly different experiences. Here’s why I hope it stays that way.



Flexibility To Fit Any Type of Project

Flexibility has long been a strength of WordPress. Its open-source code and extensibility make for nearly endless customization.

Developers can tweak the front and back ends to match project needs. If the default functionality isn’t enough, you can build your own. And we can’t forget about the massive theme and plugin ecosystem.

This means that building virtually any type of website is possible. Single-page portfolios, enterprise-level multisite installations, and everything in between are within reach.

Still, the advent of the Block Editor (WordPress 5.0) and Site Editor (WordPress 5.9) raised a big question. How would these additions impact flexibility?

If anything, they add more avenues for customization. The Block Editor will work with any type of theme. And in some cases, it may eliminate the need for page builder plugins or hard-coded custom templates.

The Site Editor, meanwhile, allows us to build an entire website with blocks. Block themes can serve as solid no-code solutions. They may be the perfect fit for specific types of sites.

And if that weren’t enough, you can also combine the best of classic and block themes. Features like block template parts let theme developers create their preferred mix of tools.

Yes, WordPress is still flexible. Although one could make the case that choosing the right path may be harder than ever.

WordPress block themes offer a different sort of flexibility.

Concerns About the Present & Future

It’s great to have choices. But there are a few concerns with having two distinct ways of building with WordPress. Perhaps the biggest is how it impacts the future.

If you choose a classic theme, will it still be viable within a couple of years? Or will these themes have been phased out by then? That could conceivably leave you with a mess when it’s time for a redesign.

On the other hand, some rightly wonder if block themes are capable enough. The Site Editor is still relatively young. And blocks can’t account for every possible use case. Plus, block themes continue to make up a relatively small segment of the market.

As such, some will prefer the tried-and-true method of writing PHP and CSS. All the talk these days is about blocks. But it may be that classic themes are still the best fit for highly customized websites.

Taken together, it seems like developers are caught between worlds. After all, no one wants to go in the wrong direction. But is there a bad choice here?

Choosing between a block and classic theme can be difficult.

You Can Still Build to Suit With WordPress

There has been some compelling debate about the current state of WordPress development.

Chris Coyier wrote a fantastic piece about the uneasy transition to blocks-for-everything. He wondered if perhaps PHP-based themes have met their demise. Ben Word, meanwhile, spoke of how you can use PHP to get the best of both worlds.

Look around social media, and I’m sure you’ll find others who align with one stance or the other. For my part, I can identify with both points of view.

Each approach has its strengths. With that, maybe the decision should come down to what’s best for your project.

As a developer, there is great power in being able to build according to need. Since both classic and block themes are supported, there’s no reason we can’t use what works best for us.

If you feel like PHP-based themes aren’t where it’s at, why shouldn’t you use a block theme? And if block themes don’t provide enough flexibility, classic themes make perfect sense.

This is what separates WordPress from other platforms. You aren’t stuck with a single way to do things. Sometimes this can create extra layers of complexity. But it’s arguably better than being limited in how or what you can build.

WordPress still offers the ability to build a fully-custom website.

The Beauty of More Options & Possibilities

Maybe WordPress isn’t always the best option for a given project. For instance, it may be overkill for a simple one-page site with no dynamic content. Thankfully, each of us can decide if that’s the case.

But I love that I can use WordPress to build that type of site. Or any other type of website. And I can choose a path to building that aligns with my needs.

Sure, there are drawbacks. And there are also areas of the CMS that are languishing. But by and large, WordPress works as advertised.

I understand that some may see the existence of block and classic themes as an unnecessary complication. But I choose to look at it as having two legitimate options to build a website. And I hope that continues to be the case.

The post WordPress Offers Two Very Different Paths: That’s a Good Thing appeared first on Speckyboy Design Magazine.

]]>
https://speckyboy.com/wordpress-paths/feed/ 0
Should a Block Theme Power Your Next WordPress Project? https://speckyboy.com/block-theme-power-next-wordpress-project/ https://speckyboy.com/block-theme-power-next-wordpress-project/#respond Sun, 16 Apr 2023 21:00:49 +0000 https://speckyboy.com/?p=149391 Discover how block-based WordPress themes can help you create stunning websites without the need for extensive coding skills.

The post Should a Block Theme Power Your Next WordPress Project? appeared first on Speckyboy Design Magazine.

]]>
Block themes have now been a part of the WordPress ecosystem for a few years. And with the WordPress Site Editor moving out of beta, I thought it might be a good time to revisit them.

The included features of both block themes and the Site Editor are no longer experimental. Nominally speaking, that makes them a viable option for production environments.

It may also help to boost their presence in the theme market. As of this writing, block themes make up just under 5% of the listings on the official theme repository.

But quantity doesn’t necessarily speak to the quality of the themes. The classic theme marketplace has been littered with low-quality offerings for years. Thus, numbers don’t tell us everything.

In the end, it comes down to features and functionality. So, do block themes have what it takes to power your next WordPress project?



A New Standard for Custom Styles

Before the Site Editor, we had the Customizer. It provided a standardized interface for theme authors to add custom options. The feature worked, but some themes created a nested mess of settings panels.

Block themes offer a different approach to customization. A global styles palette allows for setting important items like typography and colors. And theme authors can include readymade style variations that can dramatically change the look with just a click.

Beyond that, global styles can now be applied to specific blocks. For instance, you can set custom margins and padding for the Paragraph block. Or you might use custom colors and fonts on the Button block. There’s also the ability to add custom CSS to any block via an integrated textarea.

That’s a big deal. Previously, customizing block styling wasn’t easy. You might overwrite the default CSS in your theme. But new WordPress releases tended to change styles – meaning you’d have to readjust accordingly. Configuring the theme.json file was also possible. But having to manually insert specific styles is tedious at best.

Now, most tasks can be done directly within the Site Editor. Even better is that the custom styles you generate are portable via theme.json and the Create Block Theme plugin.

This makes for a smoother, browser-based design experience. That will likely hold more appeal for web designers than earlier incarnations of the Site Editor.

Style variations allow theme authors to bundle different looks.
The Twenty Twenty-Three theme includes several style variations.

Fixes To Previous Pain Points

Improving the Site Editor experience has been a priority for the project. And recent versions of WordPress have brought some welcome changes on that front.

For one, a new UI has made the Site Editor easier to navigate. Templates and template parts are neatly organized. And it’s easier to recognize the exact item you’re editing.

And the much-maligned Navigation block has also received an overhaul. Menu items can now be intuitively managed via a settings sidebar.

The Style Book feature should also come in handy. It provides a glimpse of how each block is styled. Previously, you’d have to manually add a block to a page to see how it fits within your theme. The ability to visually inspect seldom-used items in the back end helps to ensure that they meet our needs.

These and other enhancements have smoothed over a previously scattered user experience. That’s an important step. Because if the Site Editor isn’t easy to use, block themes will suffer as a whole.

The Style Book feature lets you see how each block will look on the front end.
The WordPress Style Book.

A Better Experience, but the Same Differences

A polished UX is a great step in the right direction. But that isn’t the only relevant part of using a block theme. You must also buy into the philosophy surrounding these features.

This may be the hardest thing for some web designers to accept. And there are a couple of issues at play:

A Different Way to Work

The Site Editor and block themes provide a visual way to build a website. This no-code approach can be liberating – or frustrating. The answer depends on how you prefer to work.

Developers who are used to building classic themes may not have the desired flexibility. Writing code means unlimited freedom. Every style and function can be customized to suit your needs.

As such, this newfangled way of working means accepting certain limitations. For instance, the global styles palette doesn’t include every possible styling option.

And while you can still use custom CSS within the Site Editor, it isn’t as well-organized as a traditional stylesheet. That could make future maintenance more cumbersome.

Not everyone is ready or willing to adopt a new workflow. Block themes force our hand.

Giving up Total Control Over Layout

Client-proofing can be a major part of building a website. The idea is that we can allow clients access to the items they need (content, the ability to upload images, etc.). At the same time, we can protect the integrity of the site’s layout.

Block themes aren’t necessarily built with this in mind. They provide ready access to the site’s header, footer, and everything in between. A rogue client could easily do some damage.

The Site Editor includes a “lock” function that prevents tampering. But it’s easy to disable.

With classic themes, it’s possible to embed elements directly into a template. This makes it completely off-limits within WordPress.

This shift has led to a debate within the WordPress developer community. For some developers, giving up control may be a bridge too far.

While it's possible to lock block layouts, the feature isn't foolproof.
Template Part Blocking in the WordPress Site Editor.

Block Themes Have Grown Up

All told, block themes are in a better position to fulfill their potential. And much of the credit should go to the team behind the Site Editor.

The improvements to building within WordPress are noticeable. This should help to put block themes on the map. They are now a serious option for web designers, rather than a curiosity for early adopters.

This doesn’t mean they’re the right fit for every project and person. The philosophical differences between block and classic themes still exist, after all.

But the future looks bright. With the Site Editor being stripped of this “beta” label, theme authors are more likely to build for it. And the rest of us will have more products to choose from.

Will there be a point when block theme adoption surpasses its classic counterparts? If it happens, it won’t be immediate. But it will be interesting to see how things evolve.

The post Should a Block Theme Power Your Next WordPress Project? appeared first on Speckyboy Design Magazine.

]]>
https://speckyboy.com/block-theme-power-next-wordpress-project/feed/ 0
When Should You Use WordPress Full Site Editing? https://speckyboy.com/when-should-you-use-wordpress-full-site-editing/ https://speckyboy.com/when-should-you-use-wordpress-full-site-editing/#respond Wed, 29 Jun 2022 07:47:26 +0000 https://speckyboy.com/?p=141311 Full Site Editing in WordPress is not a perfect fit for every situation. So, when does it make sense to use it?

The post When Should You Use WordPress Full Site Editing? appeared first on Speckyboy Design Magazine.

]]>
It’s safe to say that Full Site Editing (FSE) is one of the most important features to come to WordPress in some time. You may even compare it to the advent of themes themselves, which were added back in version 1.5 of the content management system.

The premise of FSE is that it allows anyone to design and edit a compatible theme fully within the block editor. No need to mess around with PHP or even CSS – just point-and-click your way to a custom website.

There are a couple of common reactions to the inclusion of FSE. The first is the excitement that comes along with lowering the bar to theme customization. Beyond that is a group of designers wondering if the feature applies to them at all.

Interesting as this functionality may be, it’s not a perfect fit for every situation. So, when does it make sense to use Full Site Editing? The following are a few potential scenarios that are worth considering.



Design Flexibility Is a Necessity

The flexibility of a WordPress theme can vary greatly. Some “classic” themes offer a plethora of options through a settings screen or the Customizer. Still, others require you to make design changes through code.

Either way, the ability to tweak the look and layout tends to be cumbersome. That makes it more difficult for sites that need to make frequent changes to headers, footers, or other theme templates.

For efficiency’s sake, FSE makes perfect sense. Quick customizations can be made and previewed in real-time. And the use of the block editor means that dropping in new functionality (a search bar, for example) can be accomplished without a lot of fuss.

This type of setup also lends itself well to multisite networks. Each site within the network may have its own specific design needs, and FSE makes this easier to facilitate.

Not that you’d want to do all of this in a production environment, of course. Just like any mission-critical website, making changes on a staging site first is still highly recommended. But FSE does shorten the process from concept to launch.

Editing a theme's header in the Full Site Editor.

The Website Will Be Fully Maintained by Your Client

There may be instances where you build a website and simply hand it over to your client. From that point on, it’s their job to handle all maintenance responsibilities.

However, it’s often tough to maintain a website built by somebody else. This is especially relevant when it comes to making changes to the theme. Even if you provide training and documentation, there can be a significant learning curve for clients.

FSE offers a solid solution. Your client won’t have to dig through code to figure out how you implemented a specific feature. Rather, it’s all there in the dashboard.

If they need to change the number of blog posts displayed on the home page, it could come down to adjusting a setting within a block. That’s a whole lot easier than searching through a hard-coded template.

In all, things are less likely to be lost in translation when using a visual editor. This may even cut down on the number of support requests down the road.

Adding a featured image to a post archive template.

You’re Looking for Simplicity

In the right hands, WordPress can be the engine behind some very complex websites. Think membership sites, online education, and eCommerce.

But not every project will need that level of complexity. Indeed, portfolios and blogs generally benefit from a simpler approach. The bloat that comes with more traditional methods could be overkill.

A block theme and FSE may be all you need. They’ll help you to craft an attractive website that eschews all the bells and whistles. It’s perfect for situations where you just want to focus on content.

That’s not to say FSE isn’t capable of more. However, it may be the path of least resistance when it comes to simplicity. There’s something to be said for technology that puts this within reach.

Customizing a single post template.

Take Advantage of Full Site Editing

We’re just scratching the surface of what can be accomplished with Full Site Editing. And it will be exciting to see what new and creative uses developers will find for it.

Still, the feature is far from a universal fit. Not all projects will need the functionality. As such, it’s important to carefully consider the potential benefits and drawbacks before jumping on board.

The scenarios outlined above are worth contemplating as they take advantage of what FSE does best. The ease of use and flexibility it offers will undoubtedly make design and maintenance easier for a lot of people.

Is it right for your project? Hopefully, the ideas here will put you on the right path to finding the answer.

The post When Should You Use WordPress Full Site Editing? appeared first on Speckyboy Design Magazine.

]]>
https://speckyboy.com/when-should-you-use-wordpress-full-site-editing/feed/ 0