Tech Specs

Tech Spechs: Tech Spechs is a technical explanation of how this site was developed.

Previous Site: The 116th PVI had maintained a website attached to Haunted Field Music, the music of David Kincaid. Although a large amount of work had gone into the development of the site, it had been unattended since 2004. A new site needed to be developed that would provide information and photo sharing to the members as well as to serve as a recruitment tool to attract new members.

Inspiration: The inspiration for the site was to emmulate the style of the old site while featuring a design to stand out against "cookie-cutter" sites. The user experience demanded a wealth of information that could be updated to attract return visitors, displayed in a user-friendly design. The starting point was to convert the existing histories which would serve as the site's foundation.

History Section: The developer had to translate the AOL Wordpress history pages into html5 with CSS3 styling. These "History" pages consisted of (1) The Reenacting Unit, (2) The Actual 116th Regiment, (3) The Irish Brigade, and (4) Captain Samuel Taggart. Although the developer experimented with fluid design, the large amount of text required a fixed-width, center-aligned design for easy reading. And to alleviate a large amount of scrolling and to identify the length of the articles, a JQuery snippet was used to create pages with an inclusive navigation bar at the top of each page allowing the user to know where they were within the article. The tiled backgrounds were used to frame the solid color text background for design purposes.

News Section: After completing the "History" pages which are static in design, the "News" pages were designed to add a kinetic appeal and to provide up-to-date information. These pages developed into three categories: (1) "Dispatches" or newsletters, which consisted of a library of the past 10 years which will grow with every newsletter produced, (2) "Campaigns" or schedule, and (3) an "Image Gallery" by event. The "Dispatches" were scanned in as GIFS linked to full-size JPEGS that can also be increased in size to easily read or print out. The "Campaigns" page descibes the scheduled events with links to corresponding websites. And the "Image Gallery" links to photos of each event, a separate category for tintypes, ambrotypes, and CDVs, as well as three decades of archives. "Photobox" was selected as the best provider of photos. It allows for selection from thumbnails, resizing during viewing, and copying printable photos from the slideshows.

Index or Home Page: The "Index" or home page is another source of news that can change on a minute by minute basis as well as attract user interation. The right column is used for links to articles and Youtube videos that pertain to the unit or its members. The center column serves as a welcome summary of history, resume of members, and an ivitation to join. Silouettes of the officers, NCOs and members adorn all three columns to serve as recognition of significant members and as examples of uniform details. These images were created in Photoshop and Gimp. A certain number of the event images were also edited to eliminate modern features such as vehicles, electric lines or tourists. An added feature is the scroll bar that appears "above-the-fold" with the latest announcements of website changes and additions, significant anniversaries in our history, and announcements of interest to the membership.

Reference Section: The "Reference" pages are a resource of articles about creating an accurate impression. This is a reminder to older members, a guide to new members, and a preview for perspective members. This area will be expanded into Sutler Recommendations with links and the addition of more articles pertaining to accurate impressions.

Links Section: The "Links" page contains internal links of members that supply uniform parts as well as museums and sites that provide research information. When the site goes live, the internal links will host their own site with links to the 116th.

Did You Miss? Section: The final "Did you miss?" section contains pages that are linked from less obvious methods such as images. The "Corps Badge" page is linked form the red 2nd Corps Badge on the home page and the "116th Gettysburg Monument" page is linked from an image on the regimental history page. And finally this "Tech Spechs" page.

Drop Down Menu Bar: The drop-down menu bar was used for navigation due to its simple profile and framing of the index page below the masthead of the unit's newsletter which floats atop every page. It had started out as an expanding menu by hovering over a key, but that was determined to not be user friendly.

Mobile Site: Users who try to access the desktop site from a mobile phone are automatically redirected to the mobile site which uses musket cartridges as buttons to link to pages within a single page of the website, using JQuery to hide all pages but the one clicked.

Welcome Page: The "Welcome" page divides the index page into a brief history, talented members, and join. The user clicks to read more of any of the selections.

History Page: The "History" page links to a one page summary for each history, notifying them how long the entire article is and advising them that this is best viewed on the desktop site. The user may access the history and scroll as they read or return to the history menu.

News Page: The "News" page links to Campaigns, Last Dispatch, and Media. The "Campaigns" page links to a summary page of links to one page for each event for specifics about that event. The "Last Dispatch" page displays JPEGS of the latest newsletter. And the "Media" page displays links to articles, Youtube videos, and links to buying members' books.

Links Page: The last page is a set of "Links" to other pages that may be of use or interest. One feature built into the mobile site is the change in format and banner image going from portrait to landscape which is accomplished with CSS3.

Hidden Pages: The Corps Badge page is linked from the red corps badge on the index page at the bottom. The 116th Monument page is linked from the image in the regimental history.