Web & Digital Strategy

New Block Options for Editors

jbaum02s — Wed, 23 Jul 2025 12:40:08 +0000

New Block Options for Editors jbaum02s Wed, 07/23/2025 - 07:40

Custom Block Examples

khobb2 — Wed, 16 Jul 2025 17:49:26 +0000

Custom Block Examples khobb2 Wed, 07/16/2025 - 12:49

Card Blocks

Editors now have the option to add different types of cards for their site within the normal editor. Each card can be customized with images, text and links.

Image Cards

Called the "Image Card Container" this block produces a great way to link pages of interest to your content.

You will need:

an image (preferably 400px by 600px)
a card title
a link

What it looks like inside the editor:

What it looks like published:

Visual Arts

Study Away

Image Cards with Description Container

Add Image Cards with a Description using the container. You can add up to 4 cards per container. You can add a title, image, description, URL, and link title text. The link title should match the page title you are linking to for accessibility.

Published View of Image Cards with Description

Once published, the cards automatically add the style and hover effects.

Basic Card Container

A great way to add some calls to action in your content.

You will need:

Card title
Description text (optional)
Link

What it looks like in the editor:

What it looks like published:

Visual Arts

This is where the description goes.

Study Away

This is a longer description to show you how the card looks.

Web Resources

You can add a card with a link and customize each field within the card.

Department & Term Content Blocks

You can now put news, event, directory, and all sorts of feeds anywhere you want in your content! To learn how to insert them into content, please see our How to Use Department & Term Content Blocks resource.

Directory: Faculty or Directory: Staff

Events

FAQs

News

Policies

Profiles

Programs of Study

List of Programs

List of Programs with Filters

Research

How to Use Department & Term Content Blocks

jbaum02s — Thu, 10 Jul 2025 19:15:04 +0000

How to Use Department & Term Content Blocks jbaum02s Thu, 07/10/2025 - 14:15

Department blocks can added to any Page by clicking the + button in the editor and clicking or searching for the block name.

Editors have the option to add content specific to their department or for some, by term. There are various types of blocks available for use:

News - list of department articles
Directory
- Faculty
- Staff
FAQs - list of department frequently asked questions, input using the FAQ content type
Events
- Event Grid
- Event List
Programs of Study
- Programs - list all programs
- Programs w Filters - list of all programs with option to filter by type and format
- Undergraduate Programs
- Minor Programs
- Graduate Programs
- Graduate Certificates
- Online Programs
Profiles
- Featured Alumni - featured alumni added using the article content type
- Featured Faculty - featured faculty added using the article content type
- Featured Students - featured students added using the article content type
Policies
Resources
- Resources Table - list of department resources in a table format
- Resources Grid - list of department resources in a grid format
Research
- Research by Department - list of research for a department
- Research by Term - list of research for a project keyword

How to Add a Department or Term Content Block

Department blocks can added to any Page by clicking the + button in the editor and clicking or searching for the block name.

When you add a department view or term content block, it will show a message 'This block is rendering empty content'. This is correct.

In order for the content to show for your department on that page, make sure your page has the department selected under the More Settings section below the editor. If you do not have a department selected, your content will not show up.

For the Directory blocks, select the department in the Directory Dept field. For blocks that are based on terms, like for example the Research by Term block, select the keyword in the Project Keywords field.

If added correctly, you will see the content rendered after saving the page as a draft.

Web Editor Training

khobb2 — Mon, 09 Jun 2025 13:50:20 +0000

Web Editor Training khobb2 Mon, 06/09/2025 - 08:50

Sign up for website editor training on the uis.edu website. Training typically lasts an hour and is open to all staff and students.

Web Editor Training Sign Up

When

Wed, Aug 13 2025, 2 - 3pm

Tue, Aug 26 2025, 11am - 12pm Google Outlook iCal

Tue, Sep 9 2025, 3 - 4pm Google Outlook iCal

Thu, Sep 25 2025, 10 - 11am Google Outlook iCal

Wed, Oct 15 2025, 2 - 3pm Google Outlook iCal

Thu, Oct 30 2025, 10 - 11am Google Outlook iCal

Tue, Nov 11 2025, 11am - 12pm Google Outlook iCal

Mon, Nov 24 2025, 3 - 4pm Google Outlook iCal

Wed, Dec 10 2025, 11am - 12pm Google Outlook iCal

Location

Zoom

Event Type

Employee

Training

Workshop

Department

Web & Digital Strategy

Website File Upload Limitations

jbaum02s — Tue, 01 Apr 2025 15:30:43 +0000

Website File Upload Limitations jbaum02s Tue, 04/01/2025 - 10:30

How to Submit an Article to Orbit

jbaum02s — Wed, 19 Mar 2025 19:51:20 +0000

How to Submit an Article to Orbit jbaum02s Wed, 03/19/2025 - 14:51

How to Submit an Article to Orbit

Now editors have the option to add articles to Orbit for their employee news and announcements.

You can do so by selecting an option the Orbit news category, and the corresponding subcategory on what type of Orbit article it is:

breaking news: time-sensitive information that is pertinent to all of campus.
campus announcement: share all your departments campus announcements, directly related to employees.
eom: this is to create and share articles related to the employee of the month.

All articles recommended by editors are reviewed by the Office of Marketing and Brand Strategy for alignment to the Orbit purpose and goals.

Once you are ready for your article to be reviewed and published, submit for 'Needs Review' and an email will be sent to the Marketing team for review.

If you have any questions on this new capability, contact web@uis.edu.

Mobile Accessibility

khobb2 — Wed, 19 Feb 2025 19:25:55 +0000

Mobile Accessibility khobb2 Wed, 02/19/2025 - 13:25

Mobile accessibility is covered in existing W3C WAI accessibility standards/guidelines. There are not separate guidelines for mobile accessibility.

Keep different screen sizes in mind
When designing any app, it’s important to remember that users will have different screen sizes. To accommodate those with smaller screens, you will need to keep information on each page to a minimum, adjust the position of form fields, and use a reasonable content size.
Pay attention to color contrast
Since many mobile apps will be used outdoors and by disabled users, color contrast is an essential accessibility consideration. Text should have a color contrast ratio of at least 4.5:1, while larger text should be at least 3:1.
Simplify hand gestures
Any gestures required to operate a mobile app should be kept as simple as possible to accommodate users with disabilities. Opt for tap or swipe gestures as opposed to more complex ones.
Adjust tap target sizes
If your app displays multiple elements at once, they should be large enough and spaced out so that app users can easily tap them. This includes elements such as buttons.
Make data entry easy
Since text entry can be a tricky and time-consuming task for many users, it’s essential to provide easy methods for data entry. For one, you can reduce the amount of text required by adding checkboxes and auto-filling information such as the date and time. Providing autofill and data sharing functionality is also recommended.
Keep layouts consistent
Any information that’s present across multiple screens on your app should be consistent. Even if you need to place your navigation in a hamburger menu on certain screens, make sure the menu items are in the same order.

Testing Methods

Test on real mobile devices of different sizes
- Identify the devices for testing
Use tests that incorporate assistive technologies and test for general accessibility and mobile specific accessibililty
Test on responsive windows on a desktop device
Test on a desktop device

Best Practices

Make sure links work and when opened create a thematically coherent experience.
Exploit device capabilities to enhance user experience
Provide only minimal navigation at the top of the page.
Avoid using too many links on a page.
Provide consistent navigation mechanisms.
Provide shortcuts to key links.
Use clear, concise descriptive link text; identify the implications of following a link if the target is large.
Use clear and simple language.
Limit scrolling to one direction.
Avoid large or high resolution images.
Do not use tables or nested tables.
Provide alt text for images.
Specify the size of images in the markup if they have intrinsic size.
Keep style sheets small.
Ensure the content is encoded using a character encoding that is known to be supported by devices.
Do no rely on support of font related styling.
Provide pre-selected default values where possible.
Specify default language.
Label all controls and position so they lay out properly in relation to the form controls they refer to.
Use cookies sparingly
Use appropriate client-side storage technologies for local data
Do not execute untrusted JSON data.
Ensure the user is informed about use of personal device information.
Enable automatic sign-in
Avoid redirects
Optimize network requests.
Include background images inline in CSS styles
Cache Ajax data
Do not send cookie information
Keep DOM size reasonable.
Make telephone numbers click to call.
Ensure consistency between devices.
Consider use of canvas element or SVG for dynamic graphics.

Resources

Mobile Accessibility at W3C

W3C Mobile Web Best Practices 1.0

W3C Mobile Application Best Practices

How WCAG 2.0 and Other W3C Guidelines Apply to Mobile

Web Accessibility

khobb2 — Wed, 19 Feb 2025 19:23:21 +0000

Web Accessibility khobb2 Wed, 02/19/2025 - 13:23

The Office of Web & Digital Strategy at 69��app Springfield is passionate about accessibility. For the web, not only does law require it, it is the right thing to do.

The Illinois Information Technology Accessibility Act (IITAA) requires Illinois agencies and universities to ensure that their web sites, information systems, and information technologies are accessible to people with disabilities.

The federal government has released a Notice of Proposed Rulemaking on Accessibility on Web Information and Services on State and Local Government Entities. It proposes to adopt the Web Content Accessibility Guidelines (WCAG) Version 2.1, Level AA as the technical standard that state and local governments would need to follow.

The Office of Web & Digital Strategy has made accessibility a focus for the architecture of official UIS website. This accessibility continues to maintain that quality level each year.

Web Accessibility Guidelines for UIS Websites

The following are some important guidelines to help UIS website Editors and Authors maintain accessibility for their web pages.

1) Use heading styles in semantic structure

Heading styles are given to create sections and subsections on your web page.

Headings can be used throughout your page and should be properly nested (e.g. Heading 2, then Heading 3, then Heading 4, etc.). The title of the page is by default Heading 1.

2) Every image MUST have an Alt attribute

All images should have an Alt attribute. For example, when you insert an image into your web page, remember to add a brief description of the image in the Alt Text field in the block settings in the right sidebar menu.

3) Link text should match the page title it is pointing to

Avoid using vague titles like 'Click Here', 'Learn More', and 'Download' which do not tell the user where they will be directed to.
Avoid repeating links text if possible since screen readers navigate pages using links and headings.
Using the same text for links on the same page that point to different locations on the web will result in an accessibility error. Create your link text to be unique for different URLs.

View the full list of guidelines Web Content Accessibility Guidelines (WCAG) Version 2.1.

Web Accessibility Evaluation

“The Functional Accessibility Evaluator (FAE) 2.0 analyzes web pages for requirements defined by the W3C Web Content Accessibility Guidelines 2.0 Level A and AA Success Criteria.”

Evaluate a web page using FAE

“The World Wide Web Consortium (W3C) is an international community where Member organizations, a full-time staff, and the public work together to develop web standards. W3C’s mission is to lead the web to its full potential.”

Evaluate a web page using W3C

Web Color Guide

khobb2 — Wed, 19 Feb 2025 19:15:58 +0000

Web Color Guide khobb2 Wed, 02/19/2025 - 13:15

Primary Colors

The official UIS primary colors are Blue and White. See below for standard color codes for print and electronic media (websites and other screen-based presentations).

Blue

Pantone (PMS): #295
CMYK: C-100, M-57, Y-0, K-40
RGB: R-0, G-51, B-102
Hex: 003366

White

Pantone (PMS): White
CMYK: C-0, M-0, Y-0, K-0
RGB: R-255, G-255, B-255
Hex: ffffff

Secondary Color

The official UIS secondary color is Gold. See below for standard color codes for print and electronic media (websites and other screen-based presentations).

Gold

Pantone (PMS): #7503
CMYK: C-0, M-12, Y-35, K-25
RGB: R-200, G-177, B-139
Hex: c8b18b

Asset Colors

The colors included in the asset palette should be used to add visual interest to university webpages.

Green

Hex: 16cc5c

Orange

Hex: ff9a26

Magenta

Hex: ef4e7b

Light Gray

Hex: f1f1f1

Cyan

Hex: 0080ff

Dark Gray

Hex: 555555

How to use the UIS Mobile App

jbaum02s — Thu, 30 Jan 2025 19:10:09 +0000

How to use the UIS Mobile App jbaum02s Thu, 01/30/2025 - 13:10

The UIS Mobile App is designed to keep students, faculty, and staff connected with essential university resources. Follow this guide to navigate and make the most of its features.

1. Downloading the App

The UIS Mobile App is available for both iOS and Android devices.

iPhone Users: Download from the App Store
Android Users: Download from Google Play

Once installed, open the app, choose your persona, and log in using your NetID and password for a personalized experience.

2. Navigating the App

Upon launching the app, you’ll find a user-friendly interface with quick access to essential tools. Here’s what you can do:

Home Screen Overview

View campus news and receive important notifications.
Access important academic links including class schedule, grades, and student resources.
Need to know whats for lunch and dinner? Find out the menu of the day on the Dining view.
Use Quick Links to navigate to frequently used UIS services.

3. Key Features & How to Use Them

📍 Campus Navigation

Use the map to locate buildings, offices, and other key areas on campus.
Get quick access to parking maps, tags, and the Parking Smarter app.

📰 UIS News & Events

Stay informed with real-time updates on campus events, academic deadlines, and announcements.
Enable push notifications to receive alerts about major campus updates.

📚 Academic Tools

Access Canvas to view assignments, grades, and class discussions.
Use the Advising Tool to plan future courses and connect with academic advisors.

🚨 Campus Safety & Emergency Alerts

Quickly access emergency contact information and safety guidelines.
Receive instant RAVE emergency alerts and campus closure notifications.

💳 i-Card Wallet Services

Check your i-Card wallet balance.

🔑 HID Door Access

Use your mobile device for secure, contactless entry into authorized campus buildings with HID digital access.
The HID Mobile Access app is also required to be installed to take advantage of this feature.
- HID Mobile Access from the App Store
- HID Mobile Access on Google Play
Open the UIS Mobile app, select Student or Employee, and log in with your NetID and password.
Find more information on how to setup Mobile Credentials for HID door access on your device.

🎉 UIS Sticker Pack

Add fun, custom UIS stickers to your iMessage conversations and rep your Prairie Star pride wherever you chat.

iOS users - UIS Sticker Pack is automatically added to iMessage once the app is installed!
- Tap the + icon next to the iMessage text field.
- Swipe up or down through the iMessage app drawer until you see the Stickers category.
- Swipe left or right through the app icons until you see the UIS Mobile app icon.
- Tap it to open and view all available stickers.
- Tap a sticker to insert it into a message instantly.
- Or drag and drop stickers onto message bubbles, photos, or even other stickers to personalize your messages!

Tap on the + icon by the iMessage text field

Tap on Stickers

Tap on the UIS Mobile app icon

See all of the stickers available!

Insert your sticker into the message field
by tapping on it

Mobile App FAQs

What is the UIS Mobile App?

The UIS Mobile App is an all-in-one tool that helps students, faculty, and staff access important campus resources, academic tools, and real-time updates on events, news, and safety alerts.

Do I need to login to use the app?

While some features are available to all users, logging in with your NetID and password provides a personalized experience, including access to class schedules, grades, and more.

Can I check my class schedule on the app?

Yes! Once logged in, you can access your class schedule, grades, and course materials directly through the app.

How do I enable/disable notifications?

You can manage notification preferences in the app settings by clicking the profile icon in the top right, then clicking the Notifications link. Enable push notifications to stay informed about events, safety alerts, and academic updates.

Will I receive emergency notifications through the app?

Yes! The app integrates with RAVE Alerts to notify you of emergencies, severe weather updates, and campus closures.

The app is not working properly. What should I do?

Try closing and reopening the app, and ensure it is updated to the latest version. If issues persist, submit your issues to the UIS Mobile App Support and Feedback form.

Can I provide feedback or request new features?

Yes! UIS encourages users to submit feedback through the app settings or by sending your thoughts and information on the UIS Mobile App Support and Feedback form.

Web & Digital Strategy

New Block Options for Editors

Custom Block Examples

Card Blocks

Image Cards

You will need:

What it looks like inside the editor:

What it looks like published:

Image Cards with Description Container

Published View of Image Cards with Description

Basic Card Container

You will need:

What it looks like in the editor:

What it looks like published:

Visual Arts

Study Away

Web Resources

Department & Term Content Blocks

Directory: Faculty or Directory: Staff

Events

FAQs

News

Policies

Profiles

Programs of Study

List of Programs

List of Programs with Filters

Research

How to Use Department & Term Content Blocks

How to Add a Department or Term Content Block

Web Editor Training

Website File Upload Limitations

How to Submit an Article to Orbit

How to Submit an Article to Orbit

Mobile Accessibility

Testing Methods

Best Practices

Resources

Web Accessibility

Related Links

Web Accessibility Guidelines for UIS Websites

1) Use heading styles in semantic structure

2) Every image MUST have an Alt attribute

3) Link text should match the page title it is pointing to

Web Accessibility Evaluation

Web Color Guide

Primary Colors

Blue

White

Secondary Color

Gold

Asset Colors

Green

Orange

Magenta

Light Gray

Cyan

Dark Gray

How to use the UIS Mobile App

1. Downloading the App

2. Navigating the App

Home Screen Overview

3. Key Features & How to Use Them

📍 Campus Navigation

📰 UIS News & Events

📚 Academic Tools

🚨 Campus Safety & Emergency Alerts

💳 i-Card Wallet Services

🔑 HID Door Access

🎉 UIS Sticker Pack

Mobile App FAQs

What is the UIS Mobile App?

Do I need to login to use the app?

Can I check my class schedule on the app?

How do I enable/disable notifications?

Will I receive emergency notifications through the app?

The app is not working properly. What should I do?

Can I provide feedback or request new features?