Another week to improve my blog design. This time it's about the post labels element.
Previous Design
There are three places in the previous design where the post labels are displayed:
1. Above the post title in the multi-items view.
 |
| Top level post labels in the multi-items view. |
2. Under the post title and the below post content in the single item view.
 |
| Post labels under the post title. |
 |
| Post labels below the post content. |
The second position supposed to make it easy for visitors to explore labels before or after reading a post.
Aside from lacking a bit of style, the one displayed on post page is already functions as intended. The one needs improvement is the post labels in the multi-items view.
Lacking In Presence
After observing it a few times, I notice that the labels on the multi-items view is lacking in presence. It's there, but you will have to stop from scrolling and fully focused on it to capture the information.
To Improve it, the post date is now placed under the post title and, since it is means for displaying top level labels, a unique icon associated with the label is added.
 |
| Top-level labels with icon. |
Placing the post date between the post title and post snippet also creates a nice gap compared to the previous design.
The label's icon is not displayed in the homepage though, since the posts already displayed in sections.
 |
| Post labels not displayed in the homepage post sections. |