Stories
Slash Boxes
Comments

SoylentNews is people

Submission Preview

Link to Story

Changing the Site UI to Making Long Stories Easier to Navigate -- Input Requested

Accepted submission by martyb at 2020-03-20 13:42:15 from the putting our heads together from a distance dept.
Rehash

First: Please accept my best wishes to everyone during SARS-CoV-2 / COVID-19 / Coronavirus pandemic. Please take all necessary precautions to keep yourself and those around you safe!

Second: I should not have been surprised, but I must confess my admiration at how the SoylentNews community came together in support of each other in response to SoylentNews Community -- How has SAR-CoV-2 (Coronavirus) / COVID-19 Affected You? [soylentnews.org] As of my writing this, there are over 300 comments! community++ This is what I had hoped for when SoylentNews started over six years (Wow!) ago, and so validates my giving of my time to this site!

Third: (and the focus of this story) our virus roundup stories are... long. An AC posted a comment: thanks to eds [soylentnews.org]:

Thanks editors for pulling together this summary. SN for the win!

One comment--it is kind of long to scroll down through, to get to the comments. Perhaps next time some of the longer stories could be put inside the spoiler tag?"

This was quickly acted on by a member of staff, but that was not universally embraced as a "Good Idea". Both Soylentils, to my eye, had good points. If I am visiting an active story again, I have already read the story (both the "Intro Copy" and the "Extended Copy"). Why should I have to scroll through a wall-of-text to get to the comments? The suggestion of using <spoiler>...</spoiler> to bracket the contents of each of the merged stories seemed like a reasonable suggestion. But, when you have a hammer... Right idea, but maybe not quite the right tool.

Aside: If I am reading a review of, say, a movie, then a spoiler is an appropriate way to hide plot details from those who have not yet seen the movie. That is not the situation here. Why hide details of a story about the pandemic? Hmm. A good first try, perhaps, but it looks like we need something different in this case.

Idea: what if there were, say, a button at the top of the story that I could click and be brought immediately to the comment section of a story? Hey! I can do that!

Acknowledgements: At this point, I hereby express my sincere thanks to AndyTheAbsurd for constructing some CSS which allowed the conditional display of a button, and to FatPhil for his testing efforts. Thanks guys!

So, I hacked up something that I hope addressed the initial concern: "kind of long to scroll down through". I'll be the first to admit the implementation is crude. We can go for pretty later. (The perfect is the enemy of good enough, right?) I think the ideal would be to have a separate nexus for virus-related stories. That way we would not feel compelled to gather a bunch of story submissions into a single story. We could process each submission independently and release each on its own. Unfortunately, there is much more to it than just adding an entry to the site DB.

It has been implemented on our development server: https://dev.soylentnews.org/ [soylentnews.org] and I hereby solicit feedback from the community on how well it works. It was implemented with one addition to an in-memory copy of a single site template (dispStory;misc;default).

Now what? Feedback! This is your site. I am well aware there are Soylentils who have a much better grasp of HTML and CSS than I do, and am hereby soliciting supportive feedback.

Test scenarios:

  1. Does the "Skip to comment(s)" Button not appear on the main page?
  2. Does the "Skip to comment(s)" Button appear on the story page?
  3. Does it work?
  4. Is the appearance consistent across all of the available themes?
    1. Site Default
    2. BadA55
    3. Chillax
    4. Grayscale
    5. Black IcIcle
    6. Night Mode
    7. NV
    8. OMG PWNIES
    9. SoylentNews
    10. Vomit
    11. VT100
    12. VT220
  5. Is the layout consistent other homepage settings?
    [] Simple Design
    Simplifies the design of Dev.SN to strip away some of the excesses of the UI.
    [] Low Bandwidth
    Reduces the size of pages for people with slower network connections
    [] No Icons
    Disable topic icon images on stories.
  6. Which of the preceding homepage settings would be better served with just a simple anchor?

    <a href="@acomments">Skip to Comment(s)</a>

  7. Other, what did I miss?

Original Submission