Sarah Meyers

Sarah Meyers’production of The Magic Flute

Sarah Meyers

Design / HTML, CSS, jQuery

Sarah Meyers is an opera director out of New York City.

Sarah Meyers’ logo
Sarah Meyers’ productions page
Sarah Meyers’ resume and bio page
Sarah Meyers’ home page

“I am thrilled with the site that James Web Development created for me. Designer Barry Horbal was a pleasure to work with — he listened to my needs and requests, and really understood what I was trying to achieve. He thoughtfully created a site that elegantly represents who I am as a director, and brilliantly showcases my work. I highly recommend him!”

Sarah Meyers

The Beginning

Sarah Meyers is an opera director based out of New York City who has directed many productions around the country, including at the Metropolitan Opera in New York City. She was referred by a client whose website I designed in 2004. I was happy to find out that Sarah felt the design of this website still held up today, and was impressed with my work. She wanted a website to use as an online portfolio of her directing work.

The Design

Since this website is Sarah’s online portfolio, we tended towards less text and more photos of her productions. I wanted the photos to be prominent, large, and pull the eye toward her wonderful work. We were able to use some of her production photos as the background of the header on each page, further showing off her productions.

The color palette was kept simple: black, white, and gray, with a splash of blue that I found in one of the photos of her productions. I find that a dark background contrasts well with photo-heavy websites. The font is a simple sans-serif that is easy to read and pleasing to the eye. In it’s simplicity, the website keeps the focus on her work, which is where the focus should be!

The Layout

I laid out the elements of each page using a home-brewed grid system. This grid is responsive, and changes the layout of the page depending on the size of your screen.

Mobile View of Sarah Meyers
Tablet View of Sarah Meyers
Desktop View of Sarah Meyers

The Code

Warning: Techy stuff to follow.

The layout was done with good ‘ol HTML and CSS. There’s also a little jQuery thrown in to make the galleries work properly.

Okay: That’s the end of the techy stuff.

The Results

Sarah Meyers »