A brief web-history of time-wasting.

Last year, in another bean-counting exercise, I gave you my top 40 most-visited sites of 2013. Now it's time to give 2014 the same treatment.

Before the table, the necessary caveats: This list is just the websites I visited using the Opera 12 browser on my home computer in 2014 (there's a start date of Jan 13th, so there's a couple of weeks missing from this time last year). In the last few months I've been using IE for Tweetdeck as it no-longer works properly in the old Opera. This means that the tally below is missing about a quarter's worth of twitter-derived traffic. As Opera 12 gets increasingly past it, I've also been using Firefox and (more recently) Pale Moon for certain things (not least these 'blog posts). But the vast majority of my home webbing is through Opera and here are the results (hover over the site names for context):

			Total (h:m)	Daily av. (m:s)		%
		OVERALL	43d 01:19	02h 35:38	-50:22
1	=	tweetdeck.twitter.com	10d 03:02	41:19	-21:38	26.5	-4.5
2	=	en.wikipedia.org	5d 13:31	22:31	+10:41	14.5	+8.8
3	NE	feedly.com	3d 14:30	14:32		9.3	+3.6
4	NE	games.usvsth3m.com	2d 14:21	10:36		6.8
5	=	www.youtube.com	2d 06:19	09:14	-00:11	5.9	+1.3
6	▲1	www.bbc.co.uk	2d 00:02	08:10	+01:20	5.2	+1.9
7	▼1	www.facebook.com	1d 18:17	07:11	-01:29	4.6	+0.4
8	=	www.google.com	21:41	03:41	-02:27	2.4	-0.6
9	NE	www.dailymotion.com	15:49	02:41		1.7
10	NE	veritypodcast.wordpress.com	15:29	02:38		1.7
11	▼7	www.blogger.com	15:04	02:34	-07:14	1.6	-3.2
12	▲2	www.avwoman.co.uk	14:25	02:27	+01:08	1.6	+1.0
13	NE	gabrielecirulli.github.io	12:58	02:12		1.4
14	▼4	twitter.com	12:47	02:10	-00:50	1.4	-0.1
15	▲9	lawrencemiles.blogspot.co.uk	12:17	02:05	+01:33	1.3	+1.1
16	NE	thedoctorwhopodcast.com	12:11	02:04		1.3
17	NE	www.radiotimes.com	09:57	01:41		1.1	+0.7
18	▼7	localhost	09:39	01:38	-01:10	1.1	-0.3
19	▼16	theoldreader.com	07:40	01:18	-10:31	0.8	-4.9
20	=	www.sporcle.com	05:16	00:54	+00:10	0.6	+0.2
21	▼12	maps.google.co.uk	05:00	00:51	-03:54	0.5	-1.8
22	NE	www.british-history.ac.uk	04:29	00:46		0.5
23	NE	vacancies.leedsmet.ac.uk	03:19	00:34		0.4
24	▼7	jobs.york.ac.uk	03:11	00:32	-00:21	0.3	-0.1
25	NE	www.fchd.info	02:52	00:29		0.3
26	NE	www.chambers.co.uk	02:49	00:29		0.3
27	NE	usvsth3m.com	02:34	00:26		0.3
28	▲9	www.imdb.com	02:34	00:26	+00:10	0.3	+0.2
29	NE	www.buzzfeed.com	02:22	00:24		0.3
30	NE	www.librarything.com	02:20	00:24		0.3
31	NE	www.dalek6388.co.uk	02:18	00:23		0.3
32	NE	planningaccess.york.gov.uk	02:15	00:23		0.2
33		www.channel4.com	02:15	00:23		0.2
34	NE	docs.google.com	02:11	00:22		0.2
35	▼19	www.theguardian.com	02:00	00:20	-00:43	0.2	-0.3
36	NE	tardis.wikia.com	01:55	00:20		0.2
37	▲2	www.york.ac.uk	01:53	00:19	+00:05	0.2	+0.1
38	▼25	www.splendidchaps.com	01:40	00:17	-01:02	0.2	-0.4
39	NE	twominutetimelord.com	01:37	00:16		0.2
40	▼11	knowyourmeme.com	01:34	00:16	-00:09	0.2	=

The highest New Entry is Feedly: it's been a torrid time for RSS ever since Google did evil by killing its reader. My original replacement, The Old Reader, slips 16 places as a consequence of a decision to limit the number of feeds served by the free package. So Feedly is my new home. I've had no problems with it. 

Another big faller is The Guardian, though only by 43" a day, so it's hardly a crisis. Worth noting, though, is the appearance of web magazines Buzzfeed and the Mirror's usvsth3m. I've kept the latter's games domain separate from the rest, as that's basically there as a consequence of the things that inspired my 2048 and Fight! simulators.

Sites involved in last year's grand mapping project have given way to sites about Doctor Who as the combined efforts of last year's Splendid Chaps and the arrival of Peter Capaldi in the title role kindled a taste for Doctor Who podcasts of various flavours (not least the amazing Verity!, new in at number 10).

There's a lack of retail outlets this year, which is something worthy of note (the first turns up at 41). Instead there's a few job application sites (yawn). YouTube has some competition from the rockier shores of DailyMotion, and I've started getting my TV listings from Radio Times rather than TVCatchup (so as to limit to Freeview channels). But that's pretty much all there is of note, except that as a trained librarian I've now got my googling time down to under four minutes a day, like the search ninja that I am.

I'll keep keeping a tally through 2015, though whether Opera can last that long remains to be seen. For now, though, that's quite enough stats.

The 40 most-visited-by-me sites of 2013

How much time do I spend on the internet when I'm at home, and what am I looking at? A few years ago I decided to set myself that very question, and to answer it I stuck a clock on my browser. Unfortunately, I forgot to collate the first couple of years' stats. But I've since tweaked the counter a few times, and this year I've actually remembered to crunch the stats therein. The list consists of my 50 most-visited domains, some of which I've combined because they amount to the same site, and one of which I've removed because it is buggy (I did not spend five days watching Channel 4, and the suggestion that I did seems to have stemmed from some corrupt data left in the file from the previous year, but their website should probably be in this list somewhere). Another note before I show you the list: for the first half of the year it was clocking stats from all open tabs, and in the second half it was limited to the active tab. Also omitted is browsing from any other platform except Opera (so my brief flirtation with Netflix is not listed as it took place in Firefox owing to compatibility issues).

Here, then, are my 40 most-visited sites (caveats already noted). For more information about a site, hover over the name.

		Total (h:m)	Total (d:h)	Daily av. (m:s)	%
	OVERALL	1254:00	52d 6h	3h 26:00
1	Tweetdeck	382:57	15d 23h	62:57	31
2	Wikipedia	72:02	3d	11:50	5.7
3	Old Reader	71:54	3d	11:49	5.7
4	Blogger (my 'blogs)	59:37	2d 12h	9:48	4.8
5	YouTube	57:19	2d 9h	9:25	4.6
6	Facebook	52:41	2d 12h	8:40	4.2
7	BBC	41:36	1d 18h	6:50	3.3
8	Google	37:18	1d 33h	6:08	3
9	Google Maps	28:51	1d 12h	4:45	2.3
10	Twitter	18:15		3:00	1.5
11	(Local Host)	17:02		2:48	1.4
12	Historic Digimap	9:26		1:33	0.8
13	Splendid Chaps	8:03		1:19	0.6
14	A/V Woman	7:49		1:17	0.6
15	Alveley Historical Society	7:11		1:11	0.6
16	The Guardian	6:24		1:03	0.5
17	jobs.york.ac.uk	5:25		53s	0.4
18	TVCatchup	5:08		51s	0.4
19	Bing Maps	4:34		45s	0.4
20	Sporcle	4:25		44s	0.4
21	RightMove	4:10		41s	0.3
22	(Router)	3:38		36s	0.3
23	subjectguides.york.ac.uk	3:20		33s	0.3
24	Lawrence Miles ('blogs)	3:17		32s	0.3
25	Sheffield Planning Applications	3:08		31s	0.2
26	NRK	2:50		28s	0.2
27	Lady V London	2:48		28s	0.2
28	BBC Good Food	2:47		27s	0.2
29	Know Your Meme	2:30		25s	0.2
30	Pinterest	2:27		24s	0.2
31	Amazon	2:21		23s	0.2
32	Flickr	1:52		18s	0.1
33	Out Of This World ('blog)	1:47		18s	0.1
34	The Golden Era of GP Racing	1:43		17s	0.1
35	Tattuinardoelasaga	1:41		17s	0.1
36	thetrainline.com	1:40		16s	0.1
37	IMDb	1:39		16s	0.1
38	Gizoogle	1:36		16s	0.1
39	University of York	1:28		14s	0.1
40	Doctor Macro	1:27		14s	0.1

So there you go. The above list accounts for about 85% of my browsing (a stat that includes the otherwise omitted Channel 4 entry for necessary mathematical reasons). The colour-banding groups things together semi-thematically. What do we learn from all of this? That I like maps? We already knew that (or I did anyway). 

To get an idea of what this is telling us, we need another data-set. My other data-set is anecdotal. It is me remembering what sites I used most about a decade ago. About a decade ago I mainly used Google, Wikipedia, BBC and The Guardian. Those sites constituted a Big Four, with my own content probably filling in a fifth slot. The rest of my internet activity can be discovered from the array of bookmarks I still have in my browser from Them Days: home-made websites (largely replaced by 'blogs now, and consumed via my feed reader). Gone now are the days when I sat grazing the news at The Grauniad and the Beeb (International Version). Twitter feeds now deliver that news to me. But the difference is not as radical as if we roll back the clock another five years, when my most-used sites would've been Alta-Vista and Yahoo! We've come a long way since the Web Ring. We've gone full-circle and found ourselves back in Usenet, but with a 140 character limit.

I'm now going to clear the stat counter and hopefully come back in another 12 months to do some proper, more meaningful analysis of my browsing trends. Between those things, I need to do the pots and make some tea. 

{display: none;}

I like LibGuides. I'm generally rather sniffy about building-blocks web content because it's usually quite limiting and ridden with javascript (*shivers at the memory of certain VLEs*). But LibGuides is different: there's none of the painful clunk and nested frames one often gets with these things, and, most importantly, a LibGuide can be as simple or as complicated as you want it to be. In a good way. In a proper web-standard sort of way. LibGuides uses boxes of content which you can arrange around your page. The box content can be edited using a WYSIWYG editor or by using a Plain-Text source editor, so you can be as simplistic or as tricksy as you like when adding stuff to the page. In theory your page could just be one big box which you edit as you might edit any other web page.  You can use their basic bits of Duplo, or you can mortar in some real solid bricks. And this flexibility is good, because it suits Walter who's up for retirement and has no interest in engaging with HTML, and it suits Zoe the web whiz-kid who wants to employ all the tricks she learnt in her computer science days.

My first encounter with this fully codable and customizable world was when I was playing around with my LibGuides profile and accidentally misused the <plaintext> tag. <plaintext> does not change styled text into unstyled text as I had guessed it might. <plaintext> renders any subsequent HTML code as plain text, and should be accompanied by a closing </plaintext> tag. I did not accompany it with an accompanying </plaintext> tag, and consequently the LibGuides profile web-form melted before my eyes into a slurry of pointy brackets. I had to hack the code in my browser (see last month's post on the virtues of Opera) to save my LibGuides from the internet version of a China crisis. It was a frightening moment, but one which excited me to the freedoms inherent in LibGuides.

So lesson one: don't use a <plaintext> tag in LibGuides. On a related note, always be sure to close any <div> tags you might use, lest they hang beyond your box and prevent you from editing it ever again. In other words: it is very easy to break bits of LibGuides and there is no "undo" button. If you're going to play around, do it with either a) a little knowledge (a dangerous thing) or b) a browser that lets you tweak the script locally should the worst come to the worst.

The last paragraph was needlessly alarmist, you will be relieved to hear. While it is very easy to break bits of LibGuides, you are unlikely to ever do anything that will break bits of LibGuides. LibGuides is pretty sturdy even if it can be unforgiving.

Last December I was charged with the task of setting up a booking system on LibGuides (using its sister application: LibCal) and spent a couple of weeks tweaking the style-sheets to get them to match the library branding. I had used style-sheets before, on my own web-pages, but never for anything more than setting fonts. It was an exciting learning experience, and I began to get an idea as to the more unconventional areas of LibGuides customisation.

During my time at the University of Hull this year I was asked to research the ways that other institutions use their LibGuides. We then pulled together something of a wish-list of ideas: what we thought should be on the guides, and how we might make them look and work in a way that would be foolproof to navigate. I was given the job of putting some of these ideas into practice.

What most LibGuides tend to look like.

The image above shows your typical average LibGuide (the content and tab order represent the mode of the top umpteen Google hits for libguides.ac.uk and subjectguides.ac.uk domains). There is some logic to this content which is why it occurs with such regularity, but the appearance owes most to the box from which it came: we're looking at a factory default, and not everything in that default is strictly useful.

In this post I'm going to talk about some of the tricks I learnt in the process of giving Hull's LibGuides a facelift. The reasons for the changes we made, both cosmetically and in terms of content, are probably better left to those still involved with the project: this is not a corporate account of a rebranding. I'm here to talk about the mechanics of LibGuides more generally, and what can be achieved. But as an illustration you might like to compare the above generic page with one of the new Hull guides (Computer Science, for example).

The secret to customising LibGuides lies in mastering the CSS. Before I started playing about the other month I didn't know very much about the finer points of style sheets, but nosing at the page source of various LibGuides across the country alerted me to some useful bits of code, and the first one of any real import was:

{display:none;}

Don't want some part of LibGuides to show up on the page? {display:none;} is your friend. Say you were worried that the LibGuides search box distracted from your catalogue search box, you could switch off the former by putting <style>.lgsearch{display:none;}</style> somewhere in your page (the custom CSS section if you have that option, though any old bit of box via Plain-Text Edit will do). All you need to know to switch off a part is its element name (e.g. .lgsearch in the case of the search box) and that's the hardest part. The slow way of doing it is to parse the page source with a fine-toothed comb and a knowledge of HTML and CSS. The quick way is to use a DOM inspector, and that's the approach I took to taking, using the Opera browser's built-in DOM inspector: Dragonfly. All I then had to do was right-click on the bit of the page I was interested in and inspect it. I could even tweak the code 'live' to see what would happen. I have no better words to describe such playing about than: "well cool!" Pretty much every bit of a LibGuide has its own class and can therefore be turned on or off. Say you wanted to generate a list of guides by using the built-in box options, but you didn't want the names of the list owners to be displayed (as they are by default in such lists). It so happens that the list authors have the class ".pdisplay_author", so you can consign them to the back of the net with a quick line of code.

{visibility:hidden;} is {display:none;}'s more sophisticated sister: she renders elements invisible rather than non-existent. Applying {visibility:hidden;} to this paragraph would leave an enigmatic gap on the page, while {display:none;} would shunt the next paragraph up into its place.

But it's not just about turning things on or off or obscuring them from view. You can set the font styles of every single different flavour of text, so if you wanted bigger type for your lists of links, <style>.itemlist li {font-size: 200%;}</style> would double the default font-size. A similar approach can be applied to the tabs at the top of the page, should you favour a chunkier look.

As with all things, the more you fiddle, the more you learn. http://www.w3schools.com/css/ has become a regular reference as I've sought to put ideas into code. Hours have been spent shunting box content around with margin tags. The best way to find out how something works remains to find an example of that something and to take it apart (this was the approach I took when replicating the quick links menu from the main University website). This is not as easy as it used to be a decade ago, because things are increasingly held in separate style sheets (which is why a DOM inspector is a handy bit of kit to have to hand). Not everyone's going to want to do that. Most of you are probably already reeling at the various different flavours of brackets and punctuation I've thrown at the page. But even if you know only the faintest smattering of HTML or CSS, you can stick it into LibGuides quite freely, and that is something rather refreshing and also rather liberating.

There are still some frustrating limitations with LibGuides, chief among them being that you can't create replicable directory structures as you might with web-pages: a link to a tab on one guide will need to be replaced if you make a copy of that guide, requiring a fair bit of tedious mucking about if you're rolling out a new template that makes use of such links. But mostly LibGuides are a Good Thing: straight, friendly webpages put together in a way that suits beginners and experts alike. And that's why I like them.

Some useful element identifiers:

topnav	The bar at the top that contains:
breadcrumbsl	The breadcrumbs trail
bc_library_home	The library homepage part of the breadcrumbs
bc_lbguides_home	The libguides homepage part of the breadcrumbs
bc_guide_name	The current page in the breadcrumbs
guide_header_title	The page title
guidedesc	The page blurb
guideattr	The bar containing:
lastupdate	Last update
guideurl	URL
printguideurl	Print guide option
rssupdatelink	RSS feed
addthis_button	Share button
tabsI	Tabs (other versions available depending on set-up)
stitle	The bar containing:
guide_tab_title_bar_page_name	Page name
guidse_tab_title_bar_page_print	Print page option
lgsearch	Search box
innerbox	Internal box content (generic)
headerbox	Box title (generic)
roundbox outerbox	Parts of the whole box (generic)
boxatt	Generated content (generic)
box_comments	Box comments line (generic)