Welcome to the Acoustical Society of America’s design template for web sites. This demo site has hover “tooltips” which display descriptions for web page areas or elements that specify ASA’s requirements for branding when your cursor is placed above them. Please scroll down this page to get a feel for basic design and layout principles. Then hit the “HOME” or other links in the above navigation bar to see page examples. Simply swap your committee info into the existing pages or create your own designs within ASA’s guidelines. There are numerous video tutorials for various page layouts and the modules used to compose them. And the web office is available for any and all assistance.

Hero Image

This area is reserved for the main slider image(s), “hero section”  or  hero image.


Please reference this complete sample “home landing page” taken from  the ASA Student Council.

Committee Mission Statement

Committee Mission Statement should be detailed here.
e.g. “Acoustical Oceanography Technical Committee of the Acoustical Society of America is concerned with the development and use of acoustical techniques to measure and understand the physical, biological, geological and chemical parameters and processes of the sea.”  The current Committee Chair is Jahne Doe.


For the purposes of graphic design and substantive content placement, each website page is considered to have 4 primary regions. The top most region is referred to as the header, which will contain the site navigation.  The main content area is immediately below the header and  the right side bar is as it sounds, it’s in an area or region to the right-hand side of the page. Lastly, at the bottom of each page is the footer region.



Web guidelines require that the HEADER region consist of a primary navigation bar and a secondary navigation bar, which is located immediately above the primary navigation.

Both of these items are controlled within the Divi Customizer on the left hand side of the website dashboard control panel, once you are logged in as an administrator.

The secondary navigation bar must contain a contact phone number and email address for your specific committee.  This region will also contain links to social media accounts for the Acoustical Society that have been pre-set by the web development office.  The “1ur-phone” placeholder should display a contact phone number for your committee.  Likewise, the placeholder text “webhandler@yourcommittee.org” should display an email address specific to your group.  If there are no direct contact mechanisms for your committee, ASA contact links can be placed here with permission from HQ.  If you require a new email address for the business of your committee, simple request as many of them as you need from the Web Development Office.

Primary Navigation

The immediate left-hand margin of the navigation bar will contain the ASA logo and it will serve as the home link for that particular committee Web Site.

(Note that there was lengthy discussion about having this logo link back to acousticalsociety.org  but all beta testers found it very confusing to jump off of your committee site when intuitively trying to return to it’s homepage.  The goal of branding ASA web properties with a more flexible logo is being pursued)

The goal for the entire website and for every webpage is to have clean legible presentation of all text with plenty of white space to enhance readability.  As such, there should be no more than four or five top level navigation links on the site. Additional navigation items should be placed in drop-down menus or in a mega menu.

The suggested links for each committee page should be as follows: a HOME link which duplicates the icon link back to the main landing page,   ABOUT US which would typically describe the functionality of the committee,  MEETINGS which would contain calendars and information pertaining to that particular technical committee, student committee, or regional committee meetings and agendas. Another suggested link would be MEMBERS or MEMBERSHIP which would contain details of that particular group with their contact information.


Below the primary navigation bar the main content area should have a large hero image or slider containing a photo or photos that represent the work of that particular group. It is highly recommended that any call to action for that particular group be placed as a button link on that hero image.

The call to action could be a simple announcement for the next meeting, a request to join the committee or whatever work the committee is prioritizing at that time.

The area directly below the hero image will contain the main “body” content for that page.  The top one section should contain the committee’s mission statement, as detailed in the committee booklet at acousticalsociety.org.

Below the mission statement, the content area may contain whatever items the committee feels is most important to its viewership. The primary requirement is that the information be presented in a clean, corporate and “readable” manner.

The color palette and typefaces are predefined in the web site’s starter template and are branding requirements specified by ASA.


The FOOTER  region of the website is reserved for ASA use and the information there will be a predefined and included in the template so that each web handler will not have to affect change to it.  The footer region will contain contact information for ASA, our mission statement and other pertinent information which may change from time to time.


The optional sidebar region typically contains RSS feeds, terminology cloud tags, recent posts to your committee site, calendars or other information your group feels is visually important enough to be displayed on all or many pages.  See acoustics.org for an example.