One typeface is used for the web, there is no secondary typeface:
Use semantic heading level elements (<h1>-<h6>) for content, do not use these elements for their visual appearance.
To make a non-heading element appear in a heading style (including font-family), a class of h1-h6 can be applied. eg. <div class="h3">
Semantic heading elements can be sized by applying these classes, eg. <h2 class="h1">.
Headings are assigned two Typescale sizes in __vars/_typography.scss, one for smallscreen, and one for larger screens.
The following sizes are defined in __vars/_typography.scss to set a typescale.
This will only change the font-size, and will change it at all breakpoints.
VERY IMPORTANT: Sizes above 3xl should not be used as classes in HTML, only use these in Sass at larger screen widths, they are too big for mobile! (Example below)
They can be used using a class of font-[sizename], eg. font-sm
or in Sass using @include typescale('[sizename]');, eg. @include typescale('4xl');
As mentioned, headings have two set sizes to utilise 4xl+ at larger screen widths, in __vars/typography you'll see a $headings-smallscreen-map, a $headings-map (for large screens), and something like:
@mixin h3 {
@include line-height('headings');
@include typescale(map-get($headings-smallscreen-map, 'h3'));
font-weight: 500;
@media (min-width: $breakpoint-largescreen-typography) and (min-height: $breakpoint-largescreen-typography-height) {
@include typescale(map-get($headings-map, 'h3'));
}
}
If for example you wanted to create a ludicrously large text element utilising 5xl at desktop, you should do this in Sass, not using HTML classes. Consider something like:
.ludicrously-large-text-element {
@include typescale('3xl');
@media (min-width: $breakpoint-largescreen-typography) {
@include typescale('5xl');
}
}
The founders of an immersive storytelling app have returned to their university stomping ground to film their latest episode. Staffordshire University is going global with a programme packed full of free events to start the new decade.
Staffordshire University is going global with a programme packed full of free events to start the new decade.
The founders of an immersive storytelling app have returned to their university stomping ground to film their latest episode. This is an emboldened paragraph.
2020 marks the International Year of the Nurse and Midwife, and Staffordshire University is joining colleagues across the globe to shine a spotlight on the sector. Celebrations kick off with a talk this week by Visiting Professor Ann-Marie Cannaby, Chief Nurse at the Royal Wolverhampton Hospital, at the University’s Centre of Excellence in Healthcare Education, Stafford.Two hundred years may have passed since the birth of Florence Nightingale, but patient care and safety remain the most important influencing factors within the fields of nursing and midwifery. Professor Cannaby will use her keynote presentation to explore curriculum developments.
This link goes somewhere, but this sentence doesn't, it only exists to show how a link works. Lorem Ipsum is simply dummy text of the printing and typesetting industry.
£2600 is an amount of money that I've wrapped some <strong> tags around, while 4 weeks – a length of time – also has had the same treatment for the purposes of just testing
how typography appears on the page. Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.
Find out how links are made into buttons
The founders of an immersive storytelling app have returned to their university stomping ground to film their latest episode.
2020 marks the International Year of the Nurse and Midwife, and Staffordshire University is joining colleagues across the globe to shine a spotlight on the sector. Celebrations kick off with a talk this week by Visiting Professor Ann-Marie Cannaby, Chief Nurse at the Royal Wolverhampton Hospital, at the University’s Centre of Excellence in Healthcare Education, Stafford.Two hundred years may have passed since the birth of Florence Nightingale, but patient care and safety remain the most important influencing factors within the fields of nursing and midwifery. Professor Cannaby will use her keynote presentation to explore curriculum developments.
Enjoying the View? How computer games can help evaluate landscapes
Staffordshire University is going global with a programme packed full of free events to start the new decade.
These are hyperlinks in paragraphs where they're needed the most, right in a demo page.
£2600 is an amount of money that I've wrapped some <strong> tags around, while 4 weeks – a length of time – also has had the same treatment for the purposes of just testing
how typography appears on the page. Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.
Staffordshire University is going global with a programme packed full of free events to start the new decade. These are hyperlinks in paragraphs where they're needed the most, right in a demo page.
£2600 is an amount of money that I've wrapped some <strong> tags around, while 4 weeks – a length of time – also has had the same treatment for the purposes of just testing
how typography appears on the page. Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.
Staffordshire University is going global with a programme packed full of free events to start the new decade. These are hyperlinks in paragraphs where they're needed the most, right in a demo page.
£2600 is an amount of money that I've wrapped some <strong> tags around, while 4 weeks – a length of time – also has had the same treatment for the purposes of just testing
how typography appears on the page. Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.
Staffordshire University is going global with a programme packed full of free events to start the new decade.
These are hyperlinks in paragraphs where they're needed the most, right in a demo page. £2600 is an amount of money that I've wrapped some <strong> tags around, while 4
weeks – a length of time – also has had the same treatment for the purposes of just testing how typography appears on the page.
Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.
I’m delighted for Staffordshire University to be shortlisted for Best Educational Institution and all the staff are incredibly proud that our students have been recognised for their game Pair Up. It is a well-deserved honour.