Wet-boew: Question about colour and palettes

Created on 22 Sep 2020  路  5Comments  路  Source: wet-boew/wet-boew

Hi
I am working on a project for PSPC and have the following questions:

  1. WET guidelines talk about using different colours for buttons to communicate state.
    Does that mean that this is the colour palette we "HAVE" to use?
  2. I understand the colour contrast requirements for WCAG - could I use my own colour palette that abides by these guidelines?
  3. I understand that different button colours can be used to inform the user of the "state" of the button. But do I have to follow the exact same colours as mentioned in the WET guidelines?

i.e. if my base colour is #503879, (purple) could I use this purple as my "Primary" button. Note that this colour with white text passes AAA.

image

Question

Most helpful comment

Ok so to answer your questions:

1. WET guidelines talk about using different colours for buttons to communicate state. Does that mean that this is the colour palette we "HAVE" to use?

  • If you are planning on using the basic theme from WET-BOEW then you should be using the same colours (which mostly come from Bootstrap 3). However, nothing prevents you from creating your own "theme", just like GWeb is the theme that gives the look and feel of Canada.ca.

2. I understand the colour contrast requirements for WCAG - could I use my own colour palette that abides by these guidelines?

  • If you know about the colour contrast criteria from WCAG and apply it, then you could create your own colour palette yes.

3. I understand that different button colours can be used to inform the user of the "state" of the button. But do I have to follow the exact same colours as mentioned in the WET guidelines?

  • When there are WET guidelines, it means that it has been tested and reviewed by experts. If you are moving away from what WET-BOEW suggests/offers, then just make sure that you know what you are doing. Also, if your project is from the GoC you should really consider using GCWeb (but you don't necessarily have to).

All 5 comments

@swapnalithakarpspc Can you share a link? Do you know if you are using GCWeb or simply WET-BOEW?

@delisma If this is using GCWeb, can you please reply?

Thanks!

Hi @GormFrank
I am using simply WET-BOEW.

Ok so to answer your questions:

1. WET guidelines talk about using different colours for buttons to communicate state. Does that mean that this is the colour palette we "HAVE" to use?

  • If you are planning on using the basic theme from WET-BOEW then you should be using the same colours (which mostly come from Bootstrap 3). However, nothing prevents you from creating your own "theme", just like GWeb is the theme that gives the look and feel of Canada.ca.

2. I understand the colour contrast requirements for WCAG - could I use my own colour palette that abides by these guidelines?

  • If you know about the colour contrast criteria from WCAG and apply it, then you could create your own colour palette yes.

3. I understand that different button colours can be used to inform the user of the "state" of the button. But do I have to follow the exact same colours as mentioned in the WET guidelines?

  • When there are WET guidelines, it means that it has been tested and reviewed by experts. If you are moving away from what WET-BOEW suggests/offers, then just make sure that you know what you are doing. Also, if your project is from the GoC you should really consider using GCWeb (but you don't necessarily have to).

Also just too add my own two cents creating your theme is quite easy. You can see an example of wet-boew (non-goc) modified on my site here thekodester.ca/wet/

All the CSS: thekodester.ca/wet/static/css/theme.color.css and thekodester.ca/wet/static/css/theme.helpers.css

Thanks a lot for your help. I will keep your advice in mind for sure.

Was this page helpful?
0 / 5 - 0 ratings

Related issues

AtomicNumber28 picture AtomicNumber28  路  7Comments

juleskuehn picture juleskuehn  路  3Comments

kitana-ifbbpro picture kitana-ifbbpro  路  6Comments

potvinco picture potvinco  路  3Comments

jkshapiro picture jkshapiro  路  6Comments