12
31 Comments

Roast my blog article layout

https://jankoch.co/create-a-content-marketing-plan

Roast my blog layout:.

Without distracting too much from the email optin, how would you incentivize visitors to read more blog articles?

Don't hold back, I can take it.

submitted this linkon September 17, 2022
  1. 2

    Personally, I do not like 60/40 split between the content column and the sidebar. I'd rather see content occupying more space.

    1. 1

      This came up multiple times, so there must be something to it.

      Thanks!

  2. 2

    Good effort. However, I like idea about having the subheadings to come with different fonts; or even including a "Key Points" or "Key Summary" section.

    1. 1

      Typography certainly can be improved, thanks for the feedback!

  3. 2

    AAAAAAA!!!! Margin padding CSS !!!!

    1. 1

      Fixed and put the fonts into better proportion too, using https://type-scale.com

  4. 2

    Looks good to me! Although, with all that text, is there anyway to add color for highlighted points, differentiate the subheadings with different fonts; or even including a "Key Points" or "Key Summary" section. Otherwise, it looks good!

    1. 1

      Highlighting key take-aways with colored elements is a great idea!

  5. 2

    Your landing page should have a good collection of your popular blog posts. Anyone landing on your homepage will have nothing to read. That's strange for a blog.

    Include more of your popular posts in the homepage.

    The blog layout is fine but thumbnails speak a lot more than blue underlined words. So, you might want to consider adding thumbnails to your side bar's related posts. And your side bar should include fixed content. Add images to your contents too.

    1. 1

      Thanks for the feedback!

      The landing page is actually focused on driving people to my email list or products - I didn't put blog posts on there intentionally.

  6. 2

    So the first thing that comes to mind is that the sidebar is under-utilized. So instead of recent posts I would change that to related posts. If someone is reading an article about a certain subject, they probably want to learn more about it, so giving them related articles is a good way to keep them on your site and get them to convert.

    1. I would add a comments section. You want that engagement. People might give you suggestions for new content, or ask questions that lead to conversations and sales.

    2. Add a post image. Visuals are very important. People tend to skip articles if all they see are blocks and blocks of text. So add an image right below the title and then sprinkle some more throughout your posts.

    3. Add social sharing. This could be a floating social sharing bar on the left, or just below the post image. Just have an option somewhere where people can share your posts.

    4. Add your newsletter optin or some related free offer to the sidebar to get more leads.

    if I think of anything else I'll add to this list but this is a very good starting point.

    1. 1

      Thanks for the excellent reply! Plenty to work on 💪

  7. 2

    I would agree with @MrJustinF I would move it to the left or remove it and just add recent posts to the right side of it. And maybe add some images to break up the text for easy reading.

    1. 1

      Thanks, KBM!

      I'll get rid of that ToC widget and will replace it with recent posts or something like that.

      Images are a good point. Adding some screenshots of tools I use or some fun AI art could work 👍

  8. 2

    This looks like it will be very subjective. Personally, I'd prefer the outline on the left. Also, I generally am not a fan of sticky outlines unless the article is massive (2500 words or more). For shorter articles like this one, it's a little overkill.

    1. 1

      Much appreciated, thank you Justin!

      How'd you go about keeping people reading other stuff on the site?

      I'm debating whether it makes sense to add some form of "related posts" widget to the sidebar...

      1. 2

        Related posts or some kind of interesting call-out in the sidebar could work. I put them at the bottom of the blog post (as I've always preferred single column for better reading experience). Also, think about mobile. Sidebars won't appear until bottom anyway.

        1. 1

          I'll try that, thanks!

  9. 1

    MORE IMAGES / GIF Make it enjoyable to read.
    Backlinko Blog are known to be the best blog layout. check their layout design illustration etc... that's a link of one of their blog post:
    https://backlinko.com/conversion-rate-optimization

    1. 1

      Thanks for sharing this example.

      I personally cannot stand the layout. Brian and his team are exceptional and their content is, too.

      But the sheer amount of media makes it so hard to read IMHO, it's impossible to skim through it to decide whether or not there's a particular section of interest to me.

  10. 1

    Would like to see Table of contents so that I can quickly "skim through the content"

  11. 1

    The styling reminds me of the YCombinator website.

    1. 1

      Thank you! They probably invest a lot more money into their layout than me, so that's a big compliment :)

  12. 1

    Recommended reading https://www.smashingmagazine.com/2012/03/designing-engaging-enjoyable-long-form-reading-experiences/

    Definitely make the margins larger on laptop and up, the text hugs the edges too closely

    1. 1

      Thanks for the link and the recommendation - just added more spacing to the mobile and tablet layouts!

  13. 1

    <a href="https://cakra-buana-elektrindo.com/">excellent</a> Keep up the work , I read few articles on this site and I think that your web blog is real interesting and Power to the People of excellent information.

  14. 1

    I'd advice to get a background picture for every blog entry.

  15. 1

    good but considering using wordpress you should be able to get much better structured theme

    the sizing width fonts and more does not feel professional

    1. 2

      Thanks! I'll dig into some best practices on responsive font sizes. I am using the Oxygen Page Builder on WordPress - it is blazingly fast but doesn't come with a lot of pre-designed styles.

  16. 1

    an image at the top will be great...mostly all of it is text at the top so you can try adding a gif or an image

  17. 1

    I had 5 minutes so put together this design for you that cleans up the layout slightly: https://figma.fun/pJUiF9

    1. I think your logo is huge and would be better off being smaller. It takes up a lot of real estate on the site.

    2. Adding some spacing on the sides makes the content easier to read. The human eye really enjoys reading content anywhere between 812 - 1200px wide.

    3. Having some additional bits of content in the sidebar is cool but having more separation from the main article will help when reading. I would also make it sticky (follows the user when scrolling down) so that when they finish reading they can click on another article to read.

    4. You should think about having your CTA half way through the blog article. This should help with conversion as some people may not finish the whole article.