How to write a well-structured poststeemCreated with Sketch.

in #design5 years ago (edited)

A few days ago @thebluewin wrote an interesting article about how to use tags for posts in order to structure and organize them well. As I spend a lot of time trying to find good content, I keep thinking about the characteristics of good posts. Of course one thing is the content itself. But I noticed that I was more willing to give a 100% upvote to a post that was not only written well but also structured well and visually appealing than to a post with a 500 words paragraph. So how do we create blogposts that are not only valuable for their content but are also easy to read and pleasant to look at?

blogger4218491_1920.jpg
img src

Paragraphs and headlines

To make a post easily understandable it is best to create paragraphs that are not too long and only focus on one aspect. Find a suitable headline for the paragraph and make the heading visible by using the html code

<h2>YOUR HEADLINE</h2>

If you want to divide your paragraph into several parts, you can use smaller headlines for each part. Just use h3 in the brackets instead of h2.

Highlighting, underlining, listing …

Now that the text consists of several parts, we can decide if we want to highlight some phrases by printing them fat or underline them. If you want this to be printed fat you have to use this code:

<strong>YOUR TEXT</strong>

It works the same for underlining parts. Just replace strong with u.

<u>YOUR TEXT</u>

Sometimes you might want to create a list to summarize important points. A list could possibly look like that:

  • u for underlining
  • strong for fat
  • del for cross out
  • i for italic

To create a list you want to use this code:

<ul>
<li>FIRST POINT ON THE LIST</li>
<li>SECOND POINT ON THE LIST</li>
<li>AND SO ON</li>
</ul>

Pictures, videos, gifs

To visualize your posts you can integrate pictures, gifs or videos. Depending on your content you can either use your own and original pictures, or you can try to find license free pictures on websites like pixabay.com. If you write a game review you can use screenshots from the game. If you write about your sunday morning walk in nature, why not take some pictures to show others the beautiful landscape. If you use non original pictures I’d recommend to always link the source.

images381937_1280.jpg
img src

Page dividers

Those simple little lines can also be a great tool to divide the paragraphs from each other. You can use the html code

<hr/>

to create a fine standard divider. The ones I used in my post are from @javehimself. You can find a collection of beautiful and colorful dividers in this post.

If you can think of anything I forgot to mention in my post, please feel free to add it in the comments.

Cheers
auminda

Sort:  

Hi @auminda!

Your post was upvoted by @steem-ua, new Steem dApp, using UserAuthority for algorithmic post curation!
Your UA account score is currently 2.430 which ranks you at #18840 across all Steem accounts.
Your rank has improved 354 places in the last three days (old rank 19194).

In our last Algorithmic Curation Round, consisting of 130 contributions, your post is ranked at #116.

Evaluation of your UA score:
  • Only a few people are following you, try to convince more people with good work.
  • The readers like your work!
  • Try to work on user engagement: the more people that interact with you via the comments, the higher your UA score!

Feel free to join our @steem-ua Discord server

Hi, @auminda!

You just got a 4.75% upvote from SteemPlus!
To get higher upvotes, earn more SteemPlus Points (SPP). On your Steemit wallet, check your SPP balance and click on "How to earn SPP?" to find out all the ways to earn.
If you're not using SteemPlus yet, please check our last posts in here to see the many ways in which SteemPlus can improve your Steem experience on Steemit and Busy.

Coin Marketplace

STEEM 0.21
TRX 0.20
JST 0.035
BTC 90937.36
ETH 3169.73
USDT 1.00
SBD 2.99