If you are conducting business with the Government of Saskatchewan by mail, please be advised that delivery may be delayed due to rotating postal strikes. Various measures are in place to ensure service to Saskatchewan residents and businesses during postal strike action.

Google Translate Disclaimer

A number of pages on the Government of Saskatchewan`s web site have been professionally translated in French. These translations are identified by a yellow text box that resembles the link below and can be found in the right hand rail of the page. The home page for French-language content on this site can be found here:

Renseignements en Français

Where an official translation is not available, Google™ Translate can be used. Google™ Translate is a free online language translation service that can translate text and web pages into different languages. Translations are made available to increase access to Government of Saskatchewan content for populations whose first language is not English.

The results of software-based translation do not approach the fluency of a native speaker or possess the skill of a professional translator. The translation should not be considered exact, and may include incorrect or offensive language Government of Saskatchewan does not warrant the accuracy, reliability or timeliness of any information translated by this system. Some files or items cannot be translated, including graphs, photos, and other file formats such as portable document formats (PDFs).

Any person or entities that rely on information obtained from the system does so at his or her own risk. Government of Saskatchewan is not responsible for any damage or issues that may possibly result from using translated website content. If you have any questions about Google™ Translate, please visit: Google™ Translate FAQs.

CSS Standards

Cascading Style Sheets (CSS) is a stylesheet language used to describe all presentation aspects of the page. CSS controls the page’s layout and visual characteristics through the layering of style rules, “cascade”.

Cascading Style Sheets  is where the visual presentation and design rules for a website or application belong.

Effective CSS should:

  • Be easy to maintain;
  • Follow clear enough patterns to be understood;
  • Not include unused style rules; and
  • Address different devices and browser versions.

CSS Validity

Use valid CSS where possible. Use tools such as the W3C CSS validator to test.

Reset

Use normalize.css to make rendering more consistent across browsers.

External Stylesheets

Add CSS through external files, minimizing the quantity  of files. Should be included in the HEAD of the document. use the link tag include, rather than an @import to improve efficiency.

<!-- Recommended -->
<link rel="stylesheet" type="text/css" href="myStyles.css" />

Separate Content from Style

Don’t include styles inline in the document, nor in a style tag or on the elements. Inline styles will increase load time and are difficult to maintain.

<!-- Not Recommended -->
<p style="color:red; font-size:24px;">Error! This field is required.</p>
<!-- Recommended -->
<p class="alert"> Error! This Field is required.</p>

Organize Code with Comments

Keep your styles organized and easy to maintain by organizing them in logical groups and using comments.

<!-- Not Recommended -->
.tagline{
border-top-style:none;
font-family: georgia, serif;
font-size: 100%;
padding-bottom: 2em;
padding-left:1em;
padding-right: 1em;
padding-top:0;
}
<!-- Recommended --> 
.tagline{
border-top:0;
font:100% georgia, serif;
padding:0 1em 2em;
}


Classes vs. IDs

CSS styles can be declared for classes or element ID. The element ID attribute is a unique identifier for a specific element. Styles can be declared for an element ID if that style should be applied to that element only and nothing else. Classes can be applied to multiple elements that share the same style properties. Elements that should look and behave in the same way can have the same class name.

<!-- Recommended -->

<ul id="categories">
<li class="item">Category 1</li>
<li class="item">Category 2</li>
<li class="item">Category 3</li>
</ul>

Use Practical Ids & Classes Names

Create ID and class names that are practical and relate to the content itself and not the style of the content.

<!-- Not Recommended -->
<p class="bigBlueText">Giving citizens what they want and need online, anywhere, anytime and on any device.</p>
<!-- Recommended -->
<p class="tagline">Giving citizens what they want and need online, anywhere, anytime and on any device.</p>

Write CSS Using Multiple Lines & Spaces

  • Start each selector and declaration on a new line.
  • Indent declarations within each selector.
<!-- Not Recommended -->
.btn{background:#eee;color:#9D2235;font-sizee:18px;padding:6px;}
<!-- Recommended -->
.btn{
background:#eee;
color:#9D2235;
font-sizee:18px;
padding:6px;
}


Use Shorthand Properties

Use shorthand properties where possible. It is useful for code efficiency and understandability.

<!-- Not Recommended -->
.btn{background:#eee;color:#9D2235;font-sizee:18px;padding:6px;}
<!-- Recommended -->
.btn{
background:#eee;
color:#9D2235;
font-sizee:18px;
padding:6px;
}

We need your feedback to improve saskatchewan.ca. Help us improve