Designing Web for Big Data

As a web developer and designer the usual challenges I encounter involve things like making sure the page loads fast, providing users with a good layout that directs them to the content in an efficient manner, ensuring that the navigation makes sense, validating their input to prevent user errors and generally making their browsing experience pleasant. All these issues and their solutions have been documented dozen times over by many people. Most of the specifics of the various issues that arise are known and most of the ways to resolve those specific issues are also known. Once in a while however, I find myself dealing with “big data” and then the question becomes, how do I present the user with a lot of data – visual or textual – in a manner that’s not overwhelming, that makes it easy to navigate said data and more importantly, understand and work with it. Or to put it more bluntly, how the heck do I make a table that has hundreds of rows and dozens of columns not a complete pain to deal with?

In this article I will go over some of the specific issues I encountered when building and designing web pages with large amounts of data and the approaches I took to resolve those issues. Not all of my solutions will be appropriate for every type of problem but hopefully this information will come in handy in the future. Read more »

New blog design is up

The new blog design is finally up. It’s still not finalized, as there are some features and content missing, but even at this “beta” stage it’s already a big improvement over the old one. I already talked a bit about some of the changes made to the design, the layout and the content, but the new look is just a small part of the redesign, a lot of work has been done on the back-end as well and as you might have previously read a lot of it has to do with using semantic HTML5 elements to structure the website. On top of that I made several changes to how I manage and organize content, as well as, optimized the code. Read more »

How to do a header without a header – tiny solution to a big problem

I recently had a post in which I talked all about how the name of the site should really only use <h1> on the front page, and on the other pages it should take a backseat to whatever header the content has (post title for example). Well, I just ran into a problem related to that approach with the new design. Before I proceed though I must confess, the title of this post is sensationalist because the problem isn’t big. The issue is with the category pages – my design does not include a category title on a category page. Read more »

Site redesign update

So I already talked about the HTML5 rewrite of my blog’s code, but now I want to go over the design and the layout – what’s different and what’s new.  Before that I’ll just quickly say that I’m making great progress – basically the main structure and the front page are done and working, on my local server; now I just need to do the individual pages, as well as the single-post page and it’ll be ready to go. v2.0So in terms of the design itself, the new theme is still dark (i.e. white on black) but instead of the bright yellow as one of the main colours, I’m now using pale blue. Despite that the site actually seems to be more colourful. This is because in the current theme I feel that yellow is much too strong to use for titles or links, which means that all the text is white and looks very bland. With the more subtle blue I am able to use it for titles, links, as well as other elements on the page – giving the whole thing a livelier look. In addition to that I plan to use more post images, hopefully infusing the front page with a bit more colour, while still preserving the two-tone theme. You can check out the preview on the left for a closer look. Read more »

Re-writing my blog with HTML5

I have recently started working on a new design for my blog. Initially the idea was to just refresh the look and make the layout more flexible (the current über minimalistic layout doesn’t lend itself easily to adding more types of content, like blogroll for example), but as the design phase was wrapping up and I started thinking about the code I realized that this was a great opportunity to do something I wanted to do with it for a long time – convert it to HTML5. Below I go over the new redesign and some of the ideas and reasons behind the things that I do and the way I do them. Read more »

Cool CSS only buttons

I love CSS because it’s like having Photoshop inside a browser. Okay, maybe I’m exaggerating, but with modern browsers there are a lot of very cool things you can do with just CSS, without needing any of those pesky images with their overheads and extra kilobytes to download. In my work though I don’t often get a chance to try anything really interesting with buttons because they’re either simple, or if they’re not then I have to make them IE (worse yet, IE6) compatible so I end up reverting to mostly images anyway. So I decide to “go wild” and see what I can do without having to care about any of that compatibility nonsense.

Sidenote: Can you imagine if first cars had to be made horse-compatible? Yeah, think about that for a second.

So anyway, this is what I came up with.

CSS buttons

Look ma, no images!

Here is a demo of the buttons, pretty much exactly what I used for the screenshot above. I go over the styles after the break.

Read more »

Blog redesign is done

So the new look for the is up. There were some teething pains (categories disappeared there for half a day or so), but it all seems to be working out now. Biggest addition, other than the new design, is the Syntax Highlighter script, to make all those code chunks look nice.

There are still a few features missing but I’ll be adding those in the upcoming weeks. Anyway, it’s back to our regular scheduled programming now.

Page 1 of 212