Skip to Content

Organization and Layout for an LTER Web site using a Content Management System

Printer-friendly versionPrinter-friendly version
Issue: 
Spring 2012

Eda Melendez-Colom (LUQ)

Introduction

Web content structure: Giving some logical structure to content in a website is a way to facilitate the users’ browsing.  DRUPAL, an open source Content Management System (CMS), is being used by several LTER sites to manage and organize their websites.  DRUPAL stores information in a database (MYSQL). Each page, story, form or any other content (called a node) becomes a record or a series of linked records saved in one or more tables in the database. These systems usually assign long, incomprehensible URLs to any content by default. I could not follow the same method I used when organizing the old Luquillo’s (LUQ) website in the new design which reflects the website′s Menu items.

DRUPAL allows the developer to assign Aliases (customized URLs) to each type of content allowing the designer to give a logical structure to the content in the website. These new URLs do not necessarily reflect the path where the content lies in the file system (like in the DOS environment) but you can certainly use them to give an apparent logical structure to the website.

Web user interfaces: Websites are designed to help data discovery and to download information. Menus, as well as bars, are navigation-type user interfaces. They are one of the elements of the website that reflect its pages design and layout. In DRUPAL, tabs and panels can be also used to display the website content in addition to menus.

A user can browse through a web site by: (1) following a hierarchical menu that leads them to the wanted information; (2) clicking on links provided by pop-ups that eventually lead them to a wanted product or information, and (3) using a search engine that provides them with windows to enter or select keywords that produce lists of links to the information in the site.

Apparently, high tech organizations like to use hierarchical menus and bars placed at the top or left panels of the page. Many websites′ designs use this type of layout.

On the other hand, websites that are designed by or for younger users tend to use more panels and tags, and are often animated. Panels provide concurrent windows displayed in the same screen, each of which links to a specific set of products or information.

Terms:In my effort to organize and document the information in LUQ’s website, I encountered the difficulty of trying to use the correct terms to describe the objects, functions or processes. When using “Webopidia(1)” to look for the correct definitions, I realized that terms like “directory” have different meaning to what they used to have in a DOS system. Main Menu, and other more recent ones like “search engine”, have different subtle meanings for different communities. Therefore, I inevitably must define beforehand the terms I will be using to avoid some confusion. Box 1 serves this purpose.

Box 1. Definitions of terms used in this article
  • Directory - a Unix/DOS path that leads to a location of a document or another directory i.e., a (subdirectory). (Example: C:\luqweb\data\luqmetadata87)
  • File system - a Unix/DOS-like hierarchy of folders or directories
  • Search engine - "A program that searches documents for specified keywords and return a list of the documents where the keywords were found".(2)
  • Main Menu - A list of links that is displayed at the top of all pages. The menu items display labels that refer to the type of content contained in the submenu or web page they refer to.

Structure for an LTER Web Site

LTER web sites purpose: An LTER web site’s main purpose is to share information with the scientific community and public in general. We also want to foster collaboration and scientific synthesis. These activities are mainly facilitated by the completeness of the metadata in the web site and the way we organize it. Web Design guidelines (3) have been developed by the Information Managers Committee (IMC) to facilitate this (4).

Content Management Systems like DRUPAL provide content types, Views and Themes that allow us to organize content and design web sites that interconnect all types of metadata attributes and information. We organize the metadata using several content types which in turn, are closely related to our EML standards. The navigation and design and layout of our sites should make it easier for the user to find the information they want.

When looking for scientific data, users usually have a specific kind or type in mind. A menu with a structure should help the focused user to find what they want faster. In addition, search engines should allow them to narrow the list of possible links to select from. Navigation is related to structure. It is a way to use menus and DRUPAL’s nodes to give DRUPAL websites a virtual classical file system structure. If we give a URL path to our documents in our websites and are consistent with the path we choose, not only will this give some "structure" to the site but it will also be easier to upload and find documents in it.

Methods. Every document's URL path could identify its type by using the structure given to the web site through the Main menu and a submenu item. The menu, submenu and the document’s title (node’s Title, Subject, Name, etc) should be given a label that describes their content. For example, all data sets in the LUQ website have been given the path /data/luqmetadata#, where # is the catalog number assigned to the data set when it is incorporated into the LUQ IM system. The catalog page that lists all the LUQ data sets has the path /data/datacatalog and the main menu item leading to it is called DATA.

Figure 1 contains the screenshot of LUQ present structure. The DATA menu item is being displayed on the screen; the other 6 menu items are shown as well.

Figure 1. Current LUQ DATA screen and other Main menu. (Click on image to link to LUQ original image page)

LUQ Data Page Displaying the LUQ Data Sets Catalog

The website as an archive.  It is important for LTER websites to serve the community as a place where people can find old as well as current information.

The challenges presented are that our websites become very dense and designing a layout that allows users to find all the additional documents that cannot be displayed in the website Home Page. The task for maintaining such a website is huge and would need a permanent webmaster hired in each of our LTER sites. Since this is not plausible in most of our sites, we need to find solutions with the resources that we actually have. Box 2 contains suggestions that might help us meet these challenges.

Box 2. Suggestions for designing user-friendly websites
  • Have a group of users (preferably students and scientists of the site) help develop useful Menus with meaningful labels
  • Develop pages (or sub-sites) pertaining to specific groups from your community so they eventually can edit their content with limited users privileges
  • Develop a public page holding the old news from the site that will serve as a historic reference at any time.
  • The menu, tags, and panels accompanied by effective search engines can help
    the user find information they are looking for in a friendly manner.


How:
Main menu items with submenus can be used to lead the user to all the principal types of information in a website. In Drupal, other navigational features can be used in addition to the Main menu (″Primary links″). Secondary menu (″Secondary links″), Navigation menu and boxes that are associated with specific paths can be used in different ways to display content in all or selected pages of the website. For example, a box containing user agreements and a disclaimer from the site can be displayed in any page listing data sets. Figure 1 displays this box in the right panel of the screen.

Search engines in pages displaying specific types of content assist the users to find specific kinds of information. Along with the assignment of meaningful keywords, search engines may help the user discover information that are deeper in the hierarchy of the Menu system or displayed by subsequent pages. Figure 1 also displays the use of search engines.

Final suggestions: As we create content in the websites we should be aware under which menu item we want our documents to be located and what content type we want them to belong to. The later is a somewhat complex concept in the DRUPAL environment, but when creating content, is better to choose first the menu/submenu you want the new content to have as parents and then choose a good label that shortly describe its content.

We should select a set of menu items, along with their submenu sets, that clearly and completely contain all the information we are holding in the site.  News, calendars special global links and Help/FAQ links could appear in panels or blocks that could be set to appear in specific web pages or sections of the web site.

The sites should reflect the consensus that IM workgroups (5) have developed for the IMC. These agreements should be documented in the work groups’ final Terms of References (ToR), reports and guidelines.

The LUQ Drupal Web site has been designed to follow these guidelines to the extent that it has been possible. Constant revision is necessary to make sure that the guidelines are followed.

References and Notes

(1) Webopedia is an online “encyclopedia” of web terms. (http://www.webopedia.com/ )

(2) Web Site: Web Developers Notes. Article’s Title: “Understanding the importance of web site navigation: What is web site navigation?” Year: 2001-2010. Navigation:  Web development tips and tricks/Web design tips and tricks.  Article’s URL: http://www.webdevelopersnotes.com/tips/webdesign/web_site_navigation.php3

(3) Web Site: IMC Web site. Article’s Title: “Guidelines for LTER Web Site Design and Content”. Year: 2007. Navigation:  IM Guide/LTER IM Guidelines/.  Article’s URL:  http://intranet.lternet.edu/im/im_requirements/webdesign_guidelines

(4) The main goal in preparing the “Guidelines for LTER Web Site Design and Content” was to make sure that all sites web sites’ content provide their information in an efficient manner such that users could get to the data in no more than three to five clicks. It was intended to foster the appearance of a Network of LTER sites. That is, using the terms defined in this article, we want to make sure that the navigation provided in our web sites allow the user to get to the information they are looking for in no more than five clicks and to find a design and layout that will give the user the awareness of being on an LTER Network’s web site. The later has been achieved at the Network level using siteDB as the common framework that allows us to present all US LTER sites basic information using a standard layout.  ( http://www.lternet.edu/sites/ )

(5) Workgroups that have worked and/or are currently working with web standard issues and the way the IM Committee make decisions and govern are: Web designers group, Web guidelines group, and Governance Work Group (GWG).