Well, #IMD is now pretty much over for those of us in final year. It's been a great, if stressful, time for me and it'll be nice to finally unwind over the next few days before getting back to work on ReferenceIt for final submission.

I'd love to say that I'm entirely responsible for the sheer awesome that my site consists of, but it would be a lie. Over the past year I've read an insane amount of material both on and offline. And in this post I'm going to go over some of the best resources I've found and made use of over the past year.

Straight to the Good Stuff - Print

Normally I'd provide a bit of a build up to the main point that I'm looking to make, providing some background on what I'm talking about. Today it's all about sharing the resources I've found to be most useful over the past year. This time I'm just going to work through each of the resources, providing a brief overview of each as we go. So let's get to it shall we?

A Book Apart - All of Them

The three books (currently) available from A Book Apart are a pretty awesome series of resources for several topics related to web design. Rather than providing an in-depth, overwhelming, look into the nitty gritty workings of a topic, these books provide a fantastic resource for getting to grips with the things you need to know now whilst providing information on where to look if you want to delve deeper into things.

As both a student and someone who freelances semi-regularly, having a series of books that doesn't get lost in the technical side of things has been fantastic. They're quick and easy to read and to understand, which lets me get back to work with a solid understanding of the topic at hand.

Available Online

• A Book Apart

HTML and CSS Web Standards Solutions: A Web Standardistas' Approach

This book, by final year lecturers Chris and Nicklas, I purchased during my second year on the #IMD course. At the time I was well aware of how to build a site using HTML and CSS, which is what this book covers. Even with this knowledge I came away with a better understanding of how and why sites should be coded in a semantic, structured fashion.

The only thing I would count against this book is that it deals with XHTML, and this one fault is brought about purely due to how well it has stood the test of time. The approach taken with this book is as applicable to HTML5 sites as it is to XHTML ones, and this is something to bear in mind when reading this book.

Available Online

• Amazon.co.uk
• Amazon.com

Web Designer's Idea Book (Volumes 1 & 2)

I'm of mixed feelings sharing these books as they aren't really a resource I use regularly. These books are, however, a really nice collection of sites that have really nice designs, which can inspire some really beautiful pieces of work. There's no how-to with them, which means you can't just copy/paste the code used, something I view as a plus - it makes you work things out yourself.

The books break the designs down into multiple sections. These are either a colour or a style of design, making it nice and easy to quickly view specific types of site design. This is useful if you're seeking a particular type of inspiration, as you can go straight to examples of similar site design.

My own criticism of these books would be that I can't get them in any digital format. Quite often I find myself not working at home, which means I can't look over these books because I'm not going to carry them everywhere I go... just in case. I would love to see these made available in a PDF or similar digital format.

Available Online

• Amazon.co.uk (Volume 1 & 2)
• Amazon.com (Volume 1 & 2)

8 Faces

8 Faces is a magazine produced for people who love typography. Each issue it covers 8 people's views on the world of typography. In addition to these articles, each person who makes an appearance in the magazine provides a list of their favourite fonts. Magazines are printed in a very limited run, remaining available as PDF downloads after the printed versions are sold out.

As someone who works on the web I have found the topics brought up in the issues to be very insightful, as there is a brilliant blend of print and web typography talk. With the increasing requirement for perfection in every aspect of web design, I think this is a valuable resource for people looking to produce brilliant design the entire way throughout a project.

If you can get a printed copy, do so. If you can't get that, get yourself a copy of a PDF. If this isn't an option then beg, borrow, or steal ¹ a copy from someone who does.

Available Online:

• 8 Faces

The Good Stuff - The Internets

All of the above are printed media. And they really are all kinds of awesome. They're also very much static, you can't exactly update a book after it's gone to print. This is something only afforded to content on a magical place... called The Internets. Here you can find all sorts of new, experimental, awesome and horrifying stuff. With great power comes great responsibility - unfortunately people on the internet don't seem to follow things called "rules".

Over the past couple of years I have found and used a series of really awesome sites to get stuff done. This is something I have done previously ² and I thought I would finish off this year by doing the same again, sharing some of the awesome sites that I've found to make my life easier, or just showcased some awesome stuff.

CSS-Tricks

CSS-Tricks is a site by Chris Coyier, who is some kind of god when it comes to making awesome stuff online. When he isn't tinkering with something, you'll probably find him posting up a fantastic article on some kind of HTML, CSS or jQuery thing he's cooked up.

Honestly, any time I've had an issue with some kind of client-side technology, this man has had something up on this site that has helped me out. Visit CSS-Tricks, you won't regret it.

Perishable Press

Perishable Press is a site maintained by Jeff Starr. He's a guy that does a lot of WordPress related work. Much of this is covered on his site and most of it can be applied in some form or another to pretty much any web site, as he covers a lot of best practices that happen to deal with WordPress, but that aren't specific to WordPress. This results in a vast amount of really useful information for people reading his site.

This is, I feel, my #1 online resource for weird server-side stuff when I have issues. If I can't get help from people I actually know I go here, then hit up the Google. As most people on the #IMD course are aimed more at design than development, this might not help you too much, but if you're at all interested in that kind of thing, or work with WordPress, you should really hit up Perishable Press right... now.

Digging Into WordPress

Digging Into WordPress is a joint venture by Chris Coyier and Jeff Starr, dedicated to sharing information on how to use, improve and expand upon WordPress. They use two ways to share this information. There is their book, which contains information about working with WordPress and there is their site which provides information about doing much more.

The really nice thing about their book is that purchasing either the print or digital copies of their book provides you with free copies of each digital version when they update the book - something that they do shortly after each WordPress update is released, ensuring that their customers always have access to the latest information regarding WordPress.

People finishing second year could probably have used this resource several weeks ago, and students entering the second year of #IMD might want to check out Digging Into WordPress now so that they have a better understanding of how it works. Of course, the same is true for anyone who is interested in using WordPress and wants to tinker with it.

Forrst

Forrst is a community for Designers and Developers to show off work, share code, and get feedback on things. There has been a lot of comparisons between it and dribbble but I really see them as two entirely different types of community. I've not really used it a great deal of late, which is a real shame. The community spirit of Forrst is really great, and you'll find both inspiration and fantastic information at every turn.

Unfortunately Forrst is an invite-only community but you can apply on the Forrst Homepage or, if you happen to know members of the site that regularly get invites that they can use to add new members to the community. I currently have 3 available. If you'd like one and follow me on twitter, drop me a message and if I like your work (and have any invites left) I'll send an invite your way.

24 Ways

24 Ways is a designer's advent calendar. Every December, 24 designers each produce an article for this site, sharing their knowledge so that everyone can benefit from what they have learned. The last series of articles marked the sixth year that this has occurred as well as their first foray into the world of print. This first step consisted of a lovely printed version of this year's articles, with all proceeds from the purchases going to charity.

Fortunately, for people who didn't get a chance to purchase a copy of the annual, this year's posts, along with posts from the previous 5 years, are freely available to anyone who wants to visit the 24 Ways site. When content this good is available, there's really no reason at all why you shouldn't be reading it.

That's a Wrap

So with my #IMD career coming to a close (May 12th will be my final submission of work as an #IMD student), I wanted to share some of the resources that I've used to get me through the past couple of years (and have me dubbed the "God of #IMD"), in the hopes that they might be of some use for students getting ready to start the course, or to progress onto another year.

I'm not quite done with University just yet though. I've already been accepted on The Masters course and I'm hoping to land a position helping one of the years of #IMD in the labs. Hopefully you'll find some of these resources to be as useful as I have, and you'll enjoy your remaining time as #IMD students as much as I did.

Oh, and enjoy your summer breaks, it won't be long before you're back for another year.

When it comes to creating a web application it's vital that user information is secure. If it isn't then people's faith in both you and your work will plummet. As I'm developing my own application from scratch, this is a very important aspect of my code to get right, and a very difficult thing to do correctly.

I'm going to be taking a look at some of the research I've done with regards to securing user information, covering things like how best to hold data like user passwords, as well as some of the techniques you can use to do so effectively and securely.

Security is Key

It goes without saying that keeping user data secure is important. A user entrusts you to some of their data, and it is up to you to keep it secure, even from yourself. As much as people shouldn't use the same password everywhere it is a lamentable fact that they do. This brings me to the first point of securing user details:

• Never store passwords in plain text.

Users don't want you knowing their passwords, and they definitely don't want anyone else knowing their passwords if the worst should happen... your database gets accessed by people it shouldn't be. So how do we go about this? The first stage is encrypting the passwords people use. There are two common ways to go about doing this:

1. MD5 Encryption
2. SHA1 Encryption

Whilst either of these is a viable option, it is a commonly held belief that SHA1 encryption is better for security than MD5. So we now know that encrypting user information is important, and we have some methods for doing so... but how do we use them? In PHP, my server-side language of choice, this is quite simple:

  
$md5 = md5('wordpass'); // Generates e80eded141e1295d694cd35cf2b8f675
$sha1 = sha1('wordpass'); // Generates 2939094f35a3badf2a890768ba034fa5eb16e95e
  

As you can see, either of these functions converts a password into what appears to be a random set of characters. Each is, however, unique to the word that generated it. To then check that the user is entering the correct information we simply run the same encryption on the password the user enters, and compare it to the stored password we have.

It's not THAT Simple

Unfortunately security isn't quite that simple. It isn't possible to reverse engineer passwords encrypted using MD5 or SHA1 (currently anyway) but, if all you do is use a single encryption on passwords then user details are still at risk. How? Not everyone to ever use the internet has done so with innocent intentions and there are resources available, to people who look for them, to get lists of randomly generated passwords in both plain text and their encrypted counterparts.

These resources, called Rainbow Tables, allow for a basic form of reverse engineering. Rather than decrypting information, they look up an encrypted password and, from that, get user passwords. So it's necessary to take things a bit further.

Added Security

To take encryption to the next level there are a few things you need to do. The first is ensure that the encrypted password relies on some other form of input, so that even if the password is pulled from a Rainbow Table it's not actually the password the user generated, it is the password plus additional characters, rendering the password useless. This is called a key and helps add an additional layer of protection to the user's information. Because this information is readily available (you store it for this specific use) it can be easily applied to all passwords when they are generated, as well as when a user wants to log in at a future date.

Example of using a key

  
$key = 'vnfuwy8t92bjkvfs';
$md5pass = md5($key.'wordpass'); // Generates 2f5177c377a9d073d82c5685c8eaacc1
$sha1pass = sha1($key.'wordpass'); // Generates 64cfaf4fd8ab086fc4620964dacc67d2707dc587
  

Because of the additional characters being added to the password, even if it is decrypted the end result still isn't a valid password.

Is This Enough?

Possibly, but if your site is hacked, there is a chance this information could be discovered, rendering this security useless. Besides, when it comes to other people's information, is there such a thing as too secure?

An additional form of security that can be used to help ensure that each password has another, unique string attached to it. This is referred to as salting. As each password is assigned a unique string of text this greatly improves individual account security, as there is no readily available method for working out what that string is, without looking through the source of the application in question.

In my own encryptions I am basing this off of elements of the email address that the user registers with, as this will always be a unique identifier for the account, as each email address can only be registered on the site once. In my own example I add an encrypted version of the email address to the password, something like the following:

  
$key = 'vnfuwy8t92bjkvfs';
$md5pass = md5($key.'wordpass'.md5('email@example.com')); // Generates 2f720caab50709a9228e0d985e1f47bf
$sha1pass = sha1($key.'wordpass'.sha1('email@example.com')); // Generates e08dcf66052f9f42802b572680e5f8be5f5a2862
  

This adds an additional layer of security which isn't defined/stored anywhere in the site, being used on registration and when the user logs in. Even with that I'm not 100% certain that this is the best approach to salting the login information, but I am hopeful that it should be strong enough, when combined with everything else, that it will provide a secure environment for user details.

Wrapping Up

Above I have covered some of the most common ways to secure user data, along with basic examples of how they can be used. My own implementations differ slightly from these, but the general structure is similar. Hopefully this information will provide useful to some of the people who read this and, if you can think of ways to improve upon it, I'd love to hear your thoughts on this topic.

Last Semester I spoke about my plans for my Major Project. One of the things I wanted to do was make use of a PHP Framework. I talked about the different options that were available to me, before settling upon Yii.

Over the past few weeks it has become blatantly obvious that trying to pick up the ropes of a PHP Framework isn't something that I should be doing over the course of a single semester, as evidenced by the lack of development being posted on this site of over on ReferenceIt itself. Don't worry though folks, I have a plan.

Two Steps Forward, One Step Back

Sometimes, in order to make progress, a change in direction is needed. I've found this to be the case with the ReferenceIt project this week. As a result I haven't actually made much by the way of progress but I have put myself into a much better position to push forward with my Project.

Those who follow me on twitter may have seen that I have been developing my own flat-file CMS with my spare time. It's what powers this site too and, in a way, has contributed to the mini-framework which will be powering ReferenceIt as I develop it. Both use a very similar structure to their code to determine what needs to be done, and how it should go about doing it.

Naturally a flat-file system won't work particularly well for a dynamic WebApp and, even if it could, I wouldn't dare to try it. The first major difference between this site and the ReferenceIt site is the addition of MySQL, to house content, data and user information. This also helps to ensure that data is as secure as possible, hidden away from the public eye.

URL Logic

Obviously creating a methodology to handle a whole site can be quite problematic but, with a bit of thought, it can be made to be simplistic as well. In Linux based web-servers there is, typically, the ability to rewrite URLs so that what you see in the address bar is human readable, whilst the web server sees something that makes sense to it. Windows based servers use a file called web.config which works differently, but provides the same functionality. In this post I'll be dealing with the platform I use, Linux.

The .htaccess file gives a developer a great deal of flexibility when it comes to web development. I use the functionality it provides in a very basic manner, to redirect everything that isn't a file to my index.php. This is done using the following lines in the .htaccess file:

  
RewriteEngine On
RewriteBase /

RewriteCond %{REQUEST_FILENAME} !-f
RewriteRule . index.php [L]
  

This bit of code redirects everything that isn't an actual file, to the index.php file. This allows files which exist to load, whilst redirecting everything to a single file which handles the logic for the site. This allows for easy generation of error pages, as the logic is entirely handled in one place.

Using this I am then able to identify what actions need to be taken based on the URL being used. For example, a URL ending with /references/web/add/ would suggest that I am dealing with references, in particular web references, and that we are wanting to add a reference. Similar structures can be used for print and other forms of references.

Moving Forward

Making the decision to step away from developing using Yii is a risky one. It means that I have wasted some of my time this semester on something which will now be useless in the grand scheme of things. It hasn't been a total waste though, as it has helped me focus on what I need to do, especially with the clock against me.

I'll be looking a bit more in depth at some of the aspects of my progress over the next couple of blog posts on here, as I progress through the aspects of the ReferenceIt site development.

Referencing... Have you ever sat down and taken a look at just how much actually goes into creating one? Over the past week I have been looking into what exactly makes up a Harvard Reference. Turns out that there's a lot to creating a reference.

Referencing different types of media requires a pretty wide selection of elements. These are needed to cover all of the possibilities that exist for the different types of references both commonly, and uncommonly, made use of in research and documentation.

Anatomy of Harvard Referencing.

As mentioned above, I've been looking into what is actually needed to generate various references using the Harvard Referencing Style. Below is a table listing the types of references that I have found syntaxes for with the Harvard Referencing Style. It includes a breakdown the syntax that is to be used to generate the relevant reference.

That's a whole lot of %%s, right? When piecing these syntaxes together I was thinking of what I would be doing with them. I want to have an easy to use syntax for creating references, which requires an easy way to separate the actual content with the elements that need to be replaced. Using %% seems like an ideal way to separate these elements, and defining common terms for referencing elements that appear regularly. This helps with data organisation and helped to give me an idea of the sheer scale of a referencing style.

I've also applied styling to the referencing syntax. It's not visible above due to the manner in which the styling is applied. I'm using Markdown, a way of coding that I was introduced to at the beginning of the year, to style the syntax of the references. I have done this for a couple of reasons:

1. Flexibility - Markdown allows references to be styled up in multiple formats, such as plain Markdown, HTML code and Rich Text.
2. User Friendliness - I know that I won't be able to research every referencing style out there. Using Markdown makes it simple for users of the site to suggest referencing style syntaxes that I can add to the site, as well as allowing users to create their own syntaxes for personal use.

Both points are of equal importance to my project. I want the site to provide users with the options to create references that can be used regardless of where they are going to be used. Ultimately, however, the second point is the most important one. The user base of my Major Project is the most vital aspect of things, and giving users the ability to create their own structure for their references is important. This will give users the ability to create referencing styles for personal use as well as providing a potential for expanding the capabilities of the site.

Now that I have a basic control over how references can be dynamically laid out I will be able to turn my focus to looking at how to create and display references. Expect more on this over the next week.

After a restful break between Semesters 1 and 2 it looks like I'm back, and straight back into the thick of things. Whilst I've been taking time out I've not been neglecting my project, taking time to organise things and unwind after a stressful first semester. I have a feeling that this semester is going to be piling on the stress from the get go.

So now that I'm back I need to get things going with my Major Project, ReferenceIt. The first step of this is going to be providing a way for people to keep abreast of what is happening with the project, closer to the launch of the site. An ideal solution to this is creating a mailing list. As an added bonus this gives me a way to measure interest in my work, and gives me a way to reward early adopters by giving them early access to the site.

Getting The Ball Rolling

The first thing I knew I needed to do was find a good tool to help me handle my mailing list. I'm a big fan of building things myself, but with everything else I need to work on I realise that sometimes it's better to use a pre-made solution. In this case there were two obvious solutions available to me. These were MailChimp and Campaign Monitor.

Inspired by the stress levels I'm already feeling I decided to take the safer option of the two - working with the one I've previously used. In this case, MailChimp. I've had some experience with it, which put it a step ahead of Campaign Monitor.

With the decision made it became a simple thing to set up a mailing list. This left me to handling something I'm good with, creating the HTML to let people register themselves with the mailing list.

Sticking with a Theme

The entire way through my last semester I covered how I want the design of ReferenceIt to be a style that relates to the images my mind conjures up when I think of referencing, the comforting colours of sitting down and reading through an old, yellow paged, book. The mailing list form is the first opportunity for me to convert this image from imagination into code and images, and I wanted to make sure that I did it properly.

Of late I've been having awesome ideas for layouts and designs, which is equal parts awesome and scary as I've always thought of myself as a developer, not a designer. Once again this was the case with the design of the mailing list registration form. I visualised the idea of a post card which people could add basic information to that I would need for contacting them. For this form that consisted of their email address and their names. The final result can be viewed on the site and I'd love it if you'd register to find out more about the project.