Articles, rants, news & other writing.
This is a collection of the articles I’ve written over the past 8 years, I’ve edited and tidied them up for clarity. I also got rid of a lot of older, less relevant (read: stupid) articles. I’m going for clean, and quality.
Creating htpasswd / htaccess restricted areas
I have to do this all the time. You’ve created a staging site for a client, you want to show it to them on a live server – but you don’t want it to get indexed by search engines, nor do you want people accidentally coming across it – you want to use htaccess and basic auth to restrict the directory. I almost always google the syntax for both: the htpasswd command. the htaccess syntax for adding auth. It’s annoying, this shouldn’t be this hard to remember (but it is). So, in a moment of free time I wrote a really simple shell script that does all of this in one command for me. I’m calling it htpassmaker. This is it, in a gist: Assumptions I’ve made: You’re using apache. You have htaccess files enabled on your server. You have shell access to your server. Things to remember: Put your htpasswd file OUTSIDE you webroot. I find the best course of action is to put htpassmaker in your unix path, then run it from the directory above where your webroot is, once complete, copy the created “.htaccess” into the webroot (or append it to the existing htaccess if you have one) I take no responsibility for this. It’s unlikely, but if you use this (or think it’s stupid) let me know in the comments, or on twitter...Should Designers Code?
Code and Design Are two vastly different disciplines. So I see a lot of people talking about how designers should code. How it makes sense for frontend code to be produced in the design phase. Now, to a point, I agree. I definitely agree that being able to write code will help a web designer better understand the medium they are designing for. However does that make coding a prerequisite for designing in the digital space? No. No. No. As an analogy, in photography people always talked about the need to know about the developing process to truly master taking a picture – and yet we find ourselves now I’m the digital age, where a vast number of photographers have NO concept of how a digital print is produced. Many of these photographers produce great photography. Writing code is not a pre-requisite for good design. Web is the same: you don’t actually have to write code to design great web sites or user experiences. I will grant that the understanding will probably help, but it is by no means a prerequisite. Obviously, if you don’t implement your own designs, you will need to rely on a developer to do this for you, which leaves you open to the stereotypical “it’s technically impossible” issue, where the dev just can’t be bothered to implement it. However, this is a process issue and has very little to do with your design. Compartmentalisation is sometimes necessary for creativity. As a designer and developer, I have to try very, very hard to compartmentalise when I design, so that my visual creativity is not limited...Graceful Degradation vs Progressive Enhancement
Graceful Degradation vs Progressive Enhancement Graceful degradation and progressive enhancement are two often confused concepts. Many people (developers, designers, other web professionals and not so savvy people) either fail to understand or decline to acknowledge the difference between the two. Both concepts are useful. Both are good practice. But: I believe that the subtle differences that people often ignore between these two concepts are also the reasons why progressive enhancement is a superior concept and a superior practice. Graceful Degradation Graceful degradation states that we should implement our new tricky features and then provide a graceful degradation for less sophisticated browsers/clients. The concept comes from computer science originally and states that a system or network should be able to remain functional even when a large portion of it is destroyed. Progressive Enhancement Progressive enhancement is a concept that essentially works as the reverse of graceful degradation. Rather than modifying our system to degrade for older browsers, we build it initially for those older browsers and then progressively enhance the experience to make use of newer technology. I believe this approach encourages designers and devopers to produce a product that functions well in older technology, where there is a tendency with graceful degradation to compromise on the solution for older browsers. Why bring this discussion up again? I’ve been teaching the web course at Shillington College the past few weeks and the discussion of students topics comes up on numerous occasions due to the nature of the HTML5 and CSS3 technologies that we are now teaching. The advent of these new technologies has seen the topic of continuing support become...Macaw: Could this be the front end web design tool we’ve all been waiting for?
If you’re a web designer or developer and you haven’t been living under a rock this week (or on tight deadlines and trying to stay off twitter).. then you’ve probably already seen the screencast walkthrough of Macaw. Quick Links: Macaw website Sneek Peek @attasi on twitter @gesusc on twitter It’s generated a fair bit of interest from people in my twitter stream, however the under discussed, yet arguably the most impressive feature of the entire video really comes at the last second – the code. This is the first time i’ve seen a WYSIWYG style editor that is trying to deal with modern issues, like responsive design, that produces decent markup. I’m sure that in practice there is a workflow that would need to be learned in order to get Macaw to actually generate clean semantic markup – however this is a massive leap in the right direction. One might even argue that this is what Muse should have been. The other interesting tidbit is that @attasi alludes to the fact that the app is built on top of HTML/CSS technology, wrapped (assumedly in a Webview) – for a purely HTML application, the interface looks pretty...Edgy Theme – Sublime Text 2
What is it? So, I’ve actually been using this for aaages. But the other day, someone looked at my laptop and noticed my editor and asked what it was. I said, oh it’s Sublime – to which i received a “no it’s not.”. Boring conversation about how i’d skinned it to look like Brackets.io ensued… The end result is, i’ve made it into a github repo – so see if other people are interested in changing how sublime looks. Basically my problem was always the same with Sublime as it was with Eclipse – it’s tabs are all big and curvy and i don’t like them. Get the theme: Github repo: https://github.com/soyrex/sublime-theme-edgy ...Retrofitting Responsive CSS
A quick post about the experience of retrofitting a mobile responsive layout onto a client’s existing website. We’ve worked with Costhetics for quite a while, and when they asked about “building” a mobile site vs implementing a responsive design.. we figured we’d give it a try..
PHP Simple Tweet
SimpleTweet is a class to load recent tweets for a particular twitter user. It uses the search API (which requires no authentication) to load the tweets and store them in a simple local filesystem cache file. Note: This functionality has since been removed from the twitter API – this code now needs to be updated to support Oauth in order to be compatible with the twitter API version 1.1. Links: PHP SimpleTweet on github Download...Sparrow for iOS: Interface design done right
You know you’re doing something right when your interface is clearly better than Apple’s. Sparrow for Mac did it and now Sparrow for iPhone has too.
Responsive is more than just tricky visual design
A quick rundown / stream of consciousness about the different use cases and contexts that *should* govern how we think about responsive web design. There is a definite lack in technology preventing responsive design from being the amazing revolution that it should be.