I would like some assistance in designing a custom Image Gallery, but I don't know how to go about implementing it. Most of the tutorials that I have read online simply tell you how to assemble one together; they don't show the design process behind them, and how or why they chose a particular setup of HTML, CSS, etc. over another setup.
I was hoping someone would be willing to lend their expertise and experience to point me in the right direction.
I do know what features I would like to build into the application, but simply don't know how to go about implementing it.
I have drawn a layout to help me and hopefully others along the way get an idea from paper to browser.
Uploaded with ImageShack.com
This is the HTML I came up with to act as the structure.
So far, the CSS is just to show where the HTML elements are being placed.
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<link rel="stylesheet" href="css/galleryApp.css" />
<div id="content" class="clearfix">
<img src="res/sr1Hill.jpg" alt="Minecraft Road Image" />
<h4>S.R. 1 Original Alignment</h4>
<a href="#" class="prev">
<img src="res/prevDark.png" alt="Previous" />
<a href="#" class="next">
<img src="res/nextDark.png" alt="Next" />
<p>This is the original configuration of S.R. 1 in Bonaparte Land.</p>
<img src="res/sr1Hill_thumb.jpg" alt="thumb" />
border: 1px dotted #F00;
border: 1px dotted #0F0;
border: 1px dotted #00F;