I'm working on some pages for my site redesign that I'm doing with RSD. Specifically need to know if my design is functioning well or not. I've done two different techniques to test things out, and I have two separate test pages to illustrate the techniques. Here are the pages in question . . .

http://brosepianoservice.com/testimonials-figures.html

This first test page has Visual Lightbox to display photos. Next to the photos is a scrolling text box. I made them scrolling to make easier to lay out the page and keep things even. Two questions: are the photos working well on telephone size devices? On the pseudo testing I've done, the pop up photos are sometimes smaller than the thumbnails! Also, on the scrolling test boxes, are they easy or difficult to navigate on telephone size devices?

Here's the page with the other techniques . . .

http://brosepianoservice.com/testimonials-kits.html

This second page uses a different type of responsive lightbox for the photos. The text below the photos (where it says 'Comments') if you click on that, a modal text box will pop up. So a different set up than the scrolling text boxes on the first page. Questions: Are the lightbox photos working well? Easy to navigate? Also, on the modal text boxes that pop up, they can ONLY be closed with the 'click to close button' (will not close with hitting 'Escape' or clicking outside the box). Is that acceptable, or should I be looking for a different modal text box?

Please let me know which page set up you like better. Or if you like the lightbox on one page better and the text box better on the other page, let me know that.

Thanks in advance for any input you can give on these designs. I want to get my website done, but I don't want to proceed with a design that's not going to work for those viewing the site (whether on desktop, tablet or phone).

I would like the page with scrolling boxes if it didn't have scrolling boxes.

Thanks Eric! Yeah, I'm not wild about the scrolling boxes either. Maybe some kind of responsive 'accordion' could work in its place and be a better choice. Just trying to keep the pages orderly as the 'comments' are all different lengths. And I'd rather not trim the comments.

Thanks for taking a look!

I think the images with the text boxes next to them is more obvious for your visitors, so you won't need the instruction paragraph you have on the other page.
I would go with an accordian for the text. Scroll bars on phones are really awkward. On the shorter testimonials, you won't need a scroll or an accordian. You could also save a bit of space by dropping the font size from 18px to 16px.

The other thing you could do is put everything in a responsive carousel that scrolls horizontally across the page.
http://owlgraphic.com/owlcarousel/
Each slide could have the photo as is and the full testimonial displayed next to it. You have the option to display one slide at a time, which would work well for your page.

Hey Paintbrush, thanks! That's exactly what I needed to know about scroll bars being difficult on phones.

I'm looking into the accordion. I like that approach as it keeps the page tidy when you get down to smaller screen sizes. I just have found a good one that is easy to implement as of yet.

I'm taking a look at the responsive carousel as well. Thanks for that idea and link!

In the interim, I made a change to the page that had the word 'Comments' to click. I made a small graphic that says, 'Click' for Comments. That makes it very obvious what they are supposed to do to get to the testimonials comments.

http://brosepianoservice.com/testimonials-kits.html

You may have to refresh the browser to see that change. And I also found a code for the pop up text that will allow closing it with 'Escape', clicking outside the text box, or using the 'X' at the top right corner of the overlay.

Thanks again Paintbrush for taking a look and the suggestions!