Resources

In the process of making this site, I have written about the particular elements I have chosen to use on the beready site. It really seems important however to document these choices in a more formal fashion.

Collapse

The first element that I will mention is the jQuery-Collapse element that I am using the <nav> and <content> areas of the site.  The jquery that I chose was developed by Daniel Stocks.  The reason I chose to use this jquery is it's progressive perspective on accessibility.

Progressive Disclosure

This Plugin delivers an accessible and lightweight solution to a widely adopted interface pattern (known as progressive disclosure). It includes features like cookie persistence, ARIA compliance, and is designed to be flexible and modular enough to be used in many different't scenarios.

I have used this collapse in the past, almost by accident. But in my research and effort to make the Be Ready site as accessible to as people as possible, the jQuery-Collapse really seemed to be the best solution.

Something that seems important to point out that it is very easy to control what portions of the site are expanded and collapsed by default when someone visits the site.

To have declare whether a particular element is in the expanded state or not, you only have to give the element a class="active".

Media Gallery

This was a structural element that took a lot of trial and error. Some particular methods would seem to work out for a while but then I would try to get a gallery to do something specific and I either couldn't get the gallery to function properly or it didn't have the capability to do what I was asking it to. The javascript gallery I chose to implement is FlexSlider developed by Tyler Smith. My decision was also based on accesibility and it's ease of use. It has touch capability and has a very extremely responsive apporach to a gallery.  Right now I am not using the responsive function, but I plan to so I wanted to find a gallery solution that would accommodate this desire.

News Ticker

This was a rather late decision in the development. It was suggested that I include some news items on the front page of the site. I went looking around and I found this one. The styling of this solution was a bit tricky but in the end I think it is a succesful solution for presenting news items on a site.

Bar Graph

I think I stumbled on this solution, a solution for a problem that I didn't have at the time, but i thought it would look great and present a another opportunity to learn how to implement some jQuery on the Be Ready site. 

This solution did present a problem in the styling of the elements. Eventually I got it to work.  I think part of the success in getting it to style like I wanted I think also had something to do with leaving it alone and not using it for a couple months, gaining more understanding of coding and development.  When I came back to this element and decided to use it again I had a greater understanding of how to get things to do what I wanted or needed them to do.

html5

Something that is important to mention is that, besides html5 being a much better way to structure the elements on a site, many of these solutions work best when using html5 markup.  A good example of this the the <video> element.I didn't have to go out and find a jQuery solution for this because the html5 method of implementing a video on any particular portion of a site is already very progressive and easy to use.

To Be Continued...

Video Element

While a endeavor to place more and more content on the Be Ready site I have found a helpful site that compares all the html 5 video players.

Almost There!

So quite a few all nighters later, The Red Cross Site is almost done.  I have been adding content non-stop for last few days.

Things that need to be address:

- More images for several of the pages

-alternative content options for the asides on some of the pages

-the "about" section still needs to be populated with content

last but not least! media queries, once and  for all.  I want this site to look wonderful on any browser window size and any device screen size regardless of screen orientation.

Wow!

Media Queries...ugh

Something about working with media queries makes a great portion of the day feel like a highly unproductive waste of time.....that is, when you can't get them to work properly.

Restructuring for Accessibility's Sake

So, it is always takes a bit of daring attitude to completely restructure a site semantically.  Why would I do this?  I am striving to make this site ULTRA accessible and "future-proof".  So this requires constantly checking to see if I have structured my <nav> elements correctly and content section appropriately.

It is SO tedious.  It is also worth all the effort if I come away with a better understanding of semantic structures and the thinking behind the standards.