The site that you linked to simply has a list of the images for the gallery plus a couple of other lines ie.
<div class="demo">
<div id="main_image"></div>
<ul class="gallery_demo_unstyled">
<li><img src="img/flowing-rock.jpg" alt="Flowing Rock" title="Flowing Rock Caption"></li>
<li><img src="img/stones.jpg" alt="Stones" title="Stones - from Apple images"></li>
<li class="active"><img src="img/grass-blades.jpg" alt="Grass Blades" title="Apple nature desktop images"></li>
<li><img src="img/ladybug.jpg" alt="Ladybug" title="Ut rutrum, lectus eu pulvinar elementum, lacus urna vestibulum ipsum"></li>
<li><img src="img/lightning.jpg" alt="Lightning" title="Black & White"></li>
<li><img src="img/lotus.jpg" alt="Lotus" title="Fusce quam mi, sagittis nec, adipiscing at, sodales quis"></li>
<li><img src="img/mojave.jpg" alt="Mojave" title="Suspendisse volutpat posuere dui. Suspendisse sit amet lorem et risus faucibus pellentesque."></li>
<li><img src="img/pier.jpg" alt="Pier" title="Proin erat nisi"></li>
<li><img src="img/sea-mist.jpg" alt="Sea Mist" title="Caption text from title"></li>
</ul>
<p class="nav"><a href="#" onclick="$.galleria.prev(); return false;">« previous</a> | <a href="#" onclick="$.galleria.next(); return false;">next »</a></p>
</div>
So you could create a page template with part of this code already in and then just build the list in your content area.
However, by the sounds of things, if you don't understand what a list is then trying to do this manually just wouldn't be a good idea for you.
Also, in response to your last comment. The page you've linked to above just links to large images and uses height and width attributes to make the thumbnails. So if your site is slow to load 3-5 images on a page then it'd going to grind to a halt with 1 large image and 10 large images resized via HTML.
It may look pretty but it doesn't seem to be an efficient method in my opinion.