# authoring

Published articles for authoring.

This is one page of public article previews, not the complete archive. Follow Next page to continue. Summaries are not the original full articles.

## Ebb, Meet Flow: Intrinsic Design in a Nutshell

DevFeed: [Ebb, Meet Flow: Intrinsic Design in a Nutshell](<https://devfeed.tech/articles/ebb-meet-flow-intrinsic-design-in-a-nutshell-40788.md>)

Original publisher: [Read original article](<https://zeldman.com/2026/08/18/ebb-meet-flow-intrinsic-design-in-a-nutshell/>)

Author: L. Jeffrey Zeldman

Published: 2026-08-18T17:24:50Z

Content type: opinion

Language: en

Sources: [Jeffrey Zeldman](<https://devfeed.tech/sources/jeffrey-zeldman.md>)

Topics: [Responsive Design](<https://devfeed.tech/topics/responsive-design.md>), [web design](<https://devfeed.tech/topics/web-design.md>), [Front end](<https://devfeed.tech/topics/frontend.md>), [web-standards](<https://devfeed.tech/topics/web-standards.md>)

Tags: [authoring](<https://devfeed.tech/tags/authoring.md>), [best-practices](<https://devfeed.tech/tags/best-practices.md>), [css](<https://devfeed.tech/tags/css.md>), [design](<https://devfeed.tech/tags/design.md>), [essentials](<https://devfeed.tech/tags/essentials.md>), [responsive](<https://devfeed.tech/tags/responsive.md>), [responsive-design](<https://devfeed.tech/tags/responsive-design.md>), [responsive-web-design](<https://devfeed.tech/tags/responsive-web-design.md>), [rwd](<https://devfeed.tech/tags/rwd.md>), [standards](<https://devfeed.tech/tags/standards.md>), [state-of-the-web](<https://devfeed.tech/tags/state-of-the-web.md>), [the-essentials](<https://devfeed.tech/tags/the-essentials.md>), [the-profession](<https://devfeed.tech/tags/the-profession.md>), [type](<https://devfeed.tech/tags/type.md>), [typography](<https://devfeed.tech/tags/typography.md>), [usability](<https://devfeed.tech/tags/usability.md>), [user-experience](<https://devfeed.tech/tags/user-experience.md>), [ux](<https://devfeed.tech/tags/ux.md>), [w3c](<https://devfeed.tech/tags/w3c.md>), [web-design](<https://devfeed.tech/tags/web-design.md>), [web-design-history](<https://devfeed.tech/tags/web-design-history.md>), [web-standards](<https://devfeed.tech/tags/web-standards.md>), [webdesign](<https://devfeed.tech/tags/webdesign.md>), [webtype](<https://devfeed.tech/tags/webtype.md>)

### AI overview

This article explains intrinsic or fluid responsive design: define type scales for small and large screens, then let the browser interpolate between them according to viewport width. It connects the approach to earlier ideas about designing for the web's natural ebb and flow and to the development of Responsive Web Design through improved web standards and browser support.

### Source excerpt

In 2020, the gifted makers of websites at Clearleft shared methods to achieve fluid responsive design. "Utopian" web design was (and still is) their half-kidding name for this approach, which Apple's Jen Simmons, working indendently, called "intrinsic design." Instead of chasing an ever-changing number of fixed breakpoints, utopian or intrinsic design follows the web's intrinsic [...] The post Ebb, Meet Flow: Intrinsic Design in a Nutshell appeared first on Jeffrey Zeldman Presents.

## Advanced Patterns: Grok + Hermes for Complex Workflows

DevFeed: [Advanced Patterns: Grok + Hermes for Complex Workflows](<https://devfeed.tech/articles/advanced-patterns-grok-hermes-for-complex-workflows-38370.md>)

Original publisher: [Read original article](<https://meedamian.com/post/advanced-grok-hermes/>)

Author: hi@meedamian.com (Damian Mee)

Published: 2026-05-18T00:00:00Z

Content type: tutorial

Language: en

Sources: [Damian Mee | Blog | Portfolio | About](<https://devfeed.tech/sources/damian-mee-blog-portfolio-about.md>)

Topics: [Automation](<https://devfeed.tech/topics/automation.md>), [sessions](<https://devfeed.tech/topics/sessions.md>), [Tool](<https://devfeed.tech/topics/tool.md>), [Raspberry Pi](<https://devfeed.tech/topics/raspberry-pi.md>)

Tags: [advanced](<https://devfeed.tech/tags/advanced.md>), [authoring](<https://devfeed.tech/tags/authoring.md>), [context](<https://devfeed.tech/tags/context.md>), [delegation](<https://devfeed.tech/tags/delegation.md>), [long-running](<https://devfeed.tech/tags/long-running.md>), [memory](<https://devfeed.tech/tags/memory.md>), [multi-agent](<https://devfeed.tech/tags/multi-agent.md>), [pi](<https://devfeed.tech/tags/pi.md>), [productivity](<https://devfeed.tech/tags/productivity.md>), [skills](<https://devfeed.tech/tags/skills.md>), [workflows](<https://devfeed.tech/tags/workflows.md>)

### AI overview

This developer post presents advanced workflow patterns for using Grok inside Hermes Agent. It discusses planning and sub-agent delegation, generating reusable SKILL.md files, and combining context handling with Hermes' memory tool for long-running projects. The author says these patterns improved productivity on Raspberry Pi projects and personal automation.

### Source excerpt

Disclaimer: This post was generated by Grok 4.3 running inside Hermes Agent. Advanced Grok + Hermes Workflows Once you have the basics down, here are some powerful patterns for using Grok inside Hermes Agent. Multi-Agent Delegation Grok excels at planning. Use it to orchestrate sub-agents: hermes delegate --goal "Refactor the auth module" --model grok-4.3 Skill Authoring with Grok Grok is fantastic at writing reusable skills. Ask it to generate SKILL.

## Authoring Custom Spin Templates

DevFeed: [Authoring Custom Spin Templates](<https://devfeed.tech/articles/authoring-custom-spin-templates-15170.md>)

Original publisher: [Read original article](<https://www.fermyon.com/blog/authoring-custom-spin-templates>)

Author: Thorsten Hans

Published: 2025-05-28T12:00:00Z

Content type: tutorial

Language: en

Sources: [Fermyon - Experience the next wave of cloud computing.](<https://devfeed.tech/sources/fermyon-experience-the-next-wave-of-cloud-computing.md>)

Topics: [Command-line interface](<https://devfeed.tech/topics/cli.md>), [code productivity](<https://devfeed.tech/topics/code-productivity.md>)

Tags: [authoring](<https://devfeed.tech/tags/authoring.md>), [boost-developer-productivity](<https://devfeed.tech/tags/boost-developer-productivity.md>), [cli](<https://devfeed.tech/tags/cli.md>), [compliance](<https://devfeed.tech/tags/compliance.md>), [how-to](<https://devfeed.tech/tags/how-to.md>), [install](<https://devfeed.tech/tags/install.md>), [templates](<https://devfeed.tech/tags/templates.md>)

### AI overview

A tutorial on creating, distributing, and installing custom templates for Spin CLI, with stated goals of improving developer productivity and supporting regulatory compliance.

### Source excerpt

Learn how to create, distribute and install custom templates for Spin CLI to boost developer productivity and meet regulatory compliance.

## The path to structured content with Markdown

DevFeed: [The path to structured content with Markdown](<https://devfeed.tech/articles/the-path-to-structured-content-with-markdown-30949.md>)

Original publisher: [Read original article](<https://www.doctave.com/blog/path-to-structured-markdown>)

Author: Niklas Begley

Published: 2024-06-06T07:00:00Z

Content type: tutorial

Language: en

Sources: [Doctave - Build beautiful developer portals with docs-as-code](<https://devfeed.tech/sources/doctave-build-beautiful-developer-portals-with-docs-as-code.md>)

Topics: [Markdown](<https://devfeed.tech/topics/markdown.md>), [Parser](<https://devfeed.tech/topics/parser.md>), [Parsing](<https://devfeed.tech/topics/parsing.md>), [XML](<https://devfeed.tech/topics/xml.md>), [Documentation](<https://devfeed.tech/topics/documentation.md>)

Tags: [authoring](<https://devfeed.tech/tags/authoring.md>), [blog](<https://devfeed.tech/tags/blog.md>), [documentation](<https://devfeed.tech/tags/documentation.md>), [markdown](<https://devfeed.tech/tags/markdown.md>), [structure](<https://devfeed.tech/tags/structure.md>), [structured](<https://devfeed.tech/tags/structured.md>), [syntax](<https://devfeed.tech/tags/syntax.md>), [technical](<https://devfeed.tech/tags/technical.md>), [technical-documentation](<https://devfeed.tech/tags/technical-documentation.md>)

### AI overview

The article argues that Markdown has an underlying structure that is often hidden from authors, making it more similar to XML-based structured authoring than commonly assumed. It demonstrates how Markdown is transformed into an abstract syntax tree and represented as a tree-shaped JSON structure.

### Source excerpt

This post was inspired by the Pros and Cons of Using Markdown for Technical Documentation Panel Discussion with Ed Marsh, Eric Holscher, and Fabrizio Ferri-Benedetti. Around the ~40 minute mark the discussion moves onto how to maintain a consistent style with Markdown documentation, especially in larger teams. The panel agrees that currently there are no clear ways to enforce a specific document structure when using Markdown. Fabrizzio then on goes on to say (54:15): Some day, someone is going to figure out a way to seamlessly grow Markdown into something that can mature into structured content I've been thinking about this a lot, and my claim is that Markdown and XML (which is traditionally used for structured authoring) are more similar than you would initially expect, and that the dream of adding validations and structure to Markdown is perhaps not too far away. The structure behind Markdown There's a commonly held belief that Markdown is not structured. There is some truth to this, but I'd argue it's more the case that the structure is hidden. While with most XML-based authoring tools you are manipulating the structure directly (or through a WYSIWYG editor), with Markdown we are one level removed from the actual underlying structure. To demonstrate, let's take a look at a quick example at how Markdown is actually almost equivalent to XML, if you squint a little. Let's take this Markdown content. 1 2 3 4 5 # Hello, world This is a paragraph **with some bold text** and this is an image When this Markdown is processed into HTML, it goes through a number of transformations. The first thing that happens is that the Markdown is converted into an Abstract Syntax Tree. This means taking the raw text of the Markdown, and converting into something more structured that a program can manipulate. Each Markdown parser does this a little bit differently, but we can see this in action with, for example, the AST Explorer tool. Let's take Markdown above, and paste it

## Don't Develop Just for Yourself - A Developer's Checklist to Accessibility

DevFeed: [Don't Develop Just for Yourself - A Developer's Checklist to Accessibility](<https://devfeed.tech/articles/don-t-develop-just-for-yourself-a-developer-s-checklist-to-accessibility-38434.md>)

Original publisher: [Read original article](<https://eevis.codes/blog/2021-05-28/dont-develop-just-for-yourself-a-developers-checklist-to-accessibility/>)

Author: Eevis Panula

Published: 2023-01-03T08:57:24.089000Z

Content type: tutorial

Language: en

Sources: [Eevis Blog](<https://devfeed.tech/sources/eevis-blog.md>)

Topics: [Accessibility](<https://devfeed.tech/topics/accessibility.md>), [keyboard](<https://devfeed.tech/topics/keyboard.md>), [Usability](<https://devfeed.tech/topics/usability.md>), [alt text](<https://devfeed.tech/topics/alt-text.md>), [aria](<https://devfeed.tech/topics/aria.md>), [ui](<https://devfeed.tech/topics/ui.md>)

Tags: [accessibility](<https://devfeed.tech/tags/accessibility.md>), [alt-text](<https://devfeed.tech/tags/alt-text.md>), [aria](<https://devfeed.tech/tags/aria.md>), [authoring](<https://devfeed.tech/tags/authoring.md>), [automated](<https://devfeed.tech/tags/automated.md>), [blog-post](<https://devfeed.tech/tags/blog-post.md>), [developer](<https://devfeed.tech/tags/developer.md>), [keyboard](<https://devfeed.tech/tags/keyboard.md>), [testing](<https://devfeed.tech/tags/testing.md>), [usability](<https://devfeed.tech/tags/usability.md>), [web](<https://devfeed.tech/tags/web.md>), [website](<https://devfeed.tech/tags/website.md>)

### AI overview

A beginner-oriented accessibility checklist for developers. It recommends manually testing keyboard navigation, focus visibility, and other website interactions after automated testing, while noting that the process does not guarantee full accessibility.

### Source excerpt

We, as developers, tend to develop sites unconsciously for people like ourselves. If we don't actively pay attention, the sites are often accessible only for certain types of people: Sighted mouse-users, who have good fine motor skills and are good at using computers. It leads to moments where no one who navigates the web with only a keyboard (or keyboard simulating device) can access and interact with the site. It is a pretty big group of people! We have a responsibility to make sites that work for all of our users. In some cases, it is required by law, but it is not the only reason we should care. This blog post is aimed for those at the beginning of their accessibility journey. You might know some things, like "always provide an alt-text for an image," but are unsure what to write there. Or you don't have any idea how to know if your site is accessible at all. Following this blog post won't make your site 100% accessible! The goal of this post is to provide some information about some things to check manually after using some automated testing. Keyboard Navigation First of all, abandon your mouse for a second. Don't use it. Try to navigate through the website using only the keyboard. Try to complete every task user needs to be able to complete on the website. Can you do it? Can you see where you are at the moment? Is the focus indicator (yes, that thing many designers and developers like to remove) visible enough? If you can't use the whole website with only a keyboard, that is an accessibility and usability problem. However, one thing to note here is that keyboard interaction is not necessarily accomplished with just tab and enter, as it has been at some point. The general pattern goes, as WAI-ARIA Authoring Practices state: A primary keyboard navigation convention common across all platforms is that the tab and shift+tab keys move focus from one UI component to another while other keys, primarily the arrow keys, move focus inside of components that include mult

## Custom Matrix Block Peer Validation Rules

DevFeed: [Custom Matrix Block Peer Validation Rules](<https://devfeed.tech/articles/custom-matrix-block-peer-validation-rules-31255.md>)

Original publisher: [Read original article](<https://nystudio107.com/blog/custom-matrix-block-validation-rules>)

Author: andrew@nystudio107.com (Andrew Welch)

Published: 2021-05-24T04:00:00Z

Content type: tutorial

Language: en

Sources: [nystudio107 | Articles on modern web development.](<https://devfeed.tech/sources/nystudio107-articles-on-modern-web-development.md>)

Topics: [Content Management System](<https://devfeed.tech/topics/cms.md>), [Website](<https://devfeed.tech/topics/website.md>)

Tags: [authoring](<https://devfeed.tech/tags/authoring.md>), [better](<https://devfeed.tech/tags/better.md>), [blocks](<https://devfeed.tech/tags/blocks.md>), [builder](<https://devfeed.tech/tags/builder.md>), [cms](<https://devfeed.tech/tags/cms.md>), [content](<https://devfeed.tech/tags/content.md>), [craft](<https://devfeed.tech/tags/craft.md>), [custom](<https://devfeed.tech/tags/custom.md>), [errors](<https://devfeed.tech/tags/errors.md>), [experience](<https://devfeed.tech/tags/experience.md>), [insights](<https://devfeed.tech/tags/insights.md>), [leverage](<https://devfeed.tech/tags/leverage.md>), [matrix](<https://devfeed.tech/tags/matrix.md>), [module](<https://devfeed.tech/tags/module.md>), [peer](<https://devfeed.tech/tags/peer.md>), [rules](<https://devfeed.tech/tags/rules.md>), [validation](<https://devfeed.tech/tags/validation.md>)

### AI overview

A tutorial on extending Craft CMS Matrix block content builders with custom peer validation rules. The example validates sundae blocks by limiting scoop and topping counts, requiring at least one scoop, and rejecting a specific flavor combination.

### Source excerpt

Leverage a Craft CMS module to add custom peer validation rules to your content builder Matrix blocks for a better content authoring experience

## Using Craft CMS as a Headless CMS with the GraphQL API

DevFeed: [Using Craft CMS as a Headless CMS with the GraphQL API](<https://devfeed.tech/articles/using-the-craft-cms-headless-with-the-graphql-api-31317.md>)

Original publisher: [Read original article](<https://nystudio107.com/blog/using-the-craft-cms-graphql-api-on-the-frontend>)

Author: andrew@nystudio107.com (Andrew Welch)

Published: 2020-01-20T05:00:00Z

Content type: tutorial

Language: en

Sources: [nystudio107 | Articles on modern web development.](<https://devfeed.tech/sources/nystudio107-articles-on-modern-web-development.md>)

Topics: [Content Management System](<https://devfeed.tech/topics/cms.md>), [GraphQL](<https://devfeed.tech/topics/graphql.md>), [API](<https://devfeed.tech/topics/api.md>), [Front end](<https://devfeed.tech/topics/frontend.md>), [Self-hosted](<https://devfeed.tech/topics/self-hosted.md>)

Tags: [added](<https://devfeed.tech/tags/added.md>), [api](<https://devfeed.tech/tags/api.md>), [authoring](<https://devfeed.tech/tags/authoring.md>), [cms](<https://devfeed.tech/tags/cms.md>), [craft](<https://devfeed.tech/tags/craft.md>), [formalized](<https://devfeed.tech/tags/formalized.md>), [frontend](<https://devfeed.tech/tags/frontend.md>), [gives](<https://devfeed.tech/tags/gives.md>), [graphql](<https://devfeed.tech/tags/graphql.md>), [headless](<https://devfeed.tech/tags/headless.md>), [here-s](<https://devfeed.tech/tags/here-s.md>), [insights](<https://devfeed.tech/tags/insights.md>), [layer](<https://devfeed.tech/tags/layer.md>), [practical](<https://devfeed.tech/tags/practical.md>), [structured](<https://devfeed.tech/tags/structured.md>), [website](<https://devfeed.tech/tags/website.md>)

### AI overview

This tutorial explains how to use Craft CMS as a headless CMS through its GraphQL API. It discusses the API's structured data access, its use with separate frontends, and the distinction between Craft CMS's first-party implementation and the CraftQL plugin.

### Source excerpt

Craft CMS 3.3 added a GraphQL layer that gives your website a formalized, structured API out of the box. Here's how to use GraphQL + Craft CMS as a "headless" CMS

## Creating a Content Builder in Craft CMS

DevFeed: [Creating a Content Builder in Craft CMS](<https://devfeed.tech/articles/creating-a-content-builder-in-craft-cms-31250.md>)

Original publisher: [Read original article](<https://nystudio107.com/blog/creating-a-content-builder-in-craft-cms>)

Author: andrew@nystudio107.com (Andrew Welch)

Published: 2017-01-16T18:59:00Z

Content type: tutorial

Language: en

Sources: [nystudio107 | Articles on modern web development.](<https://devfeed.tech/sources/nystudio107-articles-on-modern-web-development.md>)

Topics: [Content Management System](<https://devfeed.tech/topics/cms.md>), [Matrix](<https://devfeed.tech/topics/matrix-org.md>), [Front end](<https://devfeed.tech/topics/frontend.md>), [User experience (UX)](<https://devfeed.tech/topics/ux.md>), [Website](<https://devfeed.tech/topics/website.md>)

Tags: [article](<https://devfeed.tech/tags/article.md>), [authoring](<https://devfeed.tech/tags/authoring.md>), [better](<https://devfeed.tech/tags/better.md>), [block](<https://devfeed.tech/tags/block.md>), [blocks](<https://devfeed.tech/tags/blocks.md>), [builder](<https://devfeed.tech/tags/builder.md>), [client](<https://devfeed.tech/tags/client.md>), [cms](<https://devfeed.tech/tags/cms.md>), [content](<https://devfeed.tech/tags/content.md>), [create](<https://devfeed.tech/tags/create.md>), [field](<https://devfeed.tech/tags/field.md>), [frontend](<https://devfeed.tech/tags/frontend.md>), [giving](<https://devfeed.tech/tags/giving.md>), [insights](<https://devfeed.tech/tags/insights.md>), [just](<https://devfeed.tech/tags/just.md>), [matrix](<https://devfeed.tech/tags/matrix.md>), [rich](<https://devfeed.tech/tags/rich.md>), [text](<https://devfeed.tech/tags/text.md>), [using](<https://devfeed.tech/tags/using.md>)

### AI overview

This tutorial explains how to use Craft CMS's Matrix Block to build a structured content builder for clients. It argues that constrained block-based authoring can provide a better experience than an unrestricted Rich Text field.

### Source excerpt

Using the Matrix block to create a "content builder" for your client is much better than just giving them a Rich Text field