{"id":8371,"date":"2021-03-22T15:29:54","date_gmt":"2021-03-22T15:29:54","guid":{"rendered":"http:\/\/sites.reading.ac.uk\/tel\/?page_id=8371"},"modified":"2021-04-21T14:24:13","modified_gmt":"2021-04-21T14:24:13","slug":"visual-design-for-blackboard-modules","status":"publish","type":"page","link":"https:\/\/sites.reading.ac.uk\/tel\/visual-design-for-blackboard-modules\/","title":{"rendered":"Visual design for Blackboard modules"},"content":{"rendered":"<h2>What &#8216;visual design&#8217; elements can I control in Blackboard?<\/h2>\n<p><span data-ccp-props=\"{&quot;201341983&quot;:0,&quot;335559739&quot;:160,&quot;335559740&quot;:259}\">V<\/span><span data-contrast=\"auto\">isual design elements, such as images and text formatting,<\/span><span data-contrast=\"auto\">\u00a0can<\/span><span data-contrast=\"auto\">\u00a0<\/span><span data-contrast=\"auto\">be displayed in several places on Blackboard module pages<\/span><span data-contrast=\"auto\">:<\/span><span data-ccp-props=\"{&quot;201341983&quot;:0,&quot;335559739&quot;:160,&quot;335559740&quot;:259}\">\u00a0<\/span><\/p>\n<ul>\n<li data-leveltext=\"\uf0b7\" data-font=\"Symbol\" data-listid=\"3\" data-aria-posinset=\"2\" data-aria-level=\"1\"><span data-contrast=\"auto\">the module banner<\/span><span data-ccp-props=\"{&quot;134233279&quot;:true,&quot;201341983&quot;:0,&quot;335559739&quot;:160,&quot;335559740&quot;:259}\">\u00a0<\/span><\/li>\n<li data-leveltext=\"\uf0b7\" data-font=\"Symbol\" data-listid=\"3\" data-aria-posinset=\"1\" data-aria-level=\"1\"><span data-contrast=\"auto\"><a href=\"https:\/\/sites.reading.ac.uk\/tel-support\/2018\/08\/14\/blackboard-creating-a-content-folder\/\" target=\"_blank\" rel=\"noopener\">folder descriptions<\/a>,\u00a0<\/span><a href=\"https:\/\/sites.reading.ac.uk\/tel-support\/2018\/07\/17\/blackboard-creating-an-announcement\/\" target=\"_blank\" rel=\"noopener\"><span data-contrast=\"auto\">announcement\u00a0<\/span><\/a><span data-contrast=\"auto\">posts,\u00a0<\/span><span data-contrast=\"auto\"><a href=\"https:\/\/sites.reading.ac.uk\/tel-support\/2018\/07\/17\/blackboard-creating-and-editing-an-item\/\" target=\"_blank\" rel=\"noopener\">content items<\/a> and\u00a0<\/span><span data-contrast=\"auto\">activity instructions<\/span><span data-contrast=\"auto\">\u00a0<\/span><\/li>\n<li data-leveltext=\"\uf0b7\" data-font=\"Symbol\" data-listid=\"3\" data-aria-posinset=\"2\" data-aria-level=\"1\"><span data-contrast=\"auto\">within uploaded content and screencasts<\/span><span data-contrast=\"auto\">, for example, documents and PowerPoints<\/span><span data-ccp-props=\"{&quot;134233279&quot;:true,&quot;201341983&quot;:0,&quot;335559739&quot;:160,&quot;335559740&quot;:259}\"><br \/>\n*<a href=\"https:\/\/www.reading.ac.uk\/dps\/visualidentity\/dps2-visualidentity.aspx\" target=\"_blank\" rel=\"noopener\">University templates for Office<\/a>\u00a0contain <a href=\"https:\/\/www.reading.ac.uk\/dps\/photography\/dps2-photography-imagebank.aspx\" target=\"_blank\" rel=\"noopener\">DPS<\/a> images, however you may consider sourcing additional images to signpost and illustrate content<\/span><\/li>\n<\/ul>\n<h2><\/h2>\n<h2>Why use visual design elements in a Blackboard module?<\/h2>\n<p><span data-contrast=\"none\">Visuals<\/span><span data-contrast=\"none\">\u00a0ca<\/span><span data-contrast=\"none\">n\u00a0<\/span><span data-contrast=\"none\">enhance or clarify information, and help foster a module identity (when used with consistency).<\/span><span data-contrast=\"none\">\u00a0H<\/span><span data-contrast=\"none\">owever,<\/span><span data-contrast=\"none\">\u00a0visual elements<\/span><span data-contrast=\"none\">\u00a0may<\/span><span data-contrast=\"none\">\u00a0create exclusion for users who are unable to view them or rely on text versions of visual content.<\/span><span data-contrast=\"none\">\u00a0For example, screen-reader users will be unable to interact with content that is entirely\u00a0<\/span><span data-contrast=\"none\">image\u00a0based<\/span><span data-contrast=\"none\">, or\u00a0relies on use of colour to communicate meaning<\/span><span data-contrast=\"none\">.<\/span><\/p>\n<p>&nbsp;<\/p>\n<h2>How to use visual design elements in Blackboard<\/h2>\n<style>#sp-ea-8373 .spcollapsing { height: 0; overflow: hidden; transition-property: height;transition-duration: 500ms;}#sp-ea-8373.sp-easy-accordion>.sp-ea-single {margin-bottom: 10px; border: 1px solid #e2e2e2; }#sp-ea-8373.sp-easy-accordion>.sp-ea-single>.ea-header a {color: #444;}#sp-ea-8373.sp-easy-accordion>.sp-ea-single>.sp-collapse>.ea-body {background: #fff; color: #444;}#sp-ea-8373.sp-easy-accordion>.sp-ea-single {background: #eee;}#sp-ea-8373.sp-easy-accordion>.sp-ea-single>.ea-header a .ea-expand-icon { float: left; color: #444;font-size: 16px;}.sp-ea-one.sp-easy-accordion .sp-ea-single .ea-header a {\r\n    padding: 10px !important;\r\n    color: #434343 !important;\r\n    background-color: #EAEAEA !important;\r\n    font-weight: normal !important;\r\n    font-size:1px !important;\r\n \r\n}\r\n.ea-expand-icon.fa {\r\n    color: #434343 !important;\r\n  }<\/style><div id=\"sp_easy_accordion-1776378545\"><div id=\"sp-ea-8373\" class=\"sp-ea-one sp-easy-accordion\" data-ea-active=\"ea-click\" data-ea-mode=\"vertical\" data-preloader=\"\" data-scroll-active-item=\"\" data-offset-to-scroll=\"0\"><div class=\"ea-card ea-expand sp-ea-single\"><h3 class=\"ea-header\"><a class=\"collapsed\" id=\"ea-header-83730\" role=\"button\" data-sptoggle=\"spcollapse\" data-sptarget=\"#collapse83730\" aria-controls=\"collapse83730\" href=\"#\" aria-expanded=\"true\" tabindex=\"0\"><i aria-hidden=\"true\" role=\"presentation\" class=\"ea-expand-icon eap-icon-ea-expand-minus\"><\/i> Module banner<\/a><\/h3><div class=\"sp-collapse spcollapse collapsed show\" id=\"collapse83730\" data-parent=\"#sp-ea-8373\" role=\"region\" aria-labelledby=\"ea-header-83730\"> <div class=\"ea-body\"><p><span data-contrast=\"none\"><span class=\"TextRun SCXW142449310 BCX9\" lang=\"EN-GB\" xml:lang=\"EN-GB\" data-contrast=\"none\"><span class=\"NormalTextRun SCXW142449310 BCX9\">Banners provide an attractive visual identifier for the course, they\u00a0<\/span><\/span>can be image\u00a0<\/span><span data-contrast=\"none\">or text based (or a combination) and are often designed to represent the 'theme\u2019 of the module (avoid selecting images of people, as it may be difficult select images representative of your cohort). Banners<\/span><span data-contrast=\"none\"><span class=\"TextRun SCXW142449310 BCX9\" lang=\"EN-GB\" xml:lang=\"EN-GB\" data-contrast=\"none\"><span class=\"NormalTextRun SCXW142449310 BCX9\">\u00a0are essentially an image file that displays on the module homepage (it is recommended to set <a href=\"http:\/\/sites.reading.ac.uk\/tel\/using-the-blackboard-announcements-page\/\">Announcements<\/a> as the module homepage).<\/span><\/span><\/span><\/p><p><span data-contrast=\"none\"><strong>Use banners for \u2018decorative\u2019 purposes only,<\/strong> they are not accessible (<\/span><span data-contrast=\"auto\">a module banner comprising text is essenti<\/span><span data-contrast=\"auto\">ally\u00a0<\/span><span data-contrast=\"auto\">an image file;<\/span><span data-contrast=\"none\">\u00a0you should only include the module title, and optionally the code and\/or academic year\/term in your banner).<\/span><\/p><h2>How to choose a banner size<\/h2><ul><li><span data-contrast=\"none\"><strong>Blackboard recommends a\u00a0banner size of approximately 480 by 80 pixels;\u00a0<\/strong><\/span><span data-contrast=\"none\">too sma<\/span><span data-contrast=\"none\">l<\/span><span data-contrast=\"none\">l and it may lose impact, too big and\u00a0<\/span><span data-contrast=\"none\">users<\/span><span data-contrast=\"none\">\u00a0may<\/span><span data-contrast=\"none\">\u00a0feel the banne<\/span><span data-contrast=\"none\">r is distracting.\u00a0<\/span><\/li><li><span data-contrast=\"none\">Keep in mind that users can resize their browser windows, expand and collapse the course menu, and use monitors of varying sizes and screen resolutions. After you upload a banner, view it under those conditions to be sure the banner appears as intended.<\/span><\/li><\/ul><h2>How to create a module banner<\/h2><ul><li><a href=\"https:\/\/sites.reading.ac.uk\/tel-support\/2018\/07\/16\/blackboard-adding-a-banner-image-to-your-course\/\">Adding a banner image to your Blackboard module<\/a>.<\/li><li><span data-contrast=\"none\">Once you have created a banner, you can add the image to the top of other module pages by <a href=\"https:\/\/sites.reading.ac.uk\/tel-support\/2018\/07\/17\/blackboard-creating-and-editing-an-item\/\" target=\"_blank\" rel=\"noopener\">creating an item<\/a> and\u00a0<a href=\"https:\/\/sites.reading.ac.uk\/tel-support\/2020\/11\/02\/blackboard-content-editor-upload-images-videos-and-files\/\" target=\"_blank\" rel=\"noopener\">using the content editor to insert an image<\/a>.<\/span><\/li><\/ul><p>Tips when designing a module banner:<\/p><ul><li><strong>PowerPoint can be used to quickly create a module banner.<\/strong> You can download a selection of <a href=\"https:\/\/www.bb.reading.ac.uk\/bbcswebdav\/xid-21245897_4\" target=\"_blank\" rel=\"noopener\">PowerPoint banner templates and examples<\/a> for inspiration. Alternatively, there are a variety of image editing applications available from <a href=\"https:\/\/www.reading.ac.uk\/en\/digital-technology-services\/apps-anywhere\" target=\"_blank\" rel=\"noopener\">AppsAnywhere<\/a>.<\/li><li><span data-contrast=\"none\"><strong>Banners must be web friendly image files,<\/strong>\u00a0such as .jpg, or .png.<\/span><\/li><li><strong>Check copyright before using images in the banner<\/strong>.\u00a0<span data-contrast=\"none\">Commonly used sources can be<\/span><span data-contrast=\"none\">\u00a0found at\u00a0<\/span><a href=\"https:\/\/pixabay.com\" target=\"_blank\" rel=\"noopener\"><span data-contrast=\"none\">pixabay<\/span><\/a><span data-contrast=\"none\">, <a href=\"https:\/\/unsplash.com\" target=\"_blank\" rel=\"noopener\">Unsplash<\/a><\/span><span data-contrast=\"none\">, <a href=\"https:\/\/undraw.co\" target=\"_blank\" rel=\"noopener\">unDraw<\/a><\/span><span data-contrast=\"none\">\u00a0and\u00a0<\/span><a href=\"https:\/\/www.flickr.com\/creativecommons\" target=\"_blank\" rel=\"noopener\"><span data-contrast=\"auto\">Flickr.com\/CreativeCommons<\/span><\/a><span data-contrast=\"none\">. You can source University images from the <a href=\"https:\/\/www.reading.ac.uk\/dps\/photography\/dps2-photography-imagebank.aspx\" target=\"_blank\" rel=\"noopener\">DPS library<\/a>.<\/span><\/li><li><strong>Align text left or centre, <\/strong>so that small\u00a0screen users do need to scroll right to view full banner text. The b<span data-contrast=\"none\">anner file will always appear centred, it is not possible to align the file right or left.<\/span><\/li><li><strong>Use solid colour text backgrounds<\/strong> (avoid text over patterns or transparent layers).<\/li><\/ul><p><img class=\"alignnone size-full wp-image-8476\" src=\"\/wp-content\/uploads\/sites\/33\/2021\/03\/Screenshot-2021-04-14-at-08.45.55.png\" alt=\"example of text without solid fill background\" width=\"798\" height=\"100\" \/><\/p><p><img class=\"alignnone size-full wp-image-8475\" src=\"\/wp-content\/uploads\/sites\/33\/2021\/03\/Screenshot-2021-04-14-at-08.45.45.png\" alt=\"example of solid colour text background\" width=\"798\" height=\"103\" \/><\/p><\/div><\/div><\/div><div class=\"ea-card sp-ea-single\"><h3 class=\"ea-header\"><a class=\"collapsed\" id=\"ea-header-83731\" role=\"button\" data-sptoggle=\"spcollapse\" data-sptarget=\"#collapse83731\" aria-controls=\"collapse83731\" href=\"#\" aria-expanded=\"false\" tabindex=\"0\"><i aria-hidden=\"true\" role=\"presentation\" class=\"ea-expand-icon eap-icon-ea-expand-plus\"><\/i> Colours and themes<\/a><\/h3><div class=\"sp-collapse spcollapse \" id=\"collapse83731\" data-parent=\"#sp-ea-8373\" role=\"region\" aria-labelledby=\"ea-header-83731\"> <div class=\"ea-body\"><ul><li><strong>Use the default University\u00a0colour\u00a0theme<\/strong><span data-contrast=\"auto\"><strong>\u00a0for Blackboard<\/strong>, it<\/span><span data-contrast=\"auto\">\u00a0has been selected for\u00a0<\/span><span data-contrast=\"auto\">optimum<\/span><span data-contrast=\"auto\">\u00a0colour contrast. It is not advisable to change\/customise the<\/span><span data-contrast=\"auto\">\u00a0colour<\/span><span data-contrast=\"auto\">\u00a0theme of Blackboard modules.<\/span><span data-ccp-props=\"{\">\u00a0<\/span><\/li><li data-leveltext=\"\uf0b7\" data-font=\"Symbol\" data-listid=\"4\" data-aria-posinset=\"1\" data-aria-level=\"1\"><span data-contrast=\"none\"><strong>Ensure there is sufficient colour contrast<\/strong> in any text formatting or imagery in your Blackboard module. Tools like <a href=\"https:\/\/sites.reading.ac.uk\/tel-support\/2019\/08\/30\/blackboard-ally-course-accessibility-report\/\" target=\"_blank\" rel=\"noopener\">Blackboard Ally<\/a> will prompt you to select an accessible colour combination if there is not sufficient contrast in Blackboard content<\/span><span data-contrast=\"none\">. You can also check colour contrast using the <a href=\"https:\/\/webaim.org\/resources\/contrastchecker\/\" target=\"_blank\" rel=\"noopener\">WebAIM contrast checker.<\/a>\u00a0<\/span><span data-ccp-props=\"{\">\u00a0<\/span><\/li><\/ul><p><img class=\"alignnone wp-image-8436 size-medium\" src=\"\/wp-content\/uploads\/sites\/33\/2021\/03\/Screenshot-2021-04-08-at-13.56.44-300x29.png\" alt=\"example of poor colour contrast\" width=\"300\" height=\"29\" \/><\/p><ul><li data-leveltext=\"\uf0b7\" data-font=\"Symbol\" data-listid=\"4\" data-aria-posinset=\"2\" data-aria-level=\"1\"><strong>Do not use colour alone to\u00a0denote<\/strong><span data-contrast=\"none\"><strong>\u00a0meaning<\/strong>.<\/span><span data-contrast=\"none\">\u00a0For example, when highlighting text, consider adding an\u00a0<\/span><span data-contrast=\"none\">*<\/span><span data-contrast=\"none\">astrix<\/span><span data-contrast=\"none\">\u00a0to draw attention to points\u00a0<\/span><span data-contrast=\"none\">for<\/span><span data-contrast=\"none\">\u00a0screen reader<\/span><span data-contrast=\"none\">\u00a0users<\/span><span data-contrast=\"none\">.<\/span><span data-ccp-props=\"{\">\u00a0<\/span><\/li><\/ul><p><img class=\"alignnone size-full wp-image-8437\" src=\"\/wp-content\/uploads\/sites\/33\/2021\/03\/Screenshot-2021-04-08-at-14.02.43.png\" alt=\"do not rely on text highlight to draw attention\" width=\"633\" height=\"43\" \/><\/p><ul><li data-leveltext=\"\uf0b7\" data-font=\"Symbol\" data-listid=\"4\" data-aria-posinset=\"3\" data-aria-level=\"1\"><strong>Choose pastel\u00a0<\/strong><span data-contrast=\"none\"><strong>shades for text backgrounds<\/strong>,\u00a0<\/span><span data-contrast=\"none\">rather than bright\u00a0<\/span><span data-contrast=\"none\">colour or pure white. <\/span><span style=\"letter-spacing: 0px\" data-contrast=\"none\">T<\/span><span style=\"letter-spacing: 0px\" data-contrast=\"none\">h<\/span><span style=\"letter-spacing: 0px\" data-contrast=\"none\">e\u00a0<\/span><a style=\"letter-spacing: 0px\" href=\"https:\/\/www.reading.ac.uk\/internal\/staffportal\/news\/articles\/spsn-833491.aspx\" target=\"_blank\" rel=\"noopener\"><span data-contrast=\"none\">U<\/span><span data-contrast=\"none\">n<\/span><span data-contrast=\"none\">i<\/span><span data-contrast=\"none\">ver<\/span><span data-contrast=\"none\">s<\/span><span data-contrast=\"none\">ity<\/span><span data-contrast=\"none\">\u00a0<\/span><span data-contrast=\"none\">document\/presentation\u00a0<\/span><\/a><span style=\"letter-spacing: 0px\" data-contrast=\"none\">templates use accessible colour\u00a0<\/span><span style=\"letter-spacing: 0px\" data-contrast=\"none\">schemes<\/span><span style=\"letter-spacing: 0px\" data-contrast=\"none\">.\u00a0<\/span><span style=\"letter-spacing: 0px\" data-contrast=\"none\">Note, text displayed on Blackboard module pages automatically appears on a pale grey background (even though the <a href=\"https:\/\/sites.reading.ac.uk\/tel-support\/2020\/11\/05\/blackboard-learn-content-editor-2020\/\" target=\"_blank\" rel=\"noopener\">Blackboard content editor<\/a> displays a white background).<\/span><\/li><li data-leveltext=\"\uf0b7\" data-font=\"Symbol\" data-listid=\"4\" data-aria-posinset=\"2\" data-aria-level=\"1\"><strong>Avoid using multi coloured text or highlighting.<br \/><\/strong><\/li><\/ul><p><img class=\"alignnone size-full wp-image-8438\" src=\"\/wp-content\/uploads\/sites\/33\/2021\/03\/Screenshot-2021-04-09-at-08.36.22.png\" alt=\"Example of multi-coloured text highlight\" width=\"663\" height=\"48\" \/><\/p><\/div><\/div><\/div><div class=\"ea-card sp-ea-single\"><h3 class=\"ea-header\"><a class=\"collapsed\" id=\"ea-header-83732\" role=\"button\" data-sptoggle=\"spcollapse\" data-sptarget=\"#collapse83732\" aria-controls=\"collapse83732\" href=\"#\" aria-expanded=\"false\" tabindex=\"0\"><i aria-hidden=\"true\" role=\"presentation\" class=\"ea-expand-icon eap-icon-ea-expand-plus\"><\/i> Images and icons<\/a><\/h3><div class=\"sp-collapse spcollapse \" id=\"collapse83732\" data-parent=\"#sp-ea-8373\" role=\"region\" aria-labelledby=\"ea-header-83732\"> <div class=\"ea-body\"><p><span data-contrast=\"none\">Commonly used image sources can be<\/span><span data-contrast=\"none\">\u00a0found at\u00a0<\/span><a href=\"https:\/\/pixabay.com\" target=\"_blank\" rel=\"noopener\"><span data-contrast=\"none\">pixabay<\/span><\/a><span data-contrast=\"none\">, <a href=\"https:\/\/unsplash.com\" target=\"_blank\" rel=\"noopener\">Unsplash<\/a><\/span><span data-contrast=\"none\">, <a href=\"https:\/\/undraw.co\" target=\"_blank\" rel=\"noopener\">unDraw<\/a><\/span><span data-contrast=\"none\">\u00a0and\u00a0<\/span><a href=\"https:\/\/www.flickr.com\/creativecommons\" target=\"_blank\" rel=\"noopener\"><span data-contrast=\"auto\">Flickr.com\/CreativeCommons<\/span><\/a><span data-contrast=\"none\">. You can source University images from the <a href=\"https:\/\/www.reading.ac.uk\/dps\/photography\/dps2-photography-imagebank.aspx\" target=\"_blank\" rel=\"noopener\">DPS library<\/a>.\u00a0<\/span><\/p><ul><li><strong>Model good academic practice by citing sources and using third party content appropriately.<\/strong><span data-contrast=\"none\">\u00a0<\/span>Always c<span style=\"letter-spacing: 0px\" data-contrast=\"none\">heck licensing before using images, if unsure, contact university\u00a0<a href=\"https:\/\/www.reading.ac.uk\/internal\/imps\/Copyright\/TeachingLearningandAssessment\/imps-onlineteaching.aspx\" target=\"_blank\" rel=\"noopener\">IMPS<\/a>\u00a0or seek advice from the<a href=\"https:\/\/libguides.reading.ac.uk\/copyright\" target=\"_blank\" rel=\"noopener\"> library copyright guidance<\/a>.<\/span><\/li><li><span data-contrast=\"none\"><strong>Provide a text description for images, for example, using <a href=\"https:\/\/help.blackboard.com\/sites\/default\/files\/documents\/2018-05\/Ally-QuickStart-2018_12-ML-AltDescriptionsImages.pdf#new_tab\" target=\"_blank\" rel=\"noopener\">alt-text<\/a><\/strong>. This is necessary when inserting<\/span>\u00a0via\u00a0the Blackboard <a href=\"https:\/\/sites.reading.ac.uk\/tel-support\/2020\/11\/05\/blackboard-learn-content-editor-2020\/\" target=\"_blank\" rel=\"noopener\">content editor<\/a> or within uploaded \u00a0materials (excluding module banners). A<span data-contrast=\"none\">\u00a0text description will enable assistive technology to read aloud an image description for sight impaired users<\/span><span data-contrast=\"none\">. Tools like <a href=\"https:\/\/sites.reading.ac.uk\/tel-support\/2018\/08\/15\/getting-started-with-blackboard-ally\/\" target=\"_blank\" rel=\"noopener\">Blackboard Ally<\/a> will prompt you to add alt-text to any images. Note; Ally does not check images present in video content, it is recommended to check your video\u00a0<a href=\"https:\/\/sites.reading.ac.uk\/tel-support\/2020\/06\/26\/ms-stream-transcript\/\" target=\"_blank\" rel=\"noopener\">Stream captions<\/a>\u00a0to ensure they provide an adequate description of non-decorative images used in the video (or you may consider creating a supplementary document for students who have a registered need).<\/span><\/li><li><strong>You may use the university\u00a0Blackboard icons, alongside headings and titles, to signpost<\/strong><span data-contrast=\"auto\"><strong>\u00a0content.<\/strong>\u00a0This\u00a0<\/span><span data-contrast=\"auto\">helps students to visually identify links to their <\/span><span data-contrast=\"auto\"><span data-contrast=\"auto\"><span data-contrast=\"auto\"><a href=\"https:\/\/sites.reading.ac.uk\/curriculum-framework\/module-road-maps\/\">Module roadmap \/ Weekly plans;<\/a>\u00a0 therefore icons must not replace a heading, title or any other text. <\/span><\/span><\/span>A sample of the icons is shown below. you can <a href=\"https:\/\/www.bb.reading.ac.uk\/bbcswebdav\/xid-18188411_4\" target=\"_blank\" rel=\"noopener\">download the full set of image files<\/a>\u00a0and insert via\u00a0the Blackboard <a href=\"https:\/\/sites.reading.ac.uk\/tel-support\/2020\/11\/05\/blackboard-learn-content-editor-2020\/\" target=\"_blank\" rel=\"noopener\">content editor<\/a> or within uploaded \u00a0materials (such as documents and PowerPoints). The icon file name contains a key term you should use in item titles or document headings, to provide parity for assistive technology users (it is recommended to use\u00a0<span data-contrast=\"none\"><a href=\"https:\/\/sites.reading.ac.uk\/tel-support\/2018\/08\/15\/getting-started-with-blackboard-ally\/\" target=\"_blank\" rel=\"noopener\">Blackboard Ally<\/a>\u00a0to mark these icons as 'decorative').<\/span><\/li><\/ul><p><img class=\"size-full wp-image-8440 aligncenter\" src=\"\/wp-content\/uploads\/sites\/33\/2021\/03\/Screenshot-2021-04-09-at-09.14.15.png\" alt=\"Sample of university Blackboard icons\" width=\"621\" height=\"127\" \/><\/p><\/div><\/div><\/div><\/div><\/div>\n","protected":false},"excerpt":{"rendered":"<p>What &#8216;visual design&#8217; elements can I control in Blackboard? Visual design elements, such as images and text formatting,\u00a0can\u00a0be displayed in several places on Blackboard module pages:\u00a0 the module banner\u00a0 folder descriptions,\u00a0announcement\u00a0posts,\u00a0content items and\u00a0activity instructions\u00a0 within uploaded content and screencasts, for example, documents and PowerPoints *University templates for Office\u00a0contain DPS images, however you may consider sourcing [&hellip;]<\/p>\n","protected":false},"author":63,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"om_disable_all_campaigns":false,"_lmt_disableupdate":"","_lmt_disable":"","_exactmetrics_skip_tracking":false,"_exactmetrics_sitenote_active":false,"_exactmetrics_sitenote_note":"","_exactmetrics_sitenote_category":0,"jetpack_post_was_ever_published":false,"_links_to":"","_links_to_target":""},"categories":[125],"tags":[],"acf":[],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v21.8.1 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>Visual design for Blackboard modules - Technology Enhanced Learning<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/sites.reading.ac.uk\/tel\/visual-design-for-blackboard-modules\/\" \/>\n<meta property=\"og:locale\" content=\"en_GB\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Visual design for Blackboard modules - Technology Enhanced Learning\" \/>\n<meta property=\"og:description\" content=\"What &#8216;visual design&#8217; elements can I control in Blackboard? Visual design elements, such as images and text formatting,\u00a0can\u00a0be displayed in several places on Blackboard module pages:\u00a0 the module banner\u00a0 folder descriptions,\u00a0announcement\u00a0posts,\u00a0content items and\u00a0activity instructions\u00a0 within uploaded content and screencasts, for example, documents and PowerPoints *University templates for Office\u00a0contain DPS images, however you may consider sourcing [&hellip;]\" \/>\n<meta property=\"og:url\" content=\"https:\/\/sites.reading.ac.uk\/tel\/visual-design-for-blackboard-modules\/\" \/>\n<meta property=\"og:site_name\" content=\"Technology Enhanced Learning\" \/>\n<meta property=\"article:modified_time\" content=\"2021-04-21T14:24:13+00:00\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Estimated reading time\" \/>\n\t<meta name=\"twitter:data1\" content=\"1 minute\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\/\/sites.reading.ac.uk\/tel\/visual-design-for-blackboard-modules\/\",\"url\":\"https:\/\/sites.reading.ac.uk\/tel\/visual-design-for-blackboard-modules\/\",\"name\":\"Visual design for Blackboard modules - Technology Enhanced Learning\",\"isPartOf\":{\"@id\":\"https:\/\/sites.reading.ac.uk\/tel\/#website\"},\"datePublished\":\"2021-03-22T15:29:54+00:00\",\"dateModified\":\"2021-04-21T14:24:13+00:00\",\"breadcrumb\":{\"@id\":\"https:\/\/sites.reading.ac.uk\/tel\/visual-design-for-blackboard-modules\/#breadcrumb\"},\"inLanguage\":\"en-GB\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/sites.reading.ac.uk\/tel\/visual-design-for-blackboard-modules\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/sites.reading.ac.uk\/tel\/visual-design-for-blackboard-modules\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/sites.reading.ac.uk\/tel\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Visual design for Blackboard modules\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/sites.reading.ac.uk\/tel\/#website\",\"url\":\"https:\/\/sites.reading.ac.uk\/tel\/\",\"name\":\"Technology Enhanced Learning\",\"description\":\"\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/sites.reading.ac.uk\/tel\/?s={search_term_string}\"},\"query-input\":\"required name=search_term_string\"}],\"inLanguage\":\"en-GB\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Visual design for Blackboard modules - Technology Enhanced Learning","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/sites.reading.ac.uk\/tel\/visual-design-for-blackboard-modules\/","og_locale":"en_GB","og_type":"article","og_title":"Visual design for Blackboard modules - Technology Enhanced Learning","og_description":"What &#8216;visual design&#8217; elements can I control in Blackboard? Visual design elements, such as images and text formatting,\u00a0can\u00a0be displayed in several places on Blackboard module pages:\u00a0 the module banner\u00a0 folder descriptions,\u00a0announcement\u00a0posts,\u00a0content items and\u00a0activity instructions\u00a0 within uploaded content and screencasts, for example, documents and PowerPoints *University templates for Office\u00a0contain DPS images, however you may consider sourcing [&hellip;]","og_url":"https:\/\/sites.reading.ac.uk\/tel\/visual-design-for-blackboard-modules\/","og_site_name":"Technology Enhanced Learning","article_modified_time":"2021-04-21T14:24:13+00:00","twitter_card":"summary_large_image","twitter_misc":{"Estimated reading time":"1 minute"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/sites.reading.ac.uk\/tel\/visual-design-for-blackboard-modules\/","url":"https:\/\/sites.reading.ac.uk\/tel\/visual-design-for-blackboard-modules\/","name":"Visual design for Blackboard modules - Technology Enhanced Learning","isPartOf":{"@id":"https:\/\/sites.reading.ac.uk\/tel\/#website"},"datePublished":"2021-03-22T15:29:54+00:00","dateModified":"2021-04-21T14:24:13+00:00","breadcrumb":{"@id":"https:\/\/sites.reading.ac.uk\/tel\/visual-design-for-blackboard-modules\/#breadcrumb"},"inLanguage":"en-GB","potentialAction":[{"@type":"ReadAction","target":["https:\/\/sites.reading.ac.uk\/tel\/visual-design-for-blackboard-modules\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/sites.reading.ac.uk\/tel\/visual-design-for-blackboard-modules\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/sites.reading.ac.uk\/tel\/"},{"@type":"ListItem","position":2,"name":"Visual design for Blackboard modules"}]},{"@type":"WebSite","@id":"https:\/\/sites.reading.ac.uk\/tel\/#website","url":"https:\/\/sites.reading.ac.uk\/tel\/","name":"Technology Enhanced Learning","description":"","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/sites.reading.ac.uk\/tel\/?s={search_term_string}"},"query-input":"required name=search_term_string"}],"inLanguage":"en-GB"}]}},"jetpack_sharing_enabled":true,"featured_image_src":null,"featured_image_src_square":null,"jetpack_shortlink":"https:\/\/wp.me\/P9UENj-2b1","_links":{"self":[{"href":"https:\/\/sites.reading.ac.uk\/tel\/wp-json\/wp\/v2\/pages\/8371"}],"collection":[{"href":"https:\/\/sites.reading.ac.uk\/tel\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/sites.reading.ac.uk\/tel\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/sites.reading.ac.uk\/tel\/wp-json\/wp\/v2\/users\/63"}],"replies":[{"embeddable":true,"href":"https:\/\/sites.reading.ac.uk\/tel\/wp-json\/wp\/v2\/comments?post=8371"}],"version-history":[{"count":17,"href":"https:\/\/sites.reading.ac.uk\/tel\/wp-json\/wp\/v2\/pages\/8371\/revisions"}],"predecessor-version":[{"id":8549,"href":"https:\/\/sites.reading.ac.uk\/tel\/wp-json\/wp\/v2\/pages\/8371\/revisions\/8549"}],"wp:attachment":[{"href":"https:\/\/sites.reading.ac.uk\/tel\/wp-json\/wp\/v2\/media?parent=8371"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/sites.reading.ac.uk\/tel\/wp-json\/wp\/v2\/categories?post=8371"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/sites.reading.ac.uk\/tel\/wp-json\/wp\/v2\/tags?post=8371"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}