Web Experience Toolkit (WET)
What is the Web Experience Toolkit?
- An award-winning front-end framework for building websites that are accessible, usable, interoperable, mobile friendly and multilingual
- A collection of flexible and themeable templates and reusable components
- A collaborative open source project led by the Government of Canada
Resources
Examples
Working examples of all WET plugin, including developer tools
Documentation
Technical documentation and plugins configuration specification.
Downloads
Binaries and release notes of WET-BOEW and Canada.ca theme
Canada.ca theme (GCWeb)
Technical resources and reference implementation of the Canada.ca content and IA specification
WET-BOEW project on github
Source code and issue tracker for all wet-boew projects and specials projects dashboard
Style guide
Style, Writing, Design, and Accessibility Guide for Web Experience Toolkit (WET)
Design decision
(last updated: )
- DD-1: Use SVG with img element instead of object
- DD-2: Browser supported
- DD-3: WET API/Blueprint
- DD-4: Basic HTML mode and progressive enhancement
- DD-5: Repository migration
- DD-6: Versioning
- DD-8: Dual implementation of structured data with JSON-LD and RDFa Lite in a single web page
- DD-9: Release early, release often (STR)
- DD-10: Provisional feature
- DD-11: Resize text testing methodology (Approved)
- DD-12: Double H1 on a single page
- DD-13: Reduce aggressiveness of form validation plugin (Approved)
Projects in the WET-BOEW family
- Web Control Library .NET
- Drupal WxT variant
- CDTS - Centralized template services
- WCAG 2.1 Level AA review
Resources about the WET-BOEW project management
Benefits
Accessibility
Usability
- Iterative approach to design
- Design patterns and usability testing (User Experience Working Group)
Interoperability
- HTML5-first approach (leveraging native HTML5 support and filling support gaps with “polyfills”)
- Supporting a wide variety of browsers (Edge, Firefox, Chrome, Safari, Opera)
- Building support for HTML data (RDFa 1.1 Lite, Schema.org)
Mobile friendly responsive design
- Adapts to different screen sizes and device capabilities
- Touchscreen support
- Optimized for performance
- Building support for device-based mobile applications
Multilingual
- Currently supports 34 languages (including right-to-left languages)
- English
- French
- Afrikaans
- Albanian
- Arabic
- Armenian
- Bulgarian
- Chinese
- Chinese (Simplified)
- Czech
- Dutch
- Estonian
- German
- Greek
- Hindi
- Hungarian
- Icelandic
- Indonesian
- Inuktitut
- Italian
- Japanese
- Korean
- Latvian
- Lithuanian
- Polish
- Portuguese
- Portuguese (Brazilian)
- Russian
- Slovak
- Spanish
- Thai
- Turkish
- Ukranian
- Vietnamese
Themeable and reusable
- Flexible framework that supports custom themes
- Includes support for 5 different themes including a “Base” theme to use as a template
- Reusable templates, plugins and widgets
- Adapted to various CMS and programming frameworks (Drupal, WordPress, SharePoint (in development), DotNetNuke (in development), PHP, SSI and Java/Maven)
Reduces costs by openly sharing and collaborating
- Drives down research and development costs
- Avoids duplication of effort
- Produces better quality results
Collaborative approach
- Project managed openly on GitHub, including discussion through the issues tracker
- Encouraging a free flow of ideas, dialogue and innovation including sharing of challenges and ideas
- External contributions welcome
- Pull requests
- Design patterns
- Issues and suggestions
- Documentation
- Testing
- Multi-level review process for contributions to ensure code integrity (combination of automated and manual reviews)
- Date modified: