Enhancement: Blog landing page

[Chaitanya-Shahare]

To improve the user experience and visual appeal of the blog landing page, I propose the following enhancements:

Proposed Changes:

• Read More Button: Replace the current anchor text with a more prominent Read More button for each post.
• Post Metadata: Include post metadata such as author name (with profile image and hyperlink), date, and estimated reading time.
• Project Labels: Add labels to indicate the project related to each blog post, helping users quickly identify relevant content.
• Excerpt Consistency: Truncate the post excerpts to 2-3 lines for visual consistency across the page.

Optional Enhancements:

• Interactive Elements: Add interactive elements like scaling effects on hover to make the page more engaging.
• Banner Images: Introduce banner images for each post to enhance visual appeal.
  • Note: This would require authors to create and upload banner images for their posts.

[Chaitanya-Shahare]

@vgvassilev Can you please review this?

[vgvassilev]

We also could have some sort of sorting thingy. In jekyll there is a way to add keywords and filter by keyword, eg "gsoc", etc...

Maybe we should make it more "visual" by adding the author photo and encourage people to upload blogposts with thumbnails.

@QuillPusher what do you think?

[Chaitanya-Shahare]

I'll start working on the more obvious tasks, that are

• Post & Author metadata and image
• Excerpt Consistency
• Adding a read more button

[Chaitanya-Shahare]

@QuillPusher

Could you please confirm your preferred name format?

• QuillPusher
  or
• QuillPusher (Saqib)

Reason

To streamline our process, I'm working on linking all references through the name and the data in _data/contributors.yml. Consistency in the name format across all pages will greatly simplify this task.

Thank you!

[vgvassilev]

@Chaitanya-Shahare, is that something we can close now?

[QuillPusher]

@Chaitanya-Shahare Sorry I missed this, I was traveling, with limited connectivity. I just looked at the blog page, looks nice 😎

Could you please confirm your preferred name format?

Re: Either is fine 👍

Banner Images: Introduce banner images for each post to enhance visual appeal.

Re: I've found it harder to select banner images for technical/scientific blogs, it can end up making it look less serious. Let me know if this is a priority, so I can create images for existing posts.
Also, let me know the best suited image dimensions

• typically, 16:9 banners look better on the blog page.
• Alternatively, you can only opt for square thumbnails for the Blog List page and not use images on the actual blog posts (advanced sites crop the same image for both purposes, but that takes more time and effort, so we'd like to avoid that)).

Large Banner

Square Thumbnail

CC: @vgvassilev

[QuillPusher]

@vgvassilev

Maybe we should make it more "visual" by adding the author photo

I can see this has already been implemented, it will put a face to the idea and encourage people to click on the image to see more about the author and their related posts/code contributions 👍

encourage people to upload blogposts with thumbnails.

We need to decide the standard size of the thumbnail/banner image as discussed in previous comment (and see if this is really needed. I don't often see banner images on technical blog posts) 🤔

In jekyll there is a way to add keywords and filter by keyword, eg "gsoc", etc.

I see tags have already been implemented. It would be smoother if clicking on the tag hides posts from other tags (since one post can appear under multiple tags, causing confusion), but that's just a nitpick and I'm not sure if that's feasible on a static site (since in this case, there will have to be a new page for each tag, instead of on long page with tags listed in order) 🤔

[Chaitanya-Shahare]

I see tags have already been implemented. It would be smoother if clicking on the tag hides posts from other tags (since one post can appear under multiple tags, causing confusion), but that's just a nitpick and I'm not sure if that's feasible on a static site (since in this case, there will have to be a new page for each tag, instead of on long page with tags listed in order) 🤔

I tried to look for such an implementation but didn't find something like this (one page one tag) since jekyll doesn't create new pages until explicitly told.

We can try to get this feature to work by writing a custom jekyll plugin. I that something I should work on?

[Chaitanya-Shahare]

@Chaitanya-Shahare, is that something we can close now?

I wanted to ask exactly what @QuillPusher pointed out, should we start working on the adding banners and thumbnails?

[QuillPusher]

We can try to get this feature to work by writing a custom jekyll plugin. I that something I should work on?

Re: My vote would be: No. It is better to stick with default functionality, with minimum plugins, for the sake of maintainability.

should we start working on the adding banners and thumbnails?

Re: When/if this feature is implemented, to kick things off, I can provide images for existing posts (need to decide image dimensions for that, above images can be used for testing with the feature). Later we can ask contributors to use tools like Canva to cook these up for their posts 🚀

[vgvassilev]

In terms of banners maybe we can add the gsoc banner for the gsoc related posts. Otherwise of other posts we can encourage people to upload some images.

[Chaitanya-Shahare]

Okay for now I'll use a placeholder image for banner and thumbnail, and start working on it.