Global Links

Web Design

Information Architecture Comes First

Information architecture comes before design when developing a website. If you don’t spend enough time planning information architecture, you’ll likely end up with a site with broken links, confusing navigation, and frustrated users. Information architecture is a blueprint for your site’s structure, showing hierarchies, divisions, and relationships between pages. Learn more.

Basic Design Considerations

Consider these questions in thinking through the design phase of web development:

  • What is the most important and useful information you’re providing, and how will the design highlight that?
  • What message will your design convey? Fun and lively? Serious? Different sections of your site may require different treatments, even as you maintain a consistent look.
  • How will your overall design highlight photos, text, and other content?
  • How trendy should you be? Trends go out of style quickly; a clean, straightfoward design will look good for a longer time.
  • Do you have the resources to maintain your site? If you include photos and videos, do you have staff who can refresh this content?
  • Do you have usage rights for your photos and videos?
Fonts and Rutgers Websites

Basis fonts for Rutgers websites are:

  • Top-Level Headlines: Times New Roman
  • Lower-Level Headlines and Body Text: Arial
Drupal Content Management System

The websites for Rutgers, the New Brunswick Campus, and Rutgers Today are created and managed by University Relations using the Drupal content management system. Drupal makes it easy for content creators to organize, publish, and manage a website. Learn more.

Your Website and University Links

Rutgers webpages should appropriately represent and promote the entire university, as well as specific departments or programs. See the University Web Policy for information on elements that must appear on all official Rutgers sites. Where appropriate, incorporate links to universitywide information pages, search engines, and indexes. Use information generated by other units by linking to their pages.

Get the Right Look

Web design refers to the look of your website—the page structure, photos, illustrations, fonts, buttons, and other elements forming your website’s overall appearance. During planning stages, web designers often work closely with project managers and others on a website’s information architecture. Once a website is launched, designers are often involved in refining the design and adding images, photo galleries, and other features to new webpages and website sections.

Web design involves these tasks:

  • Creating graphic images, icons, and banners (banners are images/text across the top of the page)
  • Selecting and preparing photos and photo galleries
  • Choosing fonts and styles for headlines, text, and other elements
  • Deciding on a color palette for banners and other website elements
  • Arranging graphic and nongraphic elements on the page

Web Design and Rutgers

At Rutgers, websites for the university’s schools, colleges, departments, and other units have a variety of looks, depending on their needs and requirements. Some sites require a visually stunning photo on the homepage, while others demand a no-frills approach. Whatever your goals, you want to keep in mind why people will be visiting your website. Web users are always just a click away from leaving your site, and you don’t want to frustrate them with confusing icons or slow-loading animations.

Rutgers Visual Identity System

The Rutgers Visual Identity System strengthens the Rutgers identity and unites the university community under a consistent, coherent style. While you are welcome to custom-design websites, some basic requirements of the Rutgers Visual Identity System apply:

  • The Rutgers logotype must appear on the top left corner of all Rutgers webpages
  • Each website must contain a link to search Rutgers at search.rutgers.edu
  • Each website must contain a link to your campus homepage or the universitywide homepage
  • Each website must include the phrase “Rutgers, The State University of New Jersey”

Web Design Training and Resources

Web design is a broad field touching on a number of different skills and technologies. Look to these sources for training.

If your position at Rutgers includes regular communications projects, you should strongly consider signing up for the university’s Communicator Certificate Program. A sampling of courses relevant to web design includes:

  • “Communicating with Video”
  • “Design Basics”
  • “Electronic Communications”
  • “Photography Basics”
  • “Writing and Design for the Web”

Courses to learn how to develop websites are offered periodically.

Workshops on Dreamweaver, Photoshop, and other web-related topics are offered periodically.

Professional development workshops offered by University Human Resources can get you started with your web project.

Wireframe Components

Wireframes are basic line drawings showing the placement and position of information on a single webpage. As you develop your wireframe, keep in mind the components that make up a website.

Written Content: Banners (banners are images/text across the top of the page), introductory text, descriptions of majors, descriptions of research capabilities and labs, research reports, press releases, guides for students, archive, forms, directory, contact information, etc.
Multimedia Content: Photos, videos, podcasts, audio, etc.
Functions: Search, email alert signup, registration, databases, surveys, etc.
Navigation Tools: Multiple ways through site, such as menus, A to Z listing, search, site map, quick links
Context on Every Page: All pages should include homepage link, webmaster and/or feedback link, contact information or link