{"id":5089,"date":"2023-01-15T09:00:00","date_gmt":"2023-01-15T17:00:00","guid":{"rendered":"https:\/\/test-inside.ewu.edu\/mchildress\/?p=5089"},"modified":"2025-01-02T10:03:10","modified_gmt":"2025-01-02T18:03:10","slug":"headline-block-vs-heading-block","status":"publish","type":"post","link":"https:\/\/test-inside.ewu.edu\/mchildress\/headline-block-vs-heading-block\/","title":{"rendered":"Headline Block vs. Heading Block"},"content":{"rendered":"\n

As a content manager on test-inside.ewu.edu<\/a> at Eastern Washington University, you have access to many blocks that you can use to create and organize your content. At first glance, some of these blocks can be confusing because of similar names or their different locations in the block inserter itself. One such instance is the Headline block and the Heading block. Although they are similar, they have different uses. We\u2019ll review those uses in this article.<\/p>\n\n\n\n

\"Gutenberg
In this image, we locate both the Headline and Heading blocks.<\/figcaption><\/figure>\n\n\n\n

The Heading Block<\/h2>\n\n\n\n
\"Image<\/figure>\n\n\n\n

The Heading<\/strong> block, located under the TEXT section of the block inserter, is a native part of the WordPress core editor. The Heading block helps introduce new areas and organize textual content to help visitors (and search engines) understand the structure of your content. With the Heading block, you can easily add structured headings and subheadings to your content, making it more readable and easy to navigate. You can use the block to format your content with a title of a specific size, such as H1, H2, H3, H4, H5, or H6.<\/p>\n\n\n\n

\n

It\u2019s important to note that the cascading style sheet (CSS) determines the presentation of the Heading block and cannot be modified by content managers. This restriction is on purpose to help keep body content consistent.<\/p>\n<\/blockquote>\n\n\n\n

The Headline Block<\/h2>\n\n\n\n
\"Image<\/figure>\n\n\n\n

The Headline<\/strong> block is a part of the collection of blocks from GenerateBlocks. Located under the GENERATEBLOCKS section of the block inserter, you can create design elements with granular control. Using the Headline block, you can easily design your content the way you want in the most effective manner possible. Users can also apply text shadow, letter spacing, and line height, making it easy to make headlines stand out. Additionally, the Headline block allows for design customizations such as background color, padding, and margin. Users can also adjust the text alignment, which can help to create a consistent look across the website.<\/p>\n\n\n\n

\n

As opposed to the Heading<\/strong> block, the Headline<\/strong> block allows content managers granular control over how headers function and paragraph text, icons, and more.<\/p>\n<\/blockquote>\n\n\n\n

Headline Block Examples<\/h2>\n\n\n\n

The following screen captures illustrate some good uses of the Headline block within the content body courtesy of the Records and Registration website<\/a>. In two examples, you can see that they have used a combination of icons above the headline to draw attention. The 8-button strip also uniquely utilizes the Headline block.<\/p>\n\n\n\n

\n
\"3-column<\/a><\/figure>\n\n\n\n
\"8-button<\/a><\/figure>\n\n\n\n
\"3-column<\/a><\/figure>\n
Some Examples of the Headline Block<\/figcaption><\/figure>\n\n\n\n
<\/div>\n\n\n\n

Points to Remember<\/h2>\n\n\n\n