Les Mitch's profile

Barony of Western Seas Website | 2014 - 2016

Barony of Western Seas Website | 2014-2016

The old website hadn't been updated or maintained in several years when I volunteered to takeover. The entire site structure was disorganized, built in static HTML with no consistency.  This included a branding campaign to help the general public identify with the group and to know from this branding what the group is.

Structure
HTML/CSS
Java script

Features and Requirements:  
- Google calendar with local events displayed in Hawaiian Standard Time
- Modern and Responsive display of all content (desktop to tablet to smartphone)
- Documented and commented where necessary (inline as well as in text files on server)
- Use of a javascript to prevent the auto-scraping of email addresses (nobots.js)
- List of officers for the local chapter
- W3C and ADA compliant
- Hosting and links to for the chapter's digital newsletter, the Runestone

Branding
- Incorporate a "medieval feel" to the name of the organization
- Include the use of the coat of arms of the Barony of Western Seas
- Make mention of the Kingdom and Society
- Give an overall professional, yet comfortable feel to the website - a welcoming atmosphere
The front page slider with overlying text that displays with roll-over state is pure CSS and coded to disappear when the window width falls below 800px.
Responsive Layout from wide-screen to narrow-view.
Another CSS with Rollover display is the Canton Map. Each sub-group of Western Seas (a canton) appears with a rollover of the mapped area which is also an active link to an external landing page for said canton.

The map would disappear and a list of links for each canton would appear on smaller screen displays (smartphones, smaller tablets, etc.).
The front page would be updated as needed with statically written news bit and events.

Barony of Western Seas Website | 2014 - 2016
Published:

Owner

Barony of Western Seas Website | 2014 - 2016

Pure HTML/CSS with a nobots javascript for the Barony of Western Seas. Responsive design from wide screen to smartphone display.

Published: