Kathy: let's talk about the
problems – shared spacing incentivized to make smaller,
toolbars and vertical lists would not pass – better dealt with
in personalization rather than reducing information density for
everyone
... options they were thinking is have a minimum size that's
smaller no spacing, fix spacing so not incentivized to do
smaller
... but a talk about icon sizes – we have to be careful not to
tap research on that because that's a different thing.
Microsoft size right now is 24 pixels by 16 pixels.
... they're saying that the width is the first one minimum of
24, height is minimum of 16. They also recommend tile padding –
tile plus spacing tile needs to be 66% of the width and 50% of
the height. The size of the icon can be smaller but the padding
that you have around it becomes the 24 x 16. So the tile
padding plus the icon is that. They recommend 16% of height and
with to be the margin between icon. So they are looking at
a[CUT]
... two things – default plating, icon 16 pixel on a 24 pixel
plate.
Jake: we have discussed all
issues which have been brought up before. During the
conversations I've watched it seems like going in the direction
of providing a AA target size which is smaller.
... my understanding for the past year is not that we want to
solve the problem of 16 pixel targets but also those 26 pixel
targets which are too close to each other when they don't have
target spacing. That was the intent of this criteria. If that
is so I think that should still be our goal and not defining
another target size criteria. We may, but that's not what we
were trying to solve with this one. The 8 pixel spacing morphed
in[CUT]
... so would be good to start out with what is the intent. Is
that for smaller targets to have spacing? Do we also want a
minimum target size besides the AA?
... is that correct, do you agree?
Kathy: what the Microsoft boiled
down to was having a 24 x 24 pixel with 16% margin. If we came
out and said that no target can be less than 24 x 24 with the
margin plus the plating and no less than 16%, in between is
3.8
... we could say 24 x 24 with 16% margin – or spacing
Sukriti: need to define – target area would be the padding in the icon in the middle, and then the margin would be just pure spacing
Jake: my first suggestion would be target spacing of at least four pixels. It seems strange that if you size up your target your spacing also needs to be sized up because the problem gets smaller instead of bigger so why would you need more spacing
Kathy: it's the target touch area – the whole idea with the spacing is to avoid touching two targets at the same time.
Jake: that would mean if you have a 42 pixel like the W3C has on their site you need to have almost 8 pixel target spacing at 42 at 44 you don't need it anymore. Same gray area where the target gets bigger. we started out with eight pixels that's fine with 44 minus eight, but all those targets in between suffer because they get even bigger than 44.
Kathy: so Microsoft, just for clarity's saying that you take the 16% of the smallest dimension either the height or the width. so if 12 x 24 you're taking 16% of the 12.
Sukriti: it will incentivize smaller target sizes if we go by percentages or the flip site is annoying people who are already using larger icons
Jake: height is 42 pixels. 16%
they must become 50. That is six pixels more than 44 x 44. They
can make them bigger to 42 or they can make them smaller to fit
the design exactly.
... we morphed the wording into a text where we can still fit
into 44 x 44 size. If we step away from that and do the 16% we
get that again
Kathy: what if we say target areas are at least 24 x 24 pixels and if the targets are less than 44 x 44 you have to have 16% of the height or the width spacing around the target area
Jake: the 16% between 36 and 43 pixels
Kathy: we put a clause in there –
if you're target area and spacing is 44 x 44 pixelsyou are
fine. If you have a smaller target you need to have 16%
spacing. So you can have a smaller target with less.
... if your target is 16 x 16 you need to take 16% of 16, 3.8,
so then your margins are 22 x 22, but if you have a larger
target the max spacing plus target area is 44 x 44.
Jake: if I look back at all the
previous discussions – if you say the target spacing is at
least four or eight or something between four and eight but if
your target is above 34 pixels than the total should be – if
the total is 44 or bigger your fine. Else statement makes it
way easier and we're almost back to the way we started
... we might go back to the old proposals and probably one of
those will fit pretty easily and then we do not have the
minimum of 24 with 16% calculation. We might end up with a way
simpler one from a calculation and automated tool perspective.
Does that make sense?
Sukriti: 44 by 44 – is there another sticking point?
Kathy: the margins can
overlap
... replaying what I think Jake said – minimum target area is
24 x 24 pixels. If the minimum target area is less than 36 x 36
then we need to have 16% spacing otherwise that's not
needed.
Jake: no
Kathy: is there a minimum target size you are discussing
Jake: we discussed it, but that's not what we are trying to solve. We had research also Microsoft
Kathy: they just updated their recommendations
Jake: we just started out if your target is not 44 x 44 we need spacing it was as simple as that. And then pretty soon we discussed okay that seems fine when you have 34 x 34 icon or less, but when it's 35 suddenly become bigger than 44 x 44. So he tried to solve that. When you are between 35 and 44 another rule applies.
Kathy: if you have a minimum
target of 24 x 24 but if your target area is 34 x 34, or 36,
then you need to have margins that get us up to – don't have to
be bigger than 34 x 34 but smaller icons can also be smaller,
which will take care of the issue with vertical list and
toolbars but the spacing in between needs to be 16% of the
height or the width
... because that way were minimizing the fact that you can't
have really really tiny target areas. And we are setting a
minimum of what they have to get up to because if you are at 33
you only have to get up to 34
... if you have a smaller target that is 24 x 24 –
... between 31 and 34 pixels
... could say the target area is a minimum of 24 x 24 and the
total target area plus spacing needs to be 31 x 31
Jake: if I simplify this one and
the intent is still the same and the problem for users clicking
on the wrong one is still the same, if I see a couple of links
and they are 24 pixels high and now they only need to have a
target spacing of four pixels – 32 pixels while we aimed at 44.
The same problem we were trying to solve will not be
solved.
... if that doesn't solve the intent of clicking the wrong link
that doesn't match right now. Still the 16% doesn't match if
the target gets bigger, than the target spacing also becomes
bigger. Not a lot, but that feels like okay, I make the target
50% bigger and the spacing also needs to become 50%
bigger.
... how to solve – maybe we don't say 44 now but 32, that must
be a deliberate decision, now try to solve the 32
question
... we still end up with a gap between 32 and 44 pixels
... we deliberately didn't mention it a minimum target size
Kathy: the feedback that we are
getting is that we are incentivizing the small icons and that
we get something that is smaller and it's also going to break
when we have toolbars.
... we could simplify it – minimum target size of 24 x 24
pixels with at least four pixel margins unless the size is >
34 x 34
Sukriti: it can also be solved by saying the inactive space cannot overlap. That solves the incentivizing smaller touch targets
Jake: the boundary of the area targeted?
Sukriti: right now some of the feedback reads when there are two torch targets close to each other can the area between them overlap the answer was yes – if we say no than that solves the problem of incentivizing smaller icons
Kathy: Sukriti can you take a stab of writing what you are thinking into the irc
Sukriti: I'll also draw to
demonstrate with the commenters were trying to say
... the first example is where there is no overlap – if you
don't allow them to overlap and there's no incentive for
developers to overlap and make icons smaller
Jake: I think there are two
possibilities – spacing is between active target areas – active
spacing is where the calculation is. It becomes more difficult
when there not on the same horizontal line, calculation
difficult
... if they are close to each other you have a lot of space on
one side to click the proper target you don't have to click
exactly on the middle line so that was not an issue. I think we
define clearly that the target should not overlap. If clickable
area is on one border you have enough room on the empty space
where you can still click
Sukriti: here is where it gets tricky – where there are three buttons. The middle one
Kathy: for each target there is
an area with a width and height of at least 44 pixels that
doesn't include any other targets
... we didn't specify there needs to be a minimum size, just
clickable 44 CSS pixels area and it doesn't include other
targets. So that area 44 CSS pixels doesn't include any other
target. So we already have that
Sukriti: looking at Detlev comment from the issue: the intention was that inactive spaces should not overlap
Kathy: why don't we try to say no inactive targets in another way
Sukriti: I was recommending
originally the not overlapping of inactive spaces and that
would make the whole thing clearer but also very painful for
people to change their designs and introduce extra spacing
where it's not needed because we are specifying not having any
other touch targets in that area
... I think that's good enough. Specifying minimum targets gets
tricky especially for native apps – Google recommendation
Jake: almost all Google products pass, just recommendation
<Kathy> For each target, there is an area with a width and height of at least 44 CSS pixels that includes it, and no other targets where the inactive space cannot overlap, except when:
Jake: I think that's another
issue – we wanted to fix the gap with the target size ending up
AAA
... current wording but a clearing on the overlap, but
personally I like at least some target spacing where we fix
that gap of targets becoming larger– if we say 44 is enough
<Kathy> For each target, there is an area with a width and height of at least 24 CSS pixels with a minimum margin of 4px.
Kathy: I have two suggestions and we can present both of them and we can come up with more – pasted above.
<Sukriti> present_
<Kathy> For each target, there is an area with a width and height of at least 24 CSS pixels with a minimum spacing of 4px.
Jake: there is a gap between 32 and 44
Kathy: I'd rather get something in the nothing at all. I do think that some spacing is needed between targets. At the minimum that Microsoft has right now and their smallest target is four pixels around both the height and the width.
Jake: so instead of eight we are now back at four and instead of not mentioning a minimum target size we set the bar at 24 pixels
Kathy: so the area has to be at least 24 CSS pixels with a minimum spacing on the height and width of four pixels
<Kathy> For each target, there is an area with a width and height of at least 24 CSS pixels with a minimum spacing on the height and width of 4px where the spacing cannot overlap.
Sukriti: so between two adjoining targets it would be at least eight pixels
Kathy: do you see that as a problem?
Sukriti: no, I think that works really well
Jake: that feels like the eight pixels target spacing we started out with
Kathy: yes, but we said eight pixels around it, now we are saying for pixels around it
Jake: and we didn't do the overlap before
Sukriti: this clarifies, takes each element on his own
Jake: we still have that weird in between sizes
Kathy: spacing cannot overlap unless the total area of the target plus the spacing is greater than 44 x 44 CSS pixels
Sukriti: or how about if the icon is greater than 40 pixels
Jake: 36, because on all sides
<Sukriti> For each target, there is an area with a width and height of at least 24 CSS pixels with a minimum spacing on the height and width of 4px where the spacing cannot overlap. If the target is greater than 36 px and less than 44 px, the spacing can overlap.
Jake: we don't need the area
anymore – we came to the conclusion before that almost all
elements are not less than– we talked about those sizes. What I
want to mention here is we introduced the area to cover the
gray area
... easier if there is no target spacing
Sukriti: one thing that might
come up is what if this is not square
... in that gray area the 36 and the other dimension is smaller
than 36 do we allow the spacing to overlap in both dimensions
or just one
<Sukriti> For each target, there is an area with a width and height of at least 24 CSS pixels with a minimum spacing on the height and width of 4px where the spacing cannot overlap. If the target width or height is greater than 36 pixels and less than 44 pixels, the spacing can overlap.
Kathy: there's also a lot of talk about being able to go to 200% and then what's the target size. If we look at that and say okay, if were looking at the minimum going up to 200% what would then at 16 would be 32, if we say 22 it's at 44. So we might want to consider something like that where if it's two times we are looking at 22 pixels so that at least one of the height or width is 44
Sukriti: 24 gives it even more of
a margin of error in that case
... we can point to the Microsoft document for 24
Kathy: if the height or width is greater than 22 pixels spacing is not required
Jake: zoom does not change CSS pixels
Kathy: I understand, Microsoft
Apple have both said – noted that at 200% the target area
becomes double what it is so that's where they are getting
their minimum spacing for their tile icons. I was bringing up
that
... so I'm saying if were looking for a target where one
dimension is bigger if you are at two times you can get up to
44, so if we use 22
... we said earlier if the target is big enough we don't really
need the spacing because we've got the adequate area for
somebody to touch
... so it goes with the 44 that we have in AAA, but were
counting on in AA that people can go up to 200%
Jake: zooming is rejected for other reasons – where you are, zoom in and out to have the overview back – not sure zoom should play a factor
Kathy: point taken – so let's go back to what Sukriti had
<Sukriti> For each target, there is an area with a width and height of at least 24 CSS pixels with a minimum spacing on the height and width of 4px where the spacing cannot overlap. If the target width or height is greater than 36 pixels and less than 44 pixels, the spacing can overlap such that there is no more than one target in a 44X44 area
Sukriti: I added the still no more than one target part
Kathy: what's the reasoning for less than 44 pixels
Jake: if all those scenarios for the text I think we have a pretty good
Sukriti: 44 already meets the requirement – I think the arguments will come from 24 plus eight all the way to 44. Second cause of the statement we still need only one target per 44 x 44 area solves that
Kathy: based on Jake's comments is there something we should change
Sukriti: to make it even clearer – the overall area in which the target exists is 44 x 44 – adding that to the spacing as well
Kathy: for each target there is an area including the spacing with a width and height of at least 44 CSS pixels
Sukriti: yes – for the second clause. We still keep the 24 and the first clause. We can point to the Microsoft research, not arbitrary
Kathy: three point eight if you
take 16%, we are just rounding it up to four
... we need to say CSX pixels
<Sukriti> For each target, there is an area with a width and height of at least 24 CSS pixels with a minimum spacing on the height and width of 4 CSS pixels where the spacing cannot overlap. If the target width or height is greater than 36 CSS pixels and less than 44 CSS pixels, the spacing can overlap such that there is an area with a width and height of at least 44 CSS pixels with no other targets.
<Sukriti> Each target should have a width and height of at least 24 CSS pixels with a minimum spacing on the height and width of 4 CSS pixels where the spacing cannot overlap. If the target width or height is greater than 36 CSS pixels and less than 44 CSS pixels, the spacing can overlap such that there is an area with a width and height of at least 44 CSS pixels with no other targets.
<Sukriti> Each target should have a width and height of at least 24 CSS pixels with a minimum spacing on the height and width of 4 CSS pixels where the spacing cannot overlap. If the target width or height is greater than 36 CSS pixels and less than 44 CSS pixels, the spacing can overlap as long as there is an area with a width and height of at least 44 CSS pixels with no other targets.
<Kathy> For each target where the width or height less than 36 CSS pixels, there is an area with a width and height of at least 24 CSS pixels with a minimum spacing on the height and width of 4 CSS pixels where the spacing cannot overlap.
<Kathy> For each target where the width or height less than 44 CSS pixels, there is an area with a width and height of at least 24 CSS pixels with a minimum spacing on the height and width of 4 CSS pixels where the spacing cannot overlap.
<Kathy> For each target that has a width or height less than 44 CSS pixels, the target area has a width and height of at least 24 CSS pixels with a minimum spacing on the height and width of 4 CSS pixels where the spacing cannot overlap.
This is scribe.perl Revision of Date Check for newer version at http://dev.w3.org/cvsweb/~checkout~/2002/scribe/ Guessing input format: Irssi_ISO8601_Log_Text_Format (score 1.00) Default Present: JakeAbma, Kathy, Sukriti, Kim_patch Present: JakeAbma Kathy Sukriti Kim_patch No ScribeNick specified. Guessing ScribeNick: Kim_patch Inferring Scribes: Kim_patch Found Date: 10 Sep 2020 People with action items: WARNING: IRC log location not specified! (You can ignore this warning if you do not want the generated minutes to contain a link to the original IRC log.)[End of scribe.perl diagnostic output]