If You Build It ...

In 2005 Jennifer Nyborg decided she wanted to build a Web site for her lab at Colorado State University. She needed to decide what information to include, how to organize and present it, and whether she wanted special effects such as animations or interactive content. The project seemed daunting at first. "I had no idea what it should look like," says Nyborg. She probably wouldn't have even created a Web site at all, she says, if Matthew Lewis, one of her graduate students, hadn't offered his help. https://cdn.the-scientist.com/https://cdn.the-scientist.com/assets/image_not_found.jpg Two science web-sites deconstructed no https://cdn.the-scientist.com/https://cdn.the-scientist.com/assets/image_not_found.jpg LaWVA Winners no /finalist/index/ LaWVA Finalists no /nomination/display/1/1/ LaWVA Nominations no Lewis is particularly Web-savvy and has an excellent eye for design. He created most of the site's layout and imagery, and managed all the back-end tasks such as registering the domain, coding the HTML, and uploading the content. "It would have been a lot more difficult if he hadn't been in my lab," says Nyborg. The Nyborg and Lewis collaboration paid off: Their site (www.nyborglab.com) ranked at the top of The Scientist's Laboratory Web and Video Awards (LaWVA) last November. The LaWVA judges called the site "very professionally done" and "easy to navigate." "Within the first ten seconds, someone is going to instinctively make a gut call on whether they trust you, based on [your sites'] aesthetics." -Todd Miller Not every principal investigator, however, will have a resident Web expert at his or her disposal. Here are tips from the designers of the winning Web sites and from our panel of expert LaWVA judges to help you design and build the best laboratory Web site: 1. Know Your Audience "You need to know your audience and you need to know your audience well," says Todd Miller, a media designer and LaWVA judge. Nyborg built her site to represent her lab to other scientists and to attract postdoctoral candidates. Other sites target different audiences (e.g., scientists, funders, the general public), and each audience requires a different strategy. Lab sites "are like the Facebook of science," she says. "It's a form of advertisement." Once you've determined who your audience will be, find representatives of that audience and ask them what they would expect from your site, where they would expect to find it, and how they would use your site. This step is important in helping you to plan what to include and how to present it. 2. Keep It Simple "Start very simple and build up from there," says Philip Dash, a former postdoc and Web designer of Judith Cartwright, of St. George's University of London (a LaWVA finalist). Web site-building software offers many bells and whistles such as movies, voice files, and accordion menus, but it's best to start with a site that will be simple to maintain and update. On Nyborg's site, for example, Lewis originally incorporated a comment page for guests. It seemed like a fun extra feature, but spammers quickly beleaguered Lewis with nonsense. Lewis streamlined, creating an easily navigable structure with the essentials for researchers: an introduction to the lab, publications, contact information, links to the parent organization and to related research, and information about the lab's members. One trick Lewis used to create the site's appealing aesthetic consisted of separating the content from the navigation bar, and from the header, with straight lines rather than boxes. Using a two-color, red-and-black scheme also helped to highlight the color photographs. "Some people use a whole lot of color, and their pictures get lost in that," says Lewis. 3. For Postdocs, Highlight the Guidelines Paula Aracena, a postdoc at the Baylor College of Medicine, says that laboratories or departments that have online guidelines for postdocs are much more appealing than those that don't. Department Web sites should have "a sort of survival guide for postdocs," she says. "It shows they're attentive to what you're doing and interested in your development." A lab Web site geared towards postdocs also allows potential fellows to learn about the lab culture and its alumni. It's valuable to see where alumni go when they complete their fellowships; it helps to gauge one's own potential future, says Vishal Soni, a postdoc at Harvard Medical School. 4. For the General Public, Use Interactivity The Tagging of Pacific Predators (TOPP) site (www.topp.org), another LaWVA finalist, aims to reach the general public and educate visitors of all backgrounds. It features an interactive map, a blog written by journalists and scientists, an "ask a researcher" feature, and other content that frequently updates and informs. It packs much interactive content on the front page, whereas a research or "brochure" site like Nyborg's does not necessarily need to present all its content up front. 5. Nothing Farther Than Two Clicks Sites that intend to provide services such as tools or databases to researchers must make that service readily available to viewers. The TOPP site, in addition to serving the public, provides live data and a publications list to researchers, which they can easily find by clicking "TOPP Data" on the home page. The Oliver Fiehn site at the University of California Davis (http://fiehnlab.ucdavis.edu), on the other hand, provides tools such as a mass spectrometry data filter, but viewers cannot find it easily: They must click on names of lab members to uncover the program, which is not intuitive. "It's a well-used site, but if you don't know why you're there, it's hard to find what you need," says Lewis. 6. Pay Attention to Aesthetics "Within the first ten seconds," says Miller, "someone is going to instinctively make a gut call on whether they trust you, based on those aesthetics." Brian Leander of the University of British Columbia says: "If it's amateurish or pieced together in a funky way, it reflects on how [scientists] conduct their lab. It's not necessarily true, but it's a knee-jerk reaction." 7. Organize Your Site by Topic Even if your site does not provide resources for colleagues, visitors must be able to find your content instinctively and easily. "The larger the organization, the more important it is to be topic-based - or at least provide topical navigation to the subject," says Richard Stapleton, the national Web content manager for the Department of Health and Human Services. He suggests that larger institutions should use government Web sites as a model. For example, someone looking for information on tuberculosis from the Department of Health and Human Services does not want to visit its agencies separately (NIH, CDC, NIAID, etc.). People on the Web read 50% slower and overall they take in 25% less information than on printed pages. A lab Web site is text-driven, so readability is key. Individual labs can capitalize on their institution's good organization schemes by ensuring that the institution includes a link to the researcher's site in every relevant page. Nyborg's site, for example, uses an address that's independent of Colorado State University to get higher placement on search engines, but she made sure her department appropriately linked to her page. 8. Make It Readable and Printable "People on the Web read 50% slower and overall they take in 25% less information," than on printed pages says Miller. "A lab Web site is text-driven, so that readability is key." Text should appear in simple colors (e.g., avoid red text on a neon green background) and a simple font 12 points or larger. Miller says sans serif fonts such as Arial or Verdana are easier to read online, whereas fonts such as New Times Roman or Garamond should be avoided for large portions of text. Since labs present long and dense information, this content should be broken up into sections and easy to print, adds Stapleton. "People are very unlikely to read it on the screen," he says. 9. Find a Guinea Pig In usability testing, Stapleton finds test subjects (seven or eight people will suffice) and watches them navigate the site. He also gives them a task, such as finding a specific paper or answering a question about a lab member, and tests their ease in accomplishing it. If they can't complete the task quickly, then the site's organization needs to be changed. Miller uses another technique that involves creating fake user personas based on the interviews he conducts with members of the target audience. "When you're making architectural decisions," he says, the last thing you need is opinions about color preferences and irrelevant features. He creates five different personalities of representative users - including students, colleagues, or investors - and for every feature, he asks himself whether each of the hypothetical users would enjoy it or find it useful. 10. Keep Costs Low Many of the LaWVA finalists, including Nyborg and Cartwright, enlisted Web-savvy postdocs to create their sites, as did Angus Lamond of the University of Dundee (www.lamondlab.com, created by Laura Trinkle-Mulcahy). Others, like Kay Schneitz of the University of Basel (http://plantdev.bio.wzw.tum.de), learned how to build a site using some of the resources listed at the end of this article. If you are looking for a professional Web designer, however, you should browse other laboratory Web sites that you admire. The opening page usually has a copyright or a credit at the bottom, indicating the site's designer. If the site doesn't identify the designer, contact the principal investigator. Before committing to a designer, ask for cost estimates and preliminary concepts. Designers will charge either an hourly rate (usually $50/hr or more) or a flat fee for the project based on the complexity of the site. Costs Across Site Types Type of Site Example Annual Cost Maintenance Frequency Lab "brochure" www.nyborglab.com $0 to $500: software, domain, designer Quarterly Interactive lab http://fiehnlab.ucdavis.edu $50,000: UC-Davis database programmer (5% of time spent on Fiehn lab) Daily, multiple sources Collaborative multimedia http://topp.org $170,000: staff reporter, staff designer, freelance budget, software Daily, multiple sources Resources www.webmonkey.com Provides how-to libraries and quick reference guides on many web-related topics including site design, multimedia, programming, authoring and more. www.htmlgoodies.com HTML Goodies sports over 700 tutorials on how to properly use html and create graphics. www.w3.org The World Wide Web Consortium (W3C) develops interoperable technologies (specifications, guidelines, software, and tools) and is a forum for information, commerce, communication, and collective understanding. Check out our web extra for an analysis of two Web sites and read about the winners of our Laboratory Web Site and Video Awards at www.the-scientist.com/finalist/index.

If You Build It ...

Become a Member of

Meet the Author

Jonathan Scheff

Published In

March 2008

Related Research Resources

Why Do Some People Get Drunk Faster Than Others?

Research Resources

Podcasts

Webinars

Videos

Infographics

eBooks

Sex Differences in Neurological Research

New Frontiers in Vaccine Development

New Approaches for Decoding Cancer at the Single-Cell Level

Organoids as a Tool for Tissue Regeneration Research

Products

Product News

Sapient Partners with Alamar Biosciences to Extend Targeted Proteomics Services Using NULISA™ Assays for Cytokines, Chemokines, and Inflammatory Mediators

Bio-Rad Extends Range of Vericheck ddPCR Empty-Full Capsid Kits to Optimize AAV Vector Characterization

Leveraging PCR for Rapid Sterility Testing

Understanding the Nuts and Bolts of qPCR Assay Controls