Jacek Kuzemczak

Abusing pseudo elements to create a page with no HTML

I recently had the idea to try and create a simple page layout without any HTML at all except for the <html> and <body> tags. After a few minutes of playing around I had something working, it was actually weirdly easy!

(more…)

Copy text to the clipboard using JavaScript and ZeroClipboard

There are all sorts of reasons why you might want to automatically copy some text to the users clipboard. The reason it can be so useful is actually the same reason it’s not possible, it allows data to break out of the webpage sandbox. The clipboard is considered to be part of the operating system so can’t be interacted with using JavaScript from a normal page, interestingly it is possible to copy text from the developer console, but that’s another story.

(more…)

Fancy radio and checkbox inputs

Before I explain this neat little trick I’d like to make it clear that this was not my original idea, I first saw it on the Halifax bank website but I’d imagine it’s been done in a load of other places too.

(more…)

SSH server on a windows PC

While working on a new web application recently I came across a a problem with quite an interesting solution. We have a Windows network of virtual machines that run applications which clients access via a web based control panel that generates an .rdp for them. Authentication is done via Active Directory using LDAP. The problem came when we started working on the accounts pages, how does a Linux web server tell a Windows domain controller that a user has changed their display name? The answer is to install an SSH server on the Windows machine for the Linux server to connect to and execute PowerShell commands, a very powerful combination of tools!

(more…)

Grid layouts are not complicated

There are lot of frameworks available to help with building grid layout based websites. They all vary in features, complexity and weight but focus on the same thing in the end. Creating a grid layout from scratch is not that complicated if you don’t need any crazy features, you also save a lot of bloat which will help with page load times.

(more…)

Ruthless semantic markup

I’ve recently overhauled the markup of this site to make it more accessible and generally better. The purpose of a HTML document is to describe the content of the page, in an ideal world it would be completely decoupled from the styling and layout of the page. It’s very easy to fall in to the trap of adding meaningless elements to a page to make a styling problem easier, these tiny concessions add up and you eventually end up with a meaningless div soup!

(more…)

CSS animations are awesome!

Yet another not-so-new-tech to talk about; CSS keyframe animations. Browser support is just about good enough to use these for things on actual websites now, they’ve been around for a long time but as usual IE is the sticking point with only version 10 and above offering support.

(more…)

Pure CSS tooltips

This is not so much of a new trick but it’s still pretty interesting, at least I thought so. Thanks to pseudo elements it’s possible to create simple hover tooltips using only CSS and a single data attribute on any pretty much element.

(more…)

Awesome incremental backups with rdiff-backup

Having a solid backup system in place for any project is pretty much essential but if you’re anything like me it’s something that’s often neglected. Let’s be honest with ourselves backups are boring, we’d much rather spend our time working on fun things than botching shell scripts that copy files around. For this reason until last night the backup system for my web server consisted of a USB hard drive connected to my home server and a single rsync command run by cron. This has always been perfectly adequate but the way it only gives one day to restore a deleted file before removing it forever is often a worry.

Luckily we have rdiff-backup which works in a comparable way to rsync but with one very important difference; it stores the incremental history of every file. Changed a file 2 months ago and need to revert to the previous version? No problem! This is certainly a much more intelligent approach than simply keeping a mirror of the directory.

(more…)

Line breaks are friends not food

One of the things that never fails to make me want to repeatedly slam my head into my keyboard when looking at other peoples code is inconsistent or none existent white-space.

(more…)
« Previous PageNext Page »