5 ms·
Ask HN: Why are the upvote arrows so small?
The .votearrow element on HN is 10x10px:
.votearrow {
width: 10px;
height: 10px;
border: 0px;
margin: 3px 2px 6px;
background: url("triangle.svg"), linear-gradient(transparent, transparent) no-repeat;
background-size: 10px;
}
On mobile, I keep tapping the title instead of the arrow. I've been running this override via Stylus for a while:
.votearrow {
width: 40px;
height: 40px;
margin: 0;
background-repeat: no-repeat;
background-position: center;
background-size: 16px;
cursor: pointer;
}
- juped 3mo agoThey're fairly large (larger than lowercase letters in the header text, comparable to uppercase). Glad you were able to fix it since you prefer them much larger.
- guilhermeasper 3mo agoSince this is an action, I disagree that 10px is "fairly large". According to WCAG https://www.w3.org/WAI/WCAG22/Understanding/target-size-minimum.html https://www.w3.org/WAI/WCAG22/Understanding/target-size-mini... It should be 24px minimum, we shouldn't be comparing with the title either.
- fuzzfactor 3mo agoI know what you mean but it always seemed to me that voting is not a main feature, merely an accessory.
- krapp 3mo agoTo be as unintrusive as possible, as per HN's general minimalist aesthetic. Also HN was designed to be used on a PC, not mobile, around what looked good enough to pg in the early 2000s.
- al_borland 3mo agoI just zoom in on mobile if I really want to vote on something. I prefer that to the idea of a “mobile-first” site overhaul like much of the web has done. In nearly every case those efforts seem to make things worse.
- guilhermeasper 3mo agoThat's what I used to do until I discovered the Stylus extension and created an override for it. I think the change should apply to both (desktop and mobile).