Notes from Weelearning

Weelearning held the first event on Wednesday and I was in attendance in bristol. Dan and Sam are hoping to build a regular following for us e-learning types in the commercial and public sector. I really enjoyed the night and not just because I won a prize of e-learning books from packt.

What made this really enjoyable in addition to the two talks was that we had plenty of time to kick it with fellow folks. I attend plenty of formal rigid event so it was cool to almost have the other end of the spectrum.

We talked about the differences between commercial/public sector approaches, terminology and value of e-learning to traditional workshop models.

If weelearning can attract a regular following and keep the essence of a relaxed and diverse crowd then I look forward to meeting you at a future event.

Scalable and Modular Architecture for CSS

One of my web heroes Jonathan Snook recently released a website about organising CSS:

I’ve long lost count of how many web sites I’ve built. You’d think after having built a few hundred of them I’d have discovered the “one true way” of doing it. I don’t think there is one true way. What I have discovered are techniques that can keep CSS more organized and more structured, leading to code that is easier to build and easier to maintain.

I have long tried to grapple with the same problem and after a week or so really think this idea and website has legs. Below is a cut down version for quick reference, read and then head over to Scalable and Modular Architecture for CSS.

The four types of categories are:

  1. Base
  2. Layout
  3. Module
  4. State


1. Base styles are the defaults that we set. They’re almost exclusively single element selectors but it could include attribute selectors, pseudo-class selectors, child selectors or sibling selectors. Essentially, a base style says that where ever this element is on the page, it should look like this.

 Examples of Base Styles

html, body, form { margin: 0; padding: 0; }

input[type=text] { border: 1px solid #999; }

a { color: #039; }

a:hover { color: #03C; }

2. Layout styles divide the page into sections. Layouts hold all your modules together

Examples of Layout Styles
#header, #article, #footer {    width: 960px;   margin: auto;}
 
.l-header {    float: left; }

3. Modules are the reusable, modular parts of our design. They are the navigation, callouts, the sidebar sections, and the product list and so on.

This is the meat of the page. Modules sit inside Layout components. Modules can sometimes sit within other Modules, too. Each Module should be designed to exist as a standalone component.

4. State styles are ways to describe how our modules or layouts will look when in a particular state. Is it hidden or expanded? Is it active or inactive?

.s-error {    color: #F00;    background-color: #FEE; }

 Grouping properties  

  1. Box – display, float, position, left, top, height, width and so on.
  2. Border- border-image, and border-radius.
  3. Background
  4. Text – font-family, font-size, text-transform, letter-spacing etc
  5. Other

Missing a trick – Hotel guestbooks

It is a constant struggle to identify good hotels/hostels – this time we were lucky that a colleague suggested ‘The Havelock‘ on the Isle of Wight, a place which has exceeded our expectations and we couldn’t have been happier.

On the front desk the owners have a guestbook which reflects the happy stay of many guests . What’s wrong with that? Nothing except we are already here and so the comments don’t  really add value much to anybody – although my better half suggests it can be good for local recommendations.

Those comments would be very helpful to anybody who is considering the hotel via the website. I propose that all hotels transfer those comments to their own websites on a regular basis. This would help interested potential guests AND surely help keep fresh material on the site – who loves this more than a search engine and a bunch of hotels with static sites vying for a higher search ranking that’s who.

It is good that The Havelock is on tripadviser as at least those comments can help you decide.

Enabling webgl in Firefox

Earlier today I was attempting to view an example of 3D in the browser that makes use of webgl but the browser kept insisting webgl wasn’t enabled.

Initial web searches indicate that webgl, which is used to get the 3D working should be running on Firefox (im using 6.0.2) but it clearly was not!

Instructions

To enable webgl simply type “about:config” into the browser address, promise to be care and then type “webgl” into the filter at the top.  The second option should be “webgl.force-enable” and you’ll need to double-click the value of false changing it to TRUE.

Reload the 3D example page and you should now be up and running.

Jquery – .slidetoggle()

Remember when using the .slidetoggle feature of jquery that you need to set the element that you wish to start hidden e.g. a div called ‘map’ to display:none or else the div will start visible.

Also if using multiple toggles remember to give each a unique set of names (unless you know how to properly code and this can be done in a cleaner fashion.

Dear future self, this will save you 12hrs of head scratching.

Look at the wheels!

Bike up on the stand in the garage

I just got a new set of tyres for the bike and my impression after a mere 6 miles is that it now feels like a completely different bike.

This is the first time that I have had new tyres on the same bike, as I traded the last bike before they were too gone.

The steering immediately felt different, initially I am putting this down to having the correct tyre pressure! There is def increased height at the front now which I wasn’t used to and couldn’t get a feeling in roundabouts but the last mile felt comfy.

I inherited a square rear tyre (caused by lack of turning and mainly motorway miles says the fitter) which always made leaning strange when hitting the edge of the tyre.  Under acceleration I can feel the improvement to grip (experts may laugh at this notion) as the bike was quicker through the first two gears.

I am amazed at just how different the bike feels already and will be assuming fresh tyres is a good thing!

I got a set of Avon Storm ST ultra’s (£252.93 with fitting) from Protyre Bristol based on what a few of the BAM guys recommended.

How long will they last? note to self, you are on 21K the day they were fitted.

Making Firefox mine – extensions and such

Whenever I use another computers browser it is always setup in a unique way, and mine is no different.

Though I have opera, chrome and safari I always come back to ye ole faithful Firefire. I like it naturally because I am used to it, and I got used to it due to some handy extensions that I probably use daily. I thought i’d list them as you may also find them of use:

  1. Firebug. THE must have extension if you are in anyway curious about what is under the hood of any website you come across. This beauty lets you select any page element and reveal the coding secrets behind. Better still, you can make changes and see live previews before your very eyes.
  2. ScreenGrab! I collect website screengrabs of sites that catch my eye and for keeping an archive of old designs before I update.
  3. Colorzilla. A really quick way to grab all the colours you find that you just have to have.
  4. Web developer toolbar. The ruler for measuring gaps between elements is worth the download alone.
  5. Open Attribute. The ultra fast way to get Creative Commons license details in the correct format at the click of a button.

Show and tell with UOB ebooks

I recently delivered 3 one-hour sessions to small groups of library types on the subject of all things ebook at the University of Bristol.

The University of Bristol has around 5,000 ebooks at the moment. Enough of a critical mass to get my interest in ebooks in the institution. John Hargreaves, Assistant Subject Librarian for Law kindly organised the 3 sessions which I was using to see what the problems are from the other side of the issue desk whilst giving them a brain dump of what I see as the opportunities and constraints.

Being the book reading type that I am, I was keen to wade in with using ebooks – that was until I actually tried to find and use any of them (more of that in future posts).

Problem #1 By using the library catalogue, ebooks as a “type of resource” are not easily surfaced without using an advanced search, which I believe is a huge barrier to “discovering” ebooks. I doubt very many people use the advanced search as the first port of call. My mental model is that I do a search and all results are shown, regardless of the ‘type of resource’ be that print books, journals, CD-ROM or ebook.

I came to each session armed with 1 print book and various ebook reading capable devices as to my surprise the library doesn’t have any staff ebook devices, each loaded with the same ebook:

  • Amazon Kindle 1st Gen
  • Sony ebook reader Touch Edition PRS-650 *
  • Desktop Windows computer
  • Apple iphone 1st Gen
  • Android Tablet *

* Thanks for the lend Mr Gray

#Problem 2: The libraries do not have the kit that they require – using ebooks from the other side of the issue desk is both theory and practice and in order to help folks with trouble they need to use the devices themselves.

After briefly explaining about the common ebook formats (EPUB, PDF, mobi) we had a play with each device using the “Responsive Web Design” ebook. The above list shows the most liked (kindle as best) down to the least user-friendly (pressure-sensitive tablet).

The test ebook also makes use of video which displays on devices that support EPUB3  video and this showcased why the ebook version may have an advantage over the print version.

Opportunity #1 Next I showed the ibis reader which I only have glowing things to say about it. I wonder if the platform could be integrated someday into the University system and act as the official ebook reader for desktop and mobile.

Then we tried a University ebook and things got really depressing.

We used the search keyword ‘china’ to find our guinea pig ebook.

It appears that the major education publishers ship ebooks using Adobe PDF as the ebook format of choice. Clearly this is to make use of the Digital Rights Management (DRM) but has the nasty side affect that none of the ebooks will run on a ebook reader such as the Kindle… thats right, ebooks that do not run on the most popular ebook reader device. So I think it isnt too much of a leap to connect the dots that access to ebooks and use on devices are two of the major barriers to ebook uptake. I sent an email to one of the major publishers to ask them about this but am yet to get a response.

We were all in shock. Say it slowly – “ebooks that do not work on ebook readers, are probably not ebooks”.

If you work in a library, what are the issues here and how to do you work with such barriers?

I hope to wade into lots more ebook stuff in coming months.

UPDATE 10th Jan 2012

The fantastic Ibis Reader has been acquired and so it is watch this space as  to the future of the platform as I know it.

Watch the Throne

What kind of album is this? well I just walked to the pub listening to it and had to do a U-turn to come home to listen to it in full on my “real” speakers. Excited, and this is exactly what music should do!