Good habits for password security

We all have it drummed into us to use different passwords for everything, but how many of us actually do? and how many of those use more than 2 or 3 passwords over and over again?

If you ask yourself why not, it’s probably because you can’t / don’t want to remember lots of different passwords & that you don’t want to put your trust in 3rd party password manager.

What you need is a system that lets you use the same password for everything but also changes it for everything. Simple, huh?

Sure it is. Without wanting to give too much away here is my system…
A password should be constructed of 3 parts.. One is the passphrase itself which never changes, one is obtained from the site you are logging in to and the third is to do with time. Without going in to too much detail of how I do it, you might…

  1. pick your passphrase. Something you will remember and something that ticks all the standard boxes of password selection. Not likely to be found in a word list (forwards or backwards), not your childs name or maiden name, 6-8 characters, contains uppercase letters, lower case letters, numbers etc. (EG Passw0rd – bad example but you get the idea)
  2. Add the first/last 4 letters of the site you are logging in to. Pick the end, or the start or somewhere in the middle. Maybe just pick 2 letters. Maybe reverse them. Anything as long as it’s the same each time. (EG ‘Passw0rdTwit’ for twitter, Passw0rdFace for facebook)
  3. Add the last two digits for your age. Or, for the financial quarter, or for the month, or the day of the week. Something you will be able to track. Personally, I like to use financial quarters because they are easy to track, repeat themselves over and over, help me to know if my passwords require a 3 monthly reset, and usually if I forget, there’s only a couple of possibilities if I can recall roughly when I set up the account. (EG Passw0rdTwit1, Passw0rdTwit2 etc…)

It seems convoluted and paranoid, but it’s pretty easy to remember once you get used to it. None of your passwords will ever be the same, and all you have to remember is the same phrase and whatever your personal system is.

Obviously there’s a 4th point – Don’t use the same system for your Banking or your master Email account. Either use a different system for really sensetive accounts, or don’t use a system for them at all. Just remember those ones!

I’ve been doing this for a while now and find it works quite well, but now I’ve shared with the world am going to have to change my system to something else!

Go Me…

Styling HTML elements in CSS without using classes / IDs

Something I came across for the first time recently is the practice of using HTML element attributes to apply CSS styles.

The mathematics can be found at http://www.w3.org/TR/CSS2/selector.html#attribute-selectors, but a basic example of where I use this technique is as follows…

starting with a basic form…

Demo Form



To lay the form out cleanly we might apply a few simple CSS styles to the input elements, as follows…

[css]
input {
display:block;
width:200px;
border:1px solid #CCC;
background-color:#FFF;
font: normal 12px/12px arial,sans-serif;
padding:0.5em;
}
[/css]

giving us the following…

Demo Form



All well and good, but the submit button is a little kooky because, being an input element, it picks up all the styling rules that we just applied. It’s easy to fix this by applying a few extra CSS styles to the submit button specifically – changing the background color, maybe a rollover effect, stuff like that – and I’ve generally done this by creating a new class specifically for the styling of form buttons .

While this works perfectly well, adding class=”button” to our HTML is completely unnecesary, because we can isolate all submit buttons via CSS attributes. The syntax follows the pattern…

[css]
element[attribute=value]{
css rules
}
[/css]

…and could work in the following manner:

[css]
input[type=submit] {
background-color:#039;
border-color: #000;
cursor:pointer;
color:#FFF;
width:auto;
margin:0.5em;
}
[/css]

giving us the following:

Demo Form



This can be used to isolate any HTML element you like – all forms with the method=”post” or all anchor tags with target=”_self” – anything really.

In fact now I type this out it occurs to me that the CSS selectors ‘.’ and ‘#’ (class and ID respectively) are just shorthand for the CSS attribute selectors element[class~=value] and element[id~=value] – more on the ‘~’ operator in another post.

The attribute selectors are a lot more powerful than demonstrated here, and I’ll write a bit about them soon but for the meantime you can read up for yourself at http://www.w3.org/TR/CSS2/selector.html#attribute-selectors.

Safe.
Neil

Googling with Laura-Jane

Not strictly something she said, but something worth a mention all the same.

Sat in my chair the other night feeding our two week old son, and Laura-Jane walks in and wants to show me something related to babies on the internet. Awesome. I love baby stuff on the internet, it’s one of my all time top 5 stuffs on the internet.

Admittedly we both had about 2 hours sleep between us at this point due to our son deciding that he doesn’t want to be put down at any point between midnight and 8AM, but still it brought a smile to my face when I watched Laura-Jane sit down in front of my machine, think for a second, then type the word ‘google’ into Google, click on the first search result (i.e. Google) and then proceed to google whichever bit of baby stuff she was trying to show me. I forgot that part.  I won’t forget the googling incident for a while though…