Making step-by-step instructions with comments

Step-by-step instructions are a popular way to design content. It works perfectly on websites of culinary, automotive, and many other topics. Let’s see how it looks in the Daria theme.

How it works

Thin pancakes with milk are an English version of traditional fluffy Russian pancakes baked on yeast. In Europe, pancakes have the appearance of thin, almost transparent napkins. In France, they are called “crepes” and are served with a hundred different fillings.

There are no special tricks in cooking: the more liquid the dough, the thinner the pancakes are. An openwork version, in a hole, will turn out if part of the milk from the recipe is added to the dough a little hot. Before you pour the first pancake, you should heat the pan well. The pancake is ready when it begins to brown to crisp edges.

01Preparing the necessary tools

1 comment ian-keefe-FfnKDDHaW0E-unsplash-min

“It won’t take off”, – said haters and other. But we took a chance. Instead of a thousand words, look at the numbers. The article’s readability increased from 40% to 60%.

Send

Jake Alex 3 Jul 2020 at 10:28 Reply

This is tested comment!

The text below demonstrates the features of the theme: formatting titles, lists, separators, and other ways of formatting text. It is no secret that to make the text interesting, it must also look appropriate. Few people want to read a solid white sheet of letters. So, let’s go!

02Drawing the layout on paper

1 comment ian-keefe-PtZ1eDGAYqQ-unsplash-min

The block has a system of comments for each step. This allows you to actively interact with users: the author receives feedback, and if necessary, makes adjustments.

Send

John 10 Sep 2020 at 16:38 Reply

Cool

The text below demonstrates the features of the theme: formatting titles, lists, separators, and other ways of formatting text. It is no secret that to make the text interesting, it must also look appropriate. Few people want to read a solid white sheet of letters. So, let’s go!

03Layout layout in the image editor

0 comments ian-keefe-iMpGsm7Xzgs-unsplash-min

In contrast to the usual two-column design, the microformat implements a voice box.

Send

The “step-by-step instructions” section is more than just a two-column element with pictures. It has the ability to comment on each step. Users can ask their questions, and the author can answer directly in the body of the article. Everything except the comment is closed in the <noindex> tag.

Have you already written a good title and introduction? When paired with a nice visual design, texts work wonders. This layout is an example of this design.