Brightspace HTML Templates Resource: Difference between revisions
Jump to navigation
Jump to search
No edit summary |
updated links |
||
| (9 intermediate revisions by the same user not shown) | |||
| Line 6: | Line 6: | ||
Users can access Brightspace using many different devices (e.g., desktop computer, laptop, tablet, mobile phone). Brightspace's responsive design automatically adapts to different screen sizes to provide a great user experience on computers, tablets, and smartphones. | Users can access Brightspace using many different devices (e.g., desktop computer, laptop, tablet, mobile phone). Brightspace's responsive design automatically adapts to different screen sizes to provide a great user experience on computers, tablets, and smartphones. | ||
HTML Templates will assist instructors in developing content topic pages that will adapt page contents to fit any device thus making the pages more responsive, accessible, and interactive. | HTML Templates will assist instructors in developing content topic pages that will adapt page contents to fit any device thus making the pages more responsive, accessible, and interactive. | ||
HTML Templates provide instructors with an easy way to create great looking, responsive, accessible, and interactive content topic pages. HTML Templates page layouts are instructor-friendly and are designed to be edited using the HTML Editor in Brightspace. | HTML Templates provide instructors with an easy way to create great looking, responsive, accessible, and interactive content topic pages. HTML Templates page layouts are instructor-friendly and are designed to be edited using the HTML Editor in Brightspace. | ||
With HTML Templates instructors can take a disjointed-looking course and unify the look and feel of it in a few short clicks. The templates offer a structure that can help facilitate reducing the learner’s cognitive load so they can better absorb the content. | |||
===Sample Pages Created with HTML Templates=== | ===Sample Pages Created with HTML Templates=== | ||
| Line 20: | Line 22: | ||
:<div style="text-align: left">[[File:Course-Overview-After.jpg|400px]]<br /><small>This Course Overview page was created using the [https://brianledwell.com/web/education-resources/d2l-brightspace-templates Earth HTML Template] by Brian Ledwell</small></div> | :<div style="text-align: left">[[File:Course-Overview-After.jpg|400px]]<br /><small>This Course Overview page was created using the [https://brianledwell.com/web/education-resources/d2l-brightspace-templates Earth HTML Template] by Brian Ledwell</small></div> | ||
'''Or this:''' | |||
:<div style="text-align: left">[[File:Course-Overview-After-2.jpg|400px]]<br /><small>This Course Overview page was created using the [https://bit.ly/D2LAccessibleCourseToolkit HTML Templates v.4] by Delaware Technical Community College</small></div> | |||
'''Do you want to see more examples of content topic pages built with HTML Templates?''' Here are a few examples: | '''Do you want to see more examples of content topic pages built with HTML Templates?''' Here are a few examples: | ||
* [https://catwiki.xula.edu/File:Sample-Instructor-Introduction.png Sandbox course - Instructor Introduction] | |||
* [http://cat.xula.edu/food/wp-content/uploads/2020/09/Meet-Your-Instructor-After.jpg Introduction to Physical Geography course - Meet Your Professor] | * [http://cat.xula.edu/food/wp-content/uploads/2020/09/Meet-Your-Instructor-After.jpg Introduction to Physical Geography course - Meet Your Professor] | ||
* [https://catwiki.xula.edu/File:Intro-Physical-Geography-Tech-Help-1674.png Introduction to Physical Geography - Technology Requirements and Help Resources] | * [https://catwiki.xula.edu/File:Intro-Physical-Geography-Tech-Help-1674.png Introduction to Physical Geography course - Technology Requirements and Help Resources] | ||
* [https://catwiki.xula.edu/File:Modern-English-Grammars-Tips-for-Success-1565.jpg Modern English Grammars course - Tips for Success] | * [https://catwiki.xula.edu/File:Modern-English-Grammars-Tips-for-Success-1565.jpg Modern English Grammars course - Tips for Success] | ||
* [https://catwiki.xula.edu/File:Intro-Psyc-Weekly-Quiz1-1603.jpg Introduction to Psychology course - Weekly Quiz 1] | * [https://catwiki.xula.edu/File:Intro-Psyc-Weekly-Quiz1-1603.jpg Introduction to Psychology course - Weekly Quiz 1] | ||
| Line 44: | Line 54: | ||
====Free HTML Templates==== | ====Free HTML Templates==== | ||
* [https://community. | * [https://community.d2l.com/brightspace/kb/articles/1304-html-template-version-3-0 Daylight HTML Templates (Version 3.0)] | ||
* [https://bit.ly/D2LAccessibleCourseToolkit Delaware Technical Community College HTML Templates v.4] | |||
* [https://community.d2l.com/brightspace/kb/articles/2689-customer-spotlight-minnesota-state-college-html-templates Minnesota State College HTML Templates] | |||
* [https://brianledwell.com/web/education-resources/d2l-brightspace-templates Fire, Water, Earth, and Yellow HTML Templates] by Brian Ledwell | * [https://brianledwell.com/web/education-resources/d2l-brightspace-templates Fire, Water, Earth, and Yellow HTML Templates] by Brian Ledwell | ||
| Line 53: | Line 65: | ||
* [https://youtu.be/FQktB8LOYJc Teaching Tips - Edit HTML Templates – Instructor] (video) | * [https://youtu.be/FQktB8LOYJc Teaching Tips - Edit HTML Templates – Instructor] (video) | ||
* [https://www.w3schools.com/TAGS/default.ASP HTML Element Reference (w3schools.com)] | * [https://www.w3schools.com/TAGS/default.ASP HTML Element Reference (w3schools.com)] | ||
* [https://youtu.be/UBV1UxpHc2E Achieving HTML Literacy workshop recording] | |||
* [https://youtu.be/asf5fD6Z6IA Advanced HTML/CSS Design workshop recording] | |||
| Line 72: | Line 86: | ||
'''NOTE:''' This resource is intended to help Xavier faculty build on the skills learned in the "[[Accessibility and Usability]]" module of the #LearnEverywhereXULA (#LEX) course and take their course design to the next level. You can find the open version of the Brightspace #[[LearnEverywhereXULA]] course on this wiki. However, Xavier faculty who are NOT enrolled in the Brightspace #LEX course AND would like to be enrolled should fill out this [https://forms.gle/TtarvhcqkeSPkiCR8 enrollment request form]. Enrollment in the #LEX course gives faculty an opportunity to experience Brightspace from a learner's perspective. Additional activities and reflections are available in the Brightspace #LEX course that are not available in the open resource. | '''NOTE:''' This resource is intended to help Xavier faculty build on the skills learned in the "[[Accessibility and Usability]]" module of the #LearnEverywhereXULA (#LEX) course and take their course design to the next level. You can find the open version of the Brightspace #[[LearnEverywhereXULA]] course on this wiki. However, Xavier faculty who are NOT enrolled in the Brightspace #LEX course AND would like to be enrolled should fill out this [https://forms.gle/TtarvhcqkeSPkiCR8 enrollment request form]. Enrollment in the #LEX course gives faculty an opportunity to experience Brightspace from a learner's perspective. Additional activities and reflections are available in the Brightspace #LEX course that are not available in the open resource. | ||
<br /><br /> | <br /><br /> | ||
[[Category: CAT+FD]] | |||
[[Category: CAT+FD 2020-2021]] | |||
Latest revision as of 02:48, 7 February 2024
Brightspace HTML Templates
Users can access Brightspace using many different devices (e.g., desktop computer, laptop, tablet, mobile phone). Brightspace's responsive design automatically adapts to different screen sizes to provide a great user experience on computers, tablets, and smartphones.
HTML Templates will assist instructors in developing content topic pages that will adapt page contents to fit any device thus making the pages more responsive, accessible, and interactive.
HTML Templates provide instructors with an easy way to create great looking, responsive, accessible, and interactive content topic pages. HTML Templates page layouts are instructor-friendly and are designed to be edited using the HTML Editor in Brightspace.
With HTML Templates instructors can take a disjointed-looking course and unify the look and feel of it in a few short clicks. The templates offer a structure that can help facilitate reducing the learner’s cognitive load so they can better absorb the content.
Sample Pages Created with HTML Templates
Instructors can take their content topic pages from this:
This Course Overview page was created using a default HTML Template.
To this:
Or this:
This Course Overview page was created using the HTML Templates v.4 by Delaware Technical Community College
Do you want to see more examples of content topic pages built with HTML Templates? Here are a few examples:
- Sandbox course - Instructor Introduction
- Introduction to Physical Geography course - Meet Your Professor
- Introduction to Physical Geography course - Technology Requirements and Help Resources
- Modern English Grammars course - Tips for Success
- Introduction to Psychology course - Weekly Quiz 1
Curated List of Resources
We've created this curated list of resources to help you use HTML Templates to create responsive, interactive, accessible, and visually appealing HTML content pages in Brightspace.
Level Up with User-Friendly Brightspace HTML Templates Workshop (10/15/2020)
- HTML Templates: A Primer video (11:28) participants were asked to watch this video before the workshop
- Workshop Presentation Slides (pdf)
- Workshop Recording (45:36)
Why use HTML Templates?
Free HTML Templates
- Daylight HTML Templates (Version 3.0)
- Delaware Technical Community College HTML Templates v.4
- Minnesota State College HTML Templates
- Fire, Water, Earth, and Yellow HTML Templates by Brian Ledwell
Creating and Editing HTML Templates
- Brightspace HTML Editor
- Apply an HTML Template to a New Document in Content
- Teaching Tips - Edit HTML Templates – Instructor (video)
- HTML Element Reference (w3schools.com)
- Achieving HTML Literacy workshop recording
- Advanced HTML/CSS Design workshop recording
Free Photo and Image Resources
- Find Free Images to Use in Your Courses
- Free Photo and Image Editing Tools
- Creative Commons (CC) Wiki Resource
- Copyright and Fair Use
Accessibility Resources
- 5 Useful Tools to Choose Color Schemes
- Color Picker (Chrome Extension)
- Brightspace Tip #156: Accessibility Checker
NOTE: This resource is intended to help Xavier faculty build on the skills learned in the "Accessibility and Usability" module of the #LearnEverywhereXULA (#LEX) course and take their course design to the next level. You can find the open version of the Brightspace #LearnEverywhereXULA course on this wiki. However, Xavier faculty who are NOT enrolled in the Brightspace #LEX course AND would like to be enrolled should fill out this enrollment request form. Enrollment in the #LEX course gives faculty an opportunity to experience Brightspace from a learner's perspective. Additional activities and reflections are available in the Brightspace #LEX course that are not available in the open resource.