Tesmond's Useful Design

I heard a news story today which made me so angry I had to write about it here. Researchers of Chronic Fatigue Syndrome (ME) have received death threats from a number of ME suffers. Why would they do such a thing?  Aren't these researchers just trying to help them? The reason for the threats is the suggestion by a number of researches that the condition is a mental health problem and not an unknown virus, and can be potentially treated through psychiatric care. For some strange reason people are offended if they are told they have a mental health problem, but being told that they have a weak and feeble body is apparently fine. It is not even just a simple case of blame diversion, because there are other instances where the cause of a problem can be "blamed" on the patient but they accept it.  For example if someone goes to the doctor with back pain they may well accept the statement that the cause is the way you sit at your desk, every day your posture is causin

Pure rectangular grid design is unsurprisingly a very popular website design strategy.  It allows clean simple easy to follow patterns.  However, it takes good design skill to stand out from everyone else who is doing this. If appropriate you can stand out with a more "organic" style.  Although you will probably end up building this using some from of grids the result can give a more "natural" feel.  It is important in a less formal design style to use colour and contrast to guide the user appropriately and to not make the style distracting and confusing.  Another technique to allow this naturalistic style is animation. Appropriate animation is probably one of the most under used techniques, perhaps because it is difficult to pull off, but when it is done well, such as in the transitions in iOS and Windows 7 phone then it can really help guide context and application understanding. Found a nice little demo  that can help with a useful transition highlight effe

An extract from Why persuasive design should be your next skill set a simplified history of user experience Human-computer interaction  is about paying attention to people and their relationship with computing. Information architecture  is about making things findable. Interaction design  is about making things usable. Content strategy  is about making things meaningful. Experience design  is about making things seamless. Persuasive design  is about making things influential.

Interest blog post by MS on sandboxing iframes .  I previously mentioned iframes as a cheap and easy way of embedding information into sites which should retrict maintenance and compatibility issues as much as possible.  However, if the iframe is truly 3rd party and you do not have great control over it this sandboxing sounds great for reducing possibilities for your site's security being compromised by an iframe.

A nice blog entry on MSDN has alerted me to the document.hidden property to help with performance. It looks like this will be great for dash board and auto alerting webpages.  Have a few ideas on how to use it already :).

Just a little CSS3 example I quite like.  Using the "alpha" layer in the box-shadow allows a more universal reusable style as the background and border colours can easily be altered but the overall style remains the same.     .info {         background-color: Khaki;         border: 1px solid DarkKhaki;         border-radius: 4px 4px 4px 4px;         margin-bottom: 2em;         margin-top: 1em;         padding: 0.5em 2em;         width:20em;         box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;        -o-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;        -webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;        -moz-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;            }   <div class="info">    Something slightly important here </div> Just posting this to remind me of some simple options to create nice shadows regardl

iFrames, do they even still exist? Well integration with systems isn't aways APIs, XML and JSON magically working in harmony.  Some times you have to integrate a web app into another site as quickly as possible, maintaining the sparation to avoid unpleasant upgrade costs. iFrames intially appear to be a great solution, but they do present a number of horrible problems.  The worst offender IMO is the height property.  Why on earth does setting the height to auto or 100% not allow the iFrame to fit the content it contains automatically?  This would seem the most logical and common option, who likes scroll bars inside scroll bars?  Well I guess those higher powers that design specifications seemed to decide that scrollbars are great. So far the best solution I have found so far is at Dynamic drive , a bit of JavaScript that automatically resizes the iFrame to fit the content.  However, a word of warning I found I had to make some minor pixel adjustments in the code, but otherwis

Just discovered a nice way to achieve all of those lovely CSS3 features on IE6-8.  Previously I had generally used an IE specific CSS and images (Yeah I know nasty right?).  CSS3 Pie uses a bit of JavaScript to "fix" the missing border shadow and linear gradient CSS properties in IE6-8. Now if we are fair IE7-8 can perform Linear gradients with a directX filter, e.g. progid:DXImageTransform.Microsoft.gradient(startColorstr=#ffffffff, endColorstr=#ffdddddd); But this is not perfect* and does not cover IE6.  If only everyone was on IE9, FF or Safari. *Anti-alias text issues, click behaviour can be effected etc.