NHacker Next
  • new
  • past
  • show
  • ask
  • show
  • jobs
  • submit
Small, native web tricks worth remembering (htmlcat.net)
m-s-y 1 hours ago [-]
Love when I go into a car dealership and get to read all about the different cars. Specially when the cars aren’t actually there. In fact there’s not even a picture of a single car. Yep that’s my jam.
moontear 4 hours ago [-]
There are some good descriptions and hints, but what the site really needs is examples. Just looking at the code doesn't help me much. The descriptions are also mostly so short, that they could just as well be tooltips on the homepage. The whole premise of the page is a collection of "web tricks worth remembering" and I can't fathom what bash (e.g. `du -hd 1 . | sort -hr`) is doing there.
Aachen 1 hours ago [-]
fwiw I find `*` a lot easier in regular use than all of `-d 1 .`. It doesn't automatically expand to dotfiles but for regular typing, this advice looks like something you'd do if you're a robot or making an alias
marcomezzavilla 4 hours ago [-]
You’re absolutely right, thanks for the feedback. I initially included live examples (mostly through CodePen), but they were taking too much time to maintain, so I stopped.

The Bash entry was really just a half-finished personal note that I never properly edited. It’s probably out of scope too.

alpinisme 3 hours ago [-]
Codepen is an awful experience on mobile (and is slow, as you said). But your page is an html page about html tips. Surely you can just embed them in the page itself?
sam_lowry_ 4 hours ago [-]
Please keep it, personal notes are worth it. Maybe less navigation or +/- voting, then ranking would help us navigate your site?

Like in the good old commandlinefu.

ramon156 3 hours ago [-]
Silly question, why not just render the html on the pages? e.g. the popover is something I wanted to see
mceachen 47 minutes ago [-]
"... that matters" is the new emdash
marcomezzavilla 45 minutes ago [-]
Not AI, just not a native speaker.
OuterVale 5 hours ago [-]
They're not really 'tricks' as much of mentions of assorted features of HTML and CSS. You get to discover a similar assortment of things (with much more immediately available detail and many examples) just clicking around MDN.
happytoexplain 3 hours ago [-]
Sure, they're not "tricks", but it's also definitely not the same as what you get randomly browsing formal documentation.
markuswagner 2 hours ago [-]
What's the difference?
marcomezzavilla 4 hours ago [-]
That’s fair, "tricks" may be overselling it. The website is meant to be a small, opinionated collection of features I want to remember, not a replacement for an authoritative reference like MDN. I can probably make that positioning clearer.
4 hours ago [-]
andai 20 minutes ago [-]
What does native mean in this context?
hndhyc0bdt 19 minutes ago [-]
This pushed me to finally act on it
apples_oranges 4 hours ago [-]
please don't hide scrollbars :)
chrismorgan 4 hours ago [-]
Yeah, that was the first one my eyes went to. The only scenarios I can think of where it is acceptable to hide scrollbars are infinite canvases where you’ll draw your own non-linear ones (and even then be disappointed because they can’t look or behave natively), and things like maps where you remap scrolling to zoom and might want to use a backing invisible scroll area for that rather than consuming scroll events (which are somewhat more limited).

In short: unless the native scroll bar will be wrong, do not under any circumstances hide it.

marcomezzavilla 4 hours ago [-]
If you mean the "Hide scrollbars" note, I agree 100% (:

There are a few specific situations where it can be useful, but I added the caveat precisely because it’s generally not a good practice.

IndySun 4 hours ago [-]
>There are a few specific situations where it can be useful

re scrollbars, Can you give an example?

archerx 3 hours ago [-]
An online game for example.
marcomezzavilla 3 hours ago [-]
Sure. I was thinking of fairly narrow cases, not ordinary page scrolling:

- A swipe/drag carousel with visible arrows or dots, especially a looping carousel where the native scrollbar does not represent a meaningful start and end

- An accordion or expanding panel that animates to reveal all of its content. During the transition, its intermediate height may briefly produce a scrollbar (and a visual flash), even though the fully expanded state does not need one

- Highly visual or experimental interfaces where scrolling is communicated through another control, or where the scrollable area is decorative and scrolling is not required to access the content

afavour 3 hours ago [-]
Only time I've seen that work is when making a carousel. Once you're using scroll snap it's already not going to behave the way you'd expect a scrollable container to, so having a different indicator doesn't feel so egregious to me.
herrherrmann 2 hours ago [-]
Neat! I like these opinionated lists, especially when it’s easy to browse and cherry-pick useful stuff. It’d be very good to mention how compatible the features are, though. Especially with newer CSS features, it’s easy to overestimate how ready they are for all browsers.

For that, there could just be links to the related MDN and/or caniuse.com pages.

chrisweekly 37 minutes ago [-]
Yes. MDN and caniuse.com are great. See also https://webstatus.dev and https://web.dev/baseline
marcomezzavilla 2 hours ago [-]
[dead]
tylerius 3 hours ago [-]
Best resource for proper HTML+CSS development is Jason Knight AKA deathshadow's CUTCODEDOWN (cutcodedown.com at Web archive) and his articles at Medium and CodePen (user Jason Knight).
yurishimo 2 hours ago [-]
How is an archived web site supposed to be a good resource on modern html and css development exactly?
andai 18 minutes ago [-]
We plateaued about 10 years ago right?
mrbluecoat 2 hours ago [-]
I'm always googling how to center with CSS.. bookmarked.
hk__2 4 hours ago [-]
> Each post-it pairs one useful platform feature with a small example

I can’t find a single example; each post-it just shows some code but not the result of it.

happytoexplain 3 hours ago [-]
The code is the example. "Demo" is probably a better word for what you're thinking of.
JodieBenitez 1 hours ago [-]
Nice tips there ! :)
markuswagner 2 hours ago [-]
Super neat! Rare to see a genuinly actually useful opinionated list like this.
vortegne 3 hours ago [-]
without demos this is mostly useless i think
ChrisArchitect 52 minutes ago [-]
Not to be confused with https://http.cat/
stevecoalbear 23 minutes ago [-]
Did you know that to have a .cat domain, your content needs some link to the nation of Catalonia? That is why they offer a Catalonian translation.
marcomezzavilla 46 minutes ago [-]
I often end up there by accident and have a laugh every time.
jobuildsstuff 59 minutes ago [-]
[flagged]
noobplus 2 hours ago [-]
[dead]
hn9rsvy2gx 2 hours ago [-]
[dead]
hn5xz7plcj 3 hours ago [-]
[dead]
Guidelines | FAQ | Lists | API | Security | Legal | Apply to YC | Contact
Rendered at 14:47:58 GMT+0000 (Coordinated Universal Time) with Vercel.