Homepage: Update the News section
Closed this issue · 20 comments
The News section of the homepage, which is part of the home.php pattern, could use a light aesthetic refresh, and it would also be nice if we enabled support for the interactive features in the Query loop. This would allow users to view additional pages of news posts without reloading the page or having to navigate to the News section of the site.
Here is the current design, along with a few design explorations that incorporate the dots design we have been using on other sections of the site, like Showcase. Thoughts and feedback are welcome.
| Current |
|---|
| Exporation 1 (without dots) |
| Exporation 2 (with dots) |
| Exploration 3 |
@WordPress/meta-design for feedback.
I prefer the exploration 2. "What's new in WordPress" could have better copy, but in terms of layout and color, this one looks more in line with the footer. Assuming that section position will not change.
Assuming we went with Exploration 2, any thoughts on the heading copy @rmartinezduque?
Also, I forgot to note this, but @ryelle informed us that the News block is not actually a Query Loop. So for this iteration, we will not be able to have Prev/Next.
For Exploration 2, I guess we could switch out the Prev/Next with "View all". Thoughts @WordPress/meta-design?
Could we just update to a query loop? If not, I'll trust there's a good reason, and we can just omit the next/prev links for now, and go with a "More news" link, perhaps.
Could we just update to a query loop?
I believe it's not straightforward to pull an external feed into the Query Loop, unfortunately. @ryelle is this correct?
That's correct, because News is technically a different site, if we added a Query Loop here it wouldn't show anything.
On the call last week I mentioned that we could maybe filter the Query Loop to make it work, but I'm not sure how long that might take. For a "quick fix" we agreed to update the styles of this (Latest News block).
Assuming we went with Exploration 2, any thoughts on the heading copy @rmartinezduque?
I don't see any major issues with the heading copy, but it's true that "What's new in WordPress" could be perhaps interpreted as referring to the latest changes introduced in a release. Some first options that came up for me to help address the potential ambiguity (and make the purpose of the section a bit clearer):
- Stay in the loop
- Latest WordPress news
- Latest from WordPress
- Latest from the blog
@fcoveram, I'm curious to hear more about what you'd like to see more of in that copy. Do any of these options seem more aligned with what you were thinking?
Tagging also @thetinyl for awareness (in case she wants to add her thoughts).
Latest WordPress news
Latest from WordPress
Thanks @rmartinezduque! These are very clear and straight to the point. I'm leaning more towards the first.
An additional suggestion if we want to be a little more casual and broad (since we don't only publish straight up news on /News):
- What's happening around WordPress
I've made the update in wporg-mu-plugins & on the homepage, and will deploy that shortly.
There are no dots in the figma, so I didn't add those. I've also left the heading alone, so it's still "See what's new in WordPress".
When a heading is picked, that can easily be changed in the editor.
An additional suggestion if we want to be a little more casual and broad (since we don't only publish straight up news one /News):
- What's happening around WordPress
This one stands out to me.
Updated on production:
I just realized I missed updating the "view all" link too, so that can be updated to "More news" when the heading is changed.
I've moved this issue back to "Pending discussion" until we have the final heading text. At that point, anyone can edit the page to update the heading & link text.
@thetinyl @rmartinezduque I defer to you both, but I think "What's happening around WordPress" sounds good. Happy to make the updates to the page.
One small update to do, the font size for the heading should be 36px, not 50px.
"What's happening around WordPress" sounds good to me as the first option, too. 👍
If it is too long, we can opt for the alternative option "Latest WordPress news" (or "Latest WordPress stories" if we want to be more broad).
This is the updated design:
- Title updated to "What's happening around WordPress"
- Title font-size updated to Heading 3 (36px)
has-heading-3-font-size - Link updated to "More news"
- Update the top/bottom padding to
5rem. It's currently set tolarge, which collapses on mobile and doesn't look great.
Something to consider in a followup, the "What's happening around WordPress" means "More news" will wrap onto a new line on mobile:
That's not the end of the world as it wraps okay, but it makes it more of a primary, as opposed to if it could stay on the right it would be secondary. That could be an argument for the simpler "Latest WordPress news", which should fit it:
Ah good call. Mind if I copy this into a separate issue?
Feel free!