![[logo] US EPA](http://www.epa.gov/epafiles/images/logo_epaseal.gif){kind=logo}
Maps
This page provides standard maps for use on Where You Live pages. To use a map:
- Download the HTML code for the appropriate map. Modify the link destinations in both the state selection table and the image map. Use the code provided because it includes required accessibility features.
- Use the correct map graphic file: if you have information for all areas of a map, don't download the map. Instead, use the image map code provided without modifying the <img> tag. It uses an absolute URL so that everyone uses the same map files, just as we all use the same EPA seal file.
If you lack information for certain map areas, download the PNG file and create your own maps with grayed-out areas.
- File formats
- US map split into EPA regions
- US map split into states
- Regional maps split into states
- Nonstandard maps
File formats
Each map is available in PNG and GIF, and is accompanied by an HTML file with standard image map code. All files were created using Macromedia Fireworks 4 (PNG are original files; GIF and HTML are created from PNG). They are editable in Fireworks or Photoshop.
Each map section below includes the relevant files and associated descriptions.
US map split into EPA regions
Features:
- 450 pixels wide x 340 pixels high
- One image map area per EPA Region, so blind people don't hear a given Region read twice (e.g., Alaska and R10 are in the same image map region, despite not being next to each other); alt text is region name followed by the region's full state names in alphabetical order
- The image map areas are in region number order, so they are heard in proper order through a screen reader
- The PNG file has one layer per type of information; each Region has its own group within each layer:
- image map areas
- state names and name boxes (e.g., NJ, DE, etc.)
- state shapes and boxes (e.g., AK, HI, etc.)
- regional markers
- grayed-out areas (to mark regions for which there is no information)
- The HTML code includes all relevant links:
- image map code, including alt text; set the href attribute for each image map area to the correct destination using relative URL
- a form to let people choose their state; set the value attribute of each selection option to the correct destination using absolute URL
Instructions for map areas for which there is no information available
Questions? Call or write Jeffrey Levy (levy.jeffrey@epa.gov; 202-564-9727).
Download Files
Use the PNG file only to create custom maps (for example, with grayed-out areas) and save them in GIF format. Don't use PNG files on the Web site itself.
US split into regions: HTML Code | editable PNG file (right click the link and select the save-as option from the resulting menu - when prompted, make sure the file name is us-regions.png)
The Adobe Illustrator file includes the entire US map, including states, regions, and the gray layer (right click the link and select the save-as option from the resulting menu - when prompted, make sure the file name is us-regions.ai)
US map split into states
Features:
- 450 pixels wide x 340 pixels high
- One image map area per state, so blind people don't hear multi-part states read twice (e.g., AK, HI, and MI); alt text is full state name
- The image map areas are in alphabetical order by state name (NOT by postal abbreviation), so they are heard in proper order through a screen reader
- The PNG file has one layer per type of information:
- image map areas
- state names & name boxes (e.g., NJ, DE, etc.)
- state shapes & boxes (e.g., AK, HI, etc.)
- grayed-out areas (to mark states for which there is no information)
Use the PNG files only to create custom maps as needed (e.g., with grayed-out areas) in GIF format. Do not use PNG files on the Web site itself.
- The HTML code includes all relevant links:
- image map code, including alt text; set the href attribute for each image map area to the correct destination using relative URL
- a form to let people choose their state; set the value attribute of each selection option to the correct destination using absolute URL
Instructions for map areas for which there is no information available
Questions? Call or write Jeffrey Levy (levy.jeffrey@epa.gov; 202-564-9727).
Download Files
Use the PNG file only to create custom maps (for example, with grayed-out areas) and save them in GIF format. Don't use PNG files on the Web site itself.
US split into states: HTML Code | editable PNG file (right click the link and select the save-as option from the resulting menu - when prompted, make sure the file name is us-states.png)
The Adobe Illustrator file includes the entire US map, including states, regions, and the gray layer (right click the link and select the save-as option from the resulting menu - when prompted, make sure the file name is us-regions.ai)
Regional maps split into states
Features:
- 131 pixels wide, height appropriate to region
- Each state has one image map area; alt text is full state name
- The image map areas are in alphabetical order by state, so they are heard in proper order through a screen reader
- The PNG file for each region has one layer per type of information:
- image map areas
- state names, shapes, & name boxes (e.g., NJ, DE, etc.)
- grayed-out areas (to mark states for which there is no information)
- The HTML code includes the image map with alt text; set the href attribute for each image map area to the correct destination using relative URL
Instructions for map areas for which there is no information available
Questions? Call or write Jeffrey Levy (levy.jeffrey@epa.gov; 202-564-9727).
Download Files
Use the PNG file only to create custom maps (for example, with grayed-out areas) and save them in GIF format. Don't use PNG files on the Web site itself.
- Region 1: HTML Code | editable PNG file
- Region 2: HTML Code | editable PNG file
- Region 3: HTML Code | editable PNG file
- Region 4: HTML Code | editable PNG file
- Region 5: HTML Code | editable PNG file
- Region 6: HTML Code | editable PNG file
- Region 7: HTML Code | editable PNG file
- Region 8: HTML Code | editable PNG file
- Region 9: HTML Code | editable PNG file
- Region 10: HTML Code | editable PNG file
(right click the PNG graphic link and select the save-as option from the resulting menu—when prompted, make sure the file name ends with .png)
Creating maps when there is no information for certain areas
When there is no content for a particular state or region, create a new map with that area grayed out:
- On this page (don't view the PNG file using the browser), right-click on the PNG link and choose to save the file.
- In Macromedia Fireworks or Adobe Photshop, open the PNG file.
- Check that the layer called "grayed out" is on.
- Within the "grayed out" layer, turn on the relevant shapes for areas with no information:
- US map split into regions: each region has a grayed-out area
- US map split into states, regional maps: each state has a grayed-out area
- Remove the image map area code for the grayed-out areas:
- Exporting only a GIF file: edit the exising HTML image map
- Exporting both GIF and HTML: turn off the relevant areas in the Web layer before exporting
- Export the new GIF file using the settings included in the file. If you are using Fireworks to produce HTML code in addition to the GIF file, choose that setting in the export dialogue box.
For help using the PNG files, or if you don't have Fireworks or Photoshop but need maps with grayed-out areas, contact Jeffrey Levy (levy.jeffrey@epa.gov; 202-564-9727).
Nonstandard maps
It will sometimes be appropriate to create maps that aren't full size or are otherwise different from the norm. For example, a small map might be needed.
In these cases, contact Jeffrey Levy (levy.jeffrey@epa.gov; 202-564-9727) about your requirements.
Note that the PNG files' layers make creating usable maps easier. For example, state names and regional icons will be illegible on a small map and can easily be turned off.