[kde-guidelines] Styleguide: Check boxes

Thomas Pfeiffer colomar at autistici.org
Thu May 30 13:22:01 UTC 2013


On Thursday 30 May 2013 14:43:01 Aurélien Gâteau wrote:
> Le Thursday 30 May 2013 13:03:08 Thomas Pfeiffer a écrit :
> [snip]
> 
> > I found only one exception to this in the example for the popover[4],
> > which
> > however has a mix of checkbox labels on the left and on the right. So it
> > seems even Apple is not 100% consistent in their design.
> > 
> > The GNOME HIGs do not mention label alignment explicitly in their Checkbox
> > guidelines, either[4]. However example screenshots in other guidelines[5]
> > show that they always keep checkbox labels on the right, even near other
> > controls with labels on the left.
> 
> (Second [4] here :) can you post the link for the first one?)
> [snip]

Oh damn, and that coming from me as a scientist... Guess I'm too much used to 
relying on bibliography software to do reference stuff for me ;)

Okay, here comes the link: 
http://developer.apple.com/library/mac/documentation/UserExperience/Conceptual/AppleHIGuidelines/art/wn_popover.jpg

> > So we can say that the "industry standard" seems to be to keep the labels
> > for checkboxes (and radio buttons) on the right, no matter what.
> > And personally, I'd agree with that. Even though the visual appearance
> > suffers form time to time, I'd give the semantic consistency preference
> > over the layout. There are ways to mitigate the visual problem a little by
> > trying to put the checkboxes together instead of mixing them with other
> > elements or by putting a label for several checkboxes on the left.
> > 
> > That's just my position (and obviously that of the people who have written
> > the HIGs for Apple, GNOME and MS) and the arguments for consistent
> > alignment within a dialog are valid as well.
> 
> I agree with you. The way you describe how Apple avoid odd layouts could be
> good additions to the HIG. Something along the lines of:
> 
> -----------------------------
> 
> In general keep the label of the check box to the right of the tick box.
> When using check boxes in a two-column, "$label: $widget" layout, you can
> do the following to keep the layout balanced:
> 
> Group check boxes together in the widget column and add a label describing
> the group in the label column:
> 
> <pre>
> Appearance: [ ] Wrap text
> 
>             [x] Show tooltips
> 
>       Text: [_________]
> 
>      Color: (____)
> </pre>
> 
> - or -
> 
> Make the check boxes span the two columns, but keep them at the bottom of
> the layout:
> 
> <pre>
>    Text: [_________]
> 
>   Color: (____)
> 
>   [ ] Wrap text
> 
>   [x] Show tooltips
> </pre>
> 
> -----------------------------
> 
> Does it make sense?

It does! What I'm thinking though is that maybe me should add this to the HIG 
on form label alignment instead
( http://techbase.kde.org/Projects/Usability/HIG/Form_Label_Alignment ) 
because that's where I think it makes most sense, and link to it from the 
checkbox HIG.
The form label alignment HIG already has a section on checkboxes which talks 
about a problem in Qt4 of which I'm not even sure if it still applies, but 
advocates placing the label on the left in some cases. I'd vote for just 
replacing that paragraph with the one you are suggesting.

Oh and while you're at it: If there are no objections to the content (Heiko?), 
could you please create the visualizations with actual Qt? I guess that would 
work best for developers, and I know you're a genius when it comes to visually 
appealing GUI layout, so they'd make a great example :)


More information about the kde-guidelines mailing list