Hacker News feedback

[captainbrosset]

Some good feedback on Hacker News: https://news.ycombinator.com/item?id=37319666

It would be good to go through it and identify what would make sense to apply to the site.

I like the idea, but I'm not certain how to make it useful beyond "casual reading about devtools". The very first tip I see is "Customize the way objects look" which is ok... cool you can do that, is this where it should start?

Also, it seems Safari only got a handful of tags and many of its unique (and very useful) features are missing completely from the list.

The very first tip I see is "Customize the way objects look" which is ok... cool you can do that, is this where it should start?

Seeing the first page, it feels like it could be useful, but I don't know how to make it useful to me.

Maybe it's lacking some kind of starring system? A "most starred tips" page would definitely be useful.

I think it would benefit from a rating system and a sort or filter based on that rating.

I think something that could help a lot of people would be a browser devtool comparison page. You can take your existing browser tags and show which devtool features exist on each browser. Personally, I would 100% use a guide like that to decide which browsers tools suit my needs.

The design of this page makes me feel it is all ads. A list of one ad after another.

It's too busy with too many elements trying to get the user's focus I think. Small tips: Remove the underline from the title of the "tip" and increase the margin between the tips themselves by a small amount. Maybe adjust the background color of a tip as well. Would make it look like this: https://i.imgur.com/m1WqTBU.png

on mobile, the images could be under the title rather than under the tags, and they could have the same width as the other elements.

The colours and text/image distribution remind me the low quality ads that appear at the bottom of some news places that simply it's a bunch of clickbait

Yes (looking at it from mobile), I think it's because of the fact that the images sit below the tags and there are no separator lines. My brain just doesn't get the connection between the title/text/tags block and the image at first glance, so it jumps to the conclusion that the image is an ad and not worth looking at.

Yes same, the google blue + the crispy image, it does reminds me of the old days.

Yes. I have this sudden urge to look for the ad close (x) button for some reason. I think it's the lack of a solid border, or box-shadow, or perhaps the lack of padding of the images. I'm not really sure.

[captainbrosset]

Trying to turn this into something actionable, I see 2 main changes:

• Turn the site into more of a learning experience. Make it clearer what this is (there isn't even an intro paragraph that says what the site is), provide maybe a few "collection" (see #85), and list the tips in a more logical manner: either based on user rating, or by categories, or something else.

  • not certain how to make it useful

  • the very first tip I see is [...] is this where it should start?

  • feels like it could be useful, but I don't know how to make it useful to me.

  • lacking some kind of starring system? A "most starred tips" page would definitely be useful.

  • sort or filter based on rating.

  • a browser devtool comparison page [...] I would 100% use a guide like that to decide which browsers tools suit my needs.

• Improve the design of the site, make it look less like a bunch of ads.

  • design of this page makes me feel it is all ads.

  • too busy with too many elements trying to get the user's focus.

  • Remove the underline from the title of the "tip" and increase the margin between the tips themselves by a small amount. Maybe adjust the background color of a tip as well. Would make it look like this: https://i.imgur.com/m1WqTBU.png

  • on mobile, the images could be under the title rather than under the tags, and they could have the same width as the other elements.

  • The colours and text/image distribution remind me the low quality ads.

  • the images sit below the tags and there are no separator lines. My brain just doesn't get the connection between the title/text/tags block and the image at first glance.

  • lack of a solid border, or box-shadow, or perhaps the lack of padding of the images.

[captainbrosset]

Turn the site into more of a learning experience

Proposal: Create a table of content that's visible on all pages, which shows something like this:

• Home
• Guides
  • Debugging CSS
  • Get started with perf improvements
  • ...
• Most viewed
• Tips per browsers
  • Safari
  • Firefox
  • Chrome
  • Edge
  • Polypane
• Tips per category
  • Console
  • Network
  • Web components
  • Highlighter
  • ...

The home page would have an intro paragraph about the website, and link to reset tips. The guides would be what I propose in issue #85. The most viewed section would provided a sorted list of tips. And the 2 other sections would be what we already have on the site.

It's better than today because: the home page gives context that's missing today. The most viewed is something people have been asking for. And the guides would be actual learning content which make it clearer why the site is useful, beyond just the individual tips.