---
{
	"title": "Web Experience Toolkit (WET)",
	"language": "en",
	"altLangPrefix": "index",
	"canonical": "https://wet-boew.github.io/wet-boew/index-en.html",
	"dateModified": "2023-06-19",
	"breadcrumb": "false"
}
---
<section>
	<h2 id="about">What is the Web Experience Toolkit?</h2>
	<ul>
		<li>An <a href="docs/ref/accolades-en.html#awards">award-winning</a> front-end framework for building websites that are <a href="#accessibility">accessible</a>, <a href="#usability">usable</a>, <a href="#interoperability">interoperable</a>, <a href="#mobile-friendly-responsive-design">mobile friendly</a> and <a href="#multilingual">multilingual</a></li>
		<li>A collection of <a href="#themeable-and-reusable">flexible and themeable templates and reusable components</a></li>
		<li>A <a href="#collaborative-approach">collaborative open source project led by the Government of Canada</a></li>
	</ul>
</section>

<section>
	<h2 id="key">Resources</h2>
	<div class="row wb-eqht">
		<div class="col-lg-4 col-md-6">
			<h3 class="h5"><a href="demos/index-en.html">Examples</a></h3>
			<p>Working examples of all WET plugin, including developer tools</p>
		</div>
		<div class="col-lg-4 col-md-6">
			<h3 class="h5"><a href="docs/index-en.html">Documentation</a></h3>
			<p>Technical documentation and plugins configuration specification.</p>
		</div>
		<div class="col-lg-4 col-md-6">
			<h3 class="h5"><a href="docs/versions/dwnld-en.html">Downloads</a></h3>
			<p>Binaries and release notes of WET-BOEW and Canada.ca theme</p>
		</div>
		<div class="col-lg-4 col-md-6">
			<h3 class="h5"><a href="https://wet-boew.github.io/GCWeb/index-en.html">Canada.ca theme (GCWeb)</a></h3>
			<p>Technical resources and reference implementation of the Canada.ca content and IA specification</p>
		</div>
		<div class="col-lg-4 col-md-6">
			<h3 class="h5"><a href="https://github.com/wet-boew/">WET-BOEW project on github</a></h3>
			<p>Source code and issue tracker for all wet-boew projects and specials projects dashboard</p>
		</div>
		<div class="col-lg-4 col-md-6">
			<h3 class="h5"><a href="https://wet-boew.github.io/wet-boew-styleguide/index-en.html">Style guide</a></h3>
			<p>Style, Writing, Design, and Accessibility Guide for Web Experience Toolkit (WET)</p>
		</div>
	</div>

	<div class="row">
		<div class="col-md-6">
			<h3>Design decision</h3>
			<p><em>(last updated: <time datetime="2020-09-11">September 11, 2020</time>)</em></p>
			<ul>
				<li><a href="https://wet-boew.github.io/wet-boew-documentation/decision/1.html">DD-1: Use SVG with img element instead of object</a></li>
				<li><a href="https://wet-boew.github.io/wet-boew-documentation/decision/2.html">DD-2: Browser supported</a></li>
				<li><a href="https://wet-boew.github.io/wet-boew-documentation/decision/3.html">DD-3: WET API/Blueprint</a></li>
				<li><a href="https://wet-boew.github.io/wet-boew-documentation/decision/4.html">DD-4: Basic HTML mode and progressive enhancement</a></li>
				<li><a href="https://wet-boew.github.io/wet-boew-documentation/decision/5.html">DD-5: Repository migration</a></li>
				<li><a href="https://wet-boew.github.io/wet-boew-documentation/decision/6.html">DD-6: Versioning</a></li>
				<li><a href="https://wet-boew.github.io/wet-boew-documentation/decision/8.html">DD-8: Dual implementation of structured data with JSON-LD and RDFa Lite in a single web page</a></li>
				<li><a href="https://wet-boew.github.io/wet-boew-documentation/decision/9.html">DD-9: Release early, release often (<abbr title="Short-term release">STR</abbr>)</a></li>
				<li><a href="https://wet-boew.github.io/wet-boew-documentation/decision/10.html">DD-10: Provisional feature</a></li>
				<li><a href="https://wet-boew.github.io/wet-boew-documentation/decision/11.html">DD-11: Resize text testing methodology</a> (Approved)</li>
				<li><a href="https://wet-boew.github.io/wet-boew-documentation/decision/12.html">DD-12: Double H1 on a single page</a></li>
				<li><a href="https://wet-boew.github.io/wet-boew-documentation/decision/13.html">DD-13: Reduce aggressiveness of form validation plugin</a> (Approved)</li>
			</ul>
			<p><a href="https://wet-boew.github.io/wet-boew-documentation/decision/index-en.html">Consult all Design decision</a></p>
		</div>
		<div class="col-md-6">
			<h3>Projects in the WET-BOEW family</h3>
			<ul>
				<li><a href="https://github.com/wet-boew/wet-boew-dotnet-controls">Web Control Library .NET</a></li>
				<li><a href="https://drupalwxt.github.io">Drupal WxT variant</a></li>
				<li><a href="https://cenw-wscoe.github.io/sgdc-cdts/docs/index-en.html">CDTS - Centralized template services</a></li>
				<li><a href="https://github.com/orgs/wet-boew/projects/1">WCAG 2.1 Level AA review</a></li>
			</ul>
			<p><small>(<a href="https://wet-boew.github.io/wet-boew-documentation/projects-en.html">All projects</a>)</small></p>
			<h3>Resources about the WET-BOEW project management</h3>
			<ul>
				<li><a href="https://wet-boew.github.io/wet-boew-documentation/research-en.html">Research and findings</a></li>
				<li><a href="https://wet-boew.github.io/wet-boew-documentation/decision/index-en.html">Design decision</a></li>
				<li><a href="https://wet-boew.github.io/wet-boew-documentation/index-en.html">Project documentations and design decision</a></li>
				<li><a href="docs/start-en.html#develop">Contributing guidelines</a></li>
				<li><a href="License-en.html">Terms and conditions</a> (MIT license)</li>
			</ul>
		</div>
	</div>
</section>

<section>
	<h2 id="benefits">Benefits</h2>

	<section>
		<h3 id="accessibility">Accessibility</h3>
		<ul>
			<li>Conforms to <a href="https://www.w3.org/TR/WCAG20/">WCAG 2.0</a> level AA</li>
			<li>Leverages <a href="https://www.w3.org/TR/wai-aria/">WAI-ARIA</a> to further enhance accessibility</li>
			<li>Assistive technology testing (Access Working Group)</li>
		</ul>
	</section>

	<section>
		<h3 id="usability">Usability</h3>
		<ul>
			<li>Iterative approach to design</li>
			<li>Design patterns and usability testing (User Experience Working Group)</li>
		</ul>
	</section>

	<section>
		<h3 id="interoperability">Interoperability</h3>
		<ul>
			<li><a href="https://www.w3.org/TR/html5/">HTML5</a>-first approach (leveraging native HTML5 support and filling support gaps with “polyfills”)</li>
			<li>Supporting a wide variety of browsers (Edge, Firefox, Chrome, Safari, Opera)</li>
			<li>Building support for HTML data (<a href="https://www.w3.org/TR/rdfa-lite/">RDFa 1.1 Lite</a>, <a href="https://www.schema.org/">Schema.org</a>)</li>
		</ul>
	</section>

	<section>
		<h3 id="mobile-friendly-responsive-design">Mobile friendly responsive design</h3>
		<ul>
			<li>Adapts to different screen sizes and device capabilities</li>
			<li>Touchscreen support</li>
			<li>Optimized for performance</li>
			<li>Building support for device-based mobile applications</li>
		</ul>
	</section>

	<section>
		<h3 id="multilingual">Multilingual</h3>
		<ul>
			<li>Currently supports 34 languages (including right-to-left languages)
				<ul>
					<li>English</li>
					<li>French</li>
					<li>Afrikaans</li>
					<li>Albanian</li>
					<li>Arabic</li>
					<li>Armenian</li>
					<li>Bulgarian</li>
					<li>Chinese</li>
					<li>Chinese (Simplified)</li>
					<li>Czech</li>
					<li>Dutch</li>
					<li>Estonian</li>
					<li>German</li>
					<li>Greek</li>
					<li>Hindi</li>
					<li>Hungarian</li>
					<li>Icelandic</li>
					<li>Indonesian</li>
					<li>Inuktitut</li>
					<li>Italian</li>
					<li>Japanese</li>
					<li>Korean</li>
					<li>Latvian</li>
					<li>Lithuanian</li>
					<li>Polish</li>
					<li>Portuguese</li>
					<li>Portuguese (Brazilian)</li>
					<li>Russian</li>
					<li>Slovak</li>
					<li>Spanish</li>
					<li>Thai</li>
					<li>Turkish</li>
					<li>Ukranian</li>
					<li>Vietnamese</li>
				</ul>
			</li>
		</ul>
	</section>

	<section>
		<h3 id="themeable-and-reusable">Themeable and reusable</h3>
		<ul>
			<li>Flexible framework that supports custom themes</li>
			<li>Includes support for <a href="docs/ref/themesstyle-en.html">5 different themes</a> including a <a href="https://wet-boew.github.io/themes-dist/theme-base/docs/ref/theme-base/theme-base-en.html">“Base” theme</a> to use as a template</li>
			<li>Reusable templates, <a href="docs/ref/plugins-en.html">plugins</a> and widgets</li>
			<li><a href="docs/ref/variants-en.html">Adapted to various CMS and programming frameworks</a> (Drupal, WordPress, SharePoint (in development), DotNetNuke (in development), PHP, SSI and Java/Maven)
		</ul>
	</section>

	<section>
		<h3>Reduces costs by openly sharing and collaborating</h3>
		<ul>
			<li>Drives down research and development costs</li>
			<li>Avoids duplication of effort</li>
			<li>Produces better quality results</li>
		</ul>
	</section>

	<section>
		<h3 id="collaborative-approach">Collaborative approach</h3>
		<ul>
			<li>Project managed openly on GitHub, including discussion through the issues tracker</li>
			<li>Encouraging a free flow of ideas, dialogue and innovation including sharing of challenges and ideas</li>
			<li>External contributions welcome
				<ul>
					<li>Pull requests</li>
					<li>Design patterns</li>
					<li>Issues and suggestions</li>
					<li>Documentation</li>
					<li>Testing</li>
				</ul>
			<li>Multi-level review process for contributions to ensure code integrity (combination of automated and manual reviews)</li>
		</ul>
	</section>
</section>
