Before and After the Utd Universal Banner Rollout: Visual Evidence and Interface Comparisons
The technical overhaul centers on a clean, responsive web layout that prioritizes mobile touch targets while keeping desktop utility dense and scannable. Earlier headers featured bulky secondary utility strips that consumed up to 120 pixels of vertical viewport height before displaying page content. The new global component trims that footprint substantially.
The primary element is the prominent institutional wordmark paired with the university monogram, engineered as an SVG asset to prevent pixel distortion on high-DPI retina displays. Flanking the right edge sits a global search trigger, an accordion menu for core institutional portals (Galaxy, eLearning, and Directory), and an emergency alert notification strip capable of overriding the masthead with bright yellow or red warnings during severe weather closures.
| Interface Attribute | Legacy Subdomain Headers (Pre-Rollout) | Universal Banner Architecture (Current) |
|---|---|---|
| Vertical Footprint | 90px, 130px stacked headers | 54px fixed desktop height (collapsible) |
| Color Contrast Compliance | Inconsistent; orange text failed 4.5:1 ratio | WCAG 2.1 AA certified (custom dark evergreen background) |
| Portal Quick-Links | Scattered text links or missing entirely | Standardized flyout drawer for Galaxy, eLearning, Directory |
| Search Integration | Isolated Google Custom Search per site | Federated institutional search with scoped filters |
| Mobile Viewport Behavior | Horizontal overflow and clipped logo graphics | Dynamic off-canvas drawer with minimum 44px tap targets |