#  Use the Images Component for Galleries 

 



 ##  

  expand\_more  

 
  

 

The Images component is built for displaying multiple images in clean, responsive layouts. Using it ensures captions, stacking, and accessibility behave correctly.



 

##  Why it matters 

 



 

**Consistency:** Images display predictably across devices.

**Accessibility:** Captions and alt text fields are built in.

**Flexibility:** Choose layouts for stacking, grids, or inset displays.



 



      ![Cropping issues](/sites/g/files/omnuum631/files/styles/hwp_1_1__480x480/public/2025-12/images_5.png?itok=RRiMWhtU) 

 

 

  

 



 

 

 

##  How to do it 

- Use the **Images component** for galleries and collections.
- Pick layouts that stack well on small screens.
- Keep captions short to avoid overlays obscuring content.
- Use inset layout when you want alignment with page text.



 

##  Accessibility tip 

Mark decorative images as decorative so screen readers skip them.



 

##  Resources 

- [Images Component on the HarvardSites Drupal User Guide](https://drupal.harvardsites.harvard.edu/images)
- [Image Sizes on the HarvardSites Drupal User Guide](https://drupal.harvardsites.harvard.edu/resource/image-sizes)



 

 



 

 See also:- [ Images ](/how-guides-topics/images)
- [ Media ](/how-guides-topics/media)
- [ Performance ](/how-guides-topics/performance)
- [ How-To Guides ](/page-categories/how-guides)