Web

What's New

UCLA Strategic Communications is currently working on new initiatives for the web, including a UI Component Library and a new campuswide web platform. The goal is to create a better user experience across all UCLA web properties so that anyone who visits ucla.edu or any of its subdomains can seamlessly navigate any of our other sites.

Ucla.edu is in the process of being redesigned, alongside the relaunch of this Brand Guidelines website. Such a moment gives us the unique opportunity to align campus representatives’ sites around unified elements.

Additionally, as work is completed, it will provide a toolkit and guide for future websites and site features for those who wish to benefit from the work being done.

  • Align the look and feel of our site s with these Brand Guidelines so that it reflects UCLA holistically
  • Align the site with the user experience needs of today and tomorrow
  • Arrange content in a way that tells the UCLA/campus entity story and highlights key-priorities
  • Design based on a content-first approach
  • Layouts formed with a mobile-first approach
  • The user interface will consider cross-campus requirements
  • Integrated crisis management requirements
  • Integrated social media feed
  • Integrate hooks for dynamic content/AI integration and personalization
  • Integrate GDPR and privacy law form/submission requirements
  • Integrate analytics with rollup tag (Google Tag manager)
  • Integrate ADA compliant (WCAG Level 2.1) features and requirements

UI Component Library

UCLA Strategic Communications invites you and your campus entity to participate in the creation of the branded UCLA Web Component Library. These components will be available as code components that web developer staff will be able to use for UCLA web development needs. Importantly, these branded components will be created to comply with ADA requirements. Strategic Communications has been analyzing the components currently in use on various UCLA websites. The results of that analysis will form the base UCLA Component Library for you to access on this site.

If you are interested in joining, please contact us via brand@stratcomm.ucla.edu.

Web Platform

ITS and OIT’s DC (Disabilities and Computing Program) are partnering with Strategic Communications to create a UCLA-branded web platform using Drupal 8, Acquia and PatternLab. This platform will make it easy for you to access the tools you need to create and deploy websites that help you meet your objectives and ultimately reach and engage with your target audiences.

While your website will share design, navigation, ADA compliance, and structural elements with other sites, your content and messaging will always make your website distinct. With these new initiatives, your organization will be free to focus on developing relevant, valuable and actionable content rather than the framework and delivery of the user experience.

Next Steps

For Campus Partners

  • Submit your questions for Strategic Communications to answer
  • Set up leadership/stakeholder discussions, as needed
  • Participate in a campuswide fund bucket that Strategic Communications will set up

For those who join, you can expect Strategic Communications to

  • Run the audit of your sites
  • Provide Discovery and timeline
  • Scope your site (phases, budget, schedule, assumptions)
  • Solidify funding and resources
  • Kick off the remaining work to get your site live

Web Standards

This guide is designed to help you create, manage and measure content for the web. Here, you’ll find some basic best practices for creating content that’s usable, accessible and aligns with UCLA’s brand guidelines. You’ll also find tips and resources for optimizing content for search engines, as well as analytics basics to help you measure performance and make data-driven decisions.

Usability

Usability is the practice of creating websites that are intuitive and easy to understand. By implementing some usability basics, you’ll create more effective content and a more positive experience for your users. Below are simple tips — see the links in the resources section below to learn more about the important and complex discipline of usability.

Here are a few tips:

  • Create web pages that are easy to scan, with clear labels for section headings and content categories, and without too many long blocks of text.
  • Simplify site navigation as much as possible, and make sure navigation is easy to use on all devices.
  • Use simple, clear language and avoid unnecessary jargon when possible. Remember to write your content for the public. The average national reading level is 8th grade. When you write at a higher reading level, you reduce your audience and the number of people who can benefit from your content.
  • Establish credibility by using proper UCLA logos and images
  • Use black text on plain, high-contrast backgrounds for better readability.
  • Double-check that all links are working correctly and don’t lead to 404 error pages.
  • When including forms, only ask for essential information.
  • Before launch, test your production site with real, in-person users.
  • Announce and communicate changes to a website after a major redesign.

Accessibility

As a public institution, UCLA is required to make our web content accessible to all. Below are some web accessibility basics; for more information, check out the Accessibility section of Brand Guidelines as well as the Tools and Resources section, below.

Here are a few tips:

  • Use HTML headings to structure content so non-sighted users can navigate the page.
  • Test your pages using only a keyboard, for those that are unable to use a mouse while navigating your site.
  • Include alt text for images, so screen readers can understand your message.
  • Avoid using color exclusively to communicate information — visually impaired and color-blind users may not be able to read it.
  • Use a minimum 40x40 px clickable area for all touch controls.
  • Descriptively name links to help screen reader users.

Search Engine Optimization

SEO ensures that search engines can read and understand your website, and also maximizes your ability to grow your audience from search engines, a major source of traffic on the web. Below are a few fundamentals to get you started — see the Tools and Resources section below to learn more.

Optimize Your Metadata

Metadata is the information you add to a web page to help users and search engines understand the content. Here is a basic checklist to make sure you’re set up for SEO success:

  • Create URLs that are easy to understand and describe the content of the page.
  • Make sure your page titles are descriptive and relevant.
  • Write a descriptive meta description (the sentence that appears under your page title in search results) for each page, and keep these descriptions under 155 characters.
  • Write compelling and descriptive headlines and sub-headlines on every page, and make sure they describe the corresponding content.
  • Use Heading tags (H1, H2, etc.) in the HTML of all of your pages.
  • Write descriptive alt text for all images and videos so search engines can understand the content of your imagery.
  • Write unique metadata for every web page — don’t use the same metadata for every page of your website.

Links

When search engines crawl your site, they click all of the links and take note of the traffic and page authority of each one. First of all, test all of the links on your site to make sure they are working and directing to the correct destination. Link to other relevant internal pages of your site when possible to boost traffic to those pages.

Keywords

Keywords — the phrases users type into a search engine — are a cornerstone of an effective SEO strategy. Conducting keyword research will help you understand which phrases people are using to find your site, and then identify new phrases that you want to target with the goal of inviting more traffic from search engines.

Once you have a list of keyword phrases, review your website to make sure relevant pages feature them where applicable, including page titles, headlines, meta descriptions, etc. You can also create new content that aligns with your priority phrases, whether that’s a blog post or a new page for your site.

Remember: SEO and keyword research can supplement your overall web strategy, but should not define it. Content created mainly for search engines is easily identifiable and will not be popular with your audience or search engines. Create web content that serves your audience first and foremost.

Design and Development for SEO

Search engines prioritize sites that are optimized for mobile devices. We recommend designing a responsive website that works on all devices and screen sizes. Search engines also prefer sites that load faster (especially on mobile). Optimize your website for speed by making sure pages load as quickly as possible (see Google’s PageSpeed tool in the Tools and Resources section below).

Analytics

Before using an analytics tool, it’s important to define your audiences and objectives. Then, track your site’s performance to identify areas of success and areas where you can improve.

Here are a few tips:

  • Google Analytics is a good (and free to use) resource to start monitoring traffic.
  • Set up a dashboard to keep track of your key metrics.
  • Exclude internal traffic (your team’s IP addresses) from your traffic data.
  • Understand where your visitors are coming from by identifying the sources of your web traffic, including search, direct, email campaigns, social media, paid ads, etc.
  • Factor in the time spent on each of your pages, and identity underperforming pages by a high bounce rate.
  • Keep track of your site’s performance over time by comparing data month-over-month and year-over-year.

Tools and Resources

Usability

Accessibility

SEO

Analytics