Welcome to ManageWP.org

Register to share, discuss and vote for the best WordPress stories every day, find new ideas and inspiration for your business and network with other members of the WordPress community. Join the #1 WordPress news community!

×

UX input for the front page

Dec. 20, 2013

File this one under IMHO, but I'd prefer the front page or 'HOTTEST' page to be laid out a little more like the 'LATEST' page. That is, more headlines. Particularly on mobile. I do like the visual layout of the front page but use this great site for it's content value. Yes, function over form in this case. I'm a headline scanner/scroller when it comes to news consumption due to limited time and the sheer volume of content available. But it is just a minor inconvenience to have to keep hitting 'load more' especially after missing a day or two of visits.

One possible solution would be to use infinite scroll instead? Another idea could be to have one front page with a sorting type of toggle for 'LATEST' and 'HOTTEST'.

I just don't want to miss all the good stuff that gets buried after a few days.

Comment
8 votes   Flag
Dave Warfel

I agree with all of your suggestions, Leif, and would be happy with any of your proposed solutions (infinite scroll, toggle display options, "latest" page layout). More content, more easily accessible, on the front page is a good thing. I sift through the articles in very much the same way as you described.

I also don't think this is high priority, either, and I'm sure Vladimir has plenty of other things on his plate.

All opinion, of course, but that's what "Discussions" are for, right?

Reply
Vladimir Prelovac

Infinite scroll is kind of hard to do as we do not know where to put the footer then (it would never be accessible). Any ideas - welcome.

We have increased the size of home page from 18 to 24 blocks, and we will increase the size of load more from 9 to 12 new stories so this should do the trick.

Reply
Leif Quitevis

Yup. Noticed this on my Kindle right away. Thanks!

Reply
Dave Warfel

Nice, quick & easy solution. Thanks for the update.

For the footer issue, you could use position: fixed; to keep it at the bottom of the browser window.

footer {
position: fixed;
left: 50%;
bottom: 0;
margin-left: -500px;
background: #f1f2f2;
width: 1000px; }

** You're not currently using the footer element anywhere else, but it might be worth adding a class or id to it, and targeting it that way, in case you want to use the footer element elsewhere in the future.

The way you have the p tag with your copyright info is something I'm not familiar with, but I used my Inspector to add a few lines to its CSS to get it to play nice as well.

footer>div>p ...
- change the width to 1000px
- add a background color of #f1f2f2 (even though it's a child of the footer element, it does not pick up the bg color of footer)

Not sure if this is good UX for mobile, too, but that's how I'd approach the desktop footer issue with infinite scroll.

Reply
Vladimir Prelovac

Thats a good hack, I didnt think of it. Mobile could be a problem as you say.

I am wondering for those using managewp.org mainly on mobile would a layout similar to latest be better for the home page?

Reply
Leif Quitevis

I use my Kindle Fire in portrait mode for mobile browsing and the 'Hottest' interface is fine. The boxes stack up vertically as they should. It's actually easier to flick scroll than use the scrollwheel on a mouse. I just tend to reach the bottom quickly.

If more space is needed to fit more boxes/articles, then I was thinking of taking it out of the featured image space, which takes up a good percentage of the box. This would reduce the size of each box. Maybe around 50% or so? The featured image is the most expendable part of the article to me. Again, just my opinion.

So if I had to choose between the 2 layouts, I'm with Dave and would go with 'Latest'.

Reply
Dave Warfel

I would love to see the "latest" layout on mobile for the main homepage (hottest/top stories).

It's far easier for me to navigate, glance at many headlines, and choose the ones I want to engage with.

Reply
Leif Quitevis

I agree. Thanks for offering some solutions, Dave.

Reply
Vladimir Prelovac

Very good, let me write that down

Reply