Responsive Design Unconference Session: Friday 9-10:15 a.m.
Introductions
Richard Green
Chris Awre
Elysa Cozine
Michael Tribone
Jack Read
Gary Geisler
Jessie Keck
Mark Notess
David Trujillo
Brian McBride
Core Dump of Notes and Thoughts
- Want to make sure - experiences, pain points, etc. with Blacklight; gleaned a lot from Simon at Hull; areas of improvement to bring back
- Basic question; How does it work on mobile phone, how does it work if you have vision problems and accessibility issues
- the UI can respond based on any screen width; viewport breakpoints and rules
- landscape versus portrait and the user experience
- Bootstrap gives you the viewports and breakpoints
- 1024x768 brings us back, we're all used to big monitors, showing your web site in a live demo on a projector
- Sign in is hidden in Avalon when it goes that low and the hot dog menu
- Use CSS to make adjustments to cater for mobile phones; you can instead show menu bar under the header and expose login
- Specify different list in the nav bar and state the type of desired display
- Prominence and visibility of controls and UI; it can be an afterthought sometimes and the work involved
- The problem of different browsers and display and how the CSS has been written
- Chrome has left webkit
- Bootstrap makes the work a whole lot easier for developers
- Lots of white space in design and be able to use their fingers to select controls
- Does the group actually test on actual devices
- Simulators and Xcode; android devices and profiles
- Do more testing on actual devices
- We seeing 80 columns and x number of rows
- Tool for people that have to use it all day long; what is it like for them and their daily job activities
- The point about scrolling and how some people comment on the amount of it and the use of white space
- Some groups of individuals who have to use it on a regular basis and the amount of scrolling to add metadata
- If you use it all day you probably aren't on a mobile device
- Kinda like the Finder and Windows Explorer
- Different views
- Break work up into individual screens and not scroll down
- FRDA example; images will resize based on screen size; some items will drop; focus on the interactive boxes; like how the facets roll up
- Make decisions based on font sizes and screen sizes
- How is Hydra or Blacklight handling jQuery touch events; Hydra doesn't have an interface; Blacklight is the interface; not doing anything with jQuery touch events; don't have a hover state for touch events on certain devices; toggle open and close; hover states and not obvious that things are clickable
- Building interactive mapping applications and controlling sliders and how jQuery handles different things; is there a Blacklight way?; other than what is provided for with Bootstrap;
- Reading about progressive enhancement and graceful degradation; we're doing graceful degradation; gracefully degrade based on the technology being used and functionality; was a part of Blacklight in the past but moved to progressive enhancement; start with the basics and enhance with JS; kinda of a pain in the ass when you look at what people had to do before JS was widely adopted
- How many people have JS turned off and is this a worthy endeavor?
- Build without JS and then add it in later down the line
- Blocks being used in Hull and wondering if it is helpful for accessibility
- ARIA roles and helping with accessibility; for example links and navigation, audio, (http://www.w3.org/TR/wai-aria/)
- Using different standards; issues come up when you're not using best practices
- Avalon loses the branding at the top but footer branding is there; navigation items relocate based on size of the screen; important features search and facets for local browse;
- Compiling sites that are responsive for the wiki and notes
- Fluid sites and text wrapping
- Buzz words and responsive design to mobile design; what about analytics? What percentage are you seeing? Hull saw it increasing and decided to future proof it. How do people use your resources differently compared to mobile phone and desktop?
- What are the parts of the library sites are being accessed by mobile? And how can we use responsive design to accommodate the usage? Blogs? Bus and Train; library hours
- Text me the call number of the books
- Generally mobile first is the next thing; similar to progressive enhancement; what does a typical mobile library user do?
- Interacting with the library catalog
- Sharing interesting but low numbers of mobile and tablet users
- Native apps versus responsive design sites
Action Items
-
Perhaps some Google Hangouts to show our work
- List of responsive sites and contacts and/or do more than out of the box with Bootstrap and Blacklight - added to the foot of the Partners and Implementations page
- Research on usage of mobile and post on wiki