Blog · DucDZ

01

Content and expectations

Compare information and presentation in context of use.

Introducing the blog's topicState who the content is for and the main topics at the top of the page.Scan the page by title then find articles within a topic. Shows enough content, timing and author to choose; categories or searches should not take away the context of reading. The introduction should help readers realize the scope of the content, not just say that this is a place to share news.Example Article tags include title, introduction and “Interface design” label; Clicking on the label takes you to articles on the same topic.Keep the cards informativeDisplay appropriate title, introduction and time information to select songs.Try scanning three cards in a row: the title should be easy to spot, the image shouldn't overwhelm the title, and the intro shouldn't repeat the entire title.Browse by topicUse groups or labels that are consistent and indicate the topic being selected.Keep the same topic name across navigation, tags, and filter pages so readers don't have to guess they're related.

02

Navigation and experience

Try the operation, change the status and continue working.

Help find articles when neededWith many articles, search by keywords and instructions when there are no results.After reading an article and then returning, the user should see the list page and previous scroll position.Explanation of registering to receive articlesIf there is a subscription, clearly state the content received, frequency and feedback after sending.

03

Complete the experience

Check for details that are easy to miss when putting the design into use.

Identify the blog and its publisherKeep the blog name and the identity of its author, team, or organization at the top of the page so readers know who publishes the content.Use a clear page heading instead of making readers infer the blog identity from the post cards.Provide navigation beyond the post listUse a consistent navigation area to return to the homepage, open topics, and reach relevant actions.Do not use list page buttons as a substitute for website-wide navigation.Define the post layout and orderMake the ordering clear and arrange featured and recent posts with an appropriate card density on mobile and desktop.Check the first screen at each viewport size. A dense desktop grid may become difficult to read when it collapses into one column.Place supporting resources where they helpIf a sidebar is used, choose useful content such as topics, popular posts, or search while keeping the main reading area prominent.When the secondary column is down on a phone, searches and important topics still need to be easy to access.

Blog Website

Content and expectations

Navigation and experience

Complete the experience

How to review

Check the selection of articles from the list

Usage examples

Find articles about a topic

The list of articles has an exploratory orientation

Find a checklist

No checklists found

Blog Website

Content and expectations

Navigation and experience

Complete the experience

How to review

Check the selection of articles from the list

Usage examples

Find articles about a topic

Variants and use cases

The list of articles has an exploratory orientation