Blog Stuff we're discovering, learning, reading, watching, enjoying...

Er, yeah. I didn’t know what FCrDNS was either… Forward Confirmed Reverse DNS. [And if you don't know what DNS is then you might want to go read something else because this will bore you rigid]. In a nutshell…

• DNS: Maps a domain name to an IP address e.g. commonagency.com -> 94.136.61.118
  This is fundamental to every day use of the web in that it ensures when someone enters a domain name they get routed to the server from which that domain is served.
• Reverse DNS: Maps an IP address to a domain name e.g. 94.136.61.118 -> commonagency.com
  This is frequently used by email servers to validate that emails received from another email server IP address can be matched with a domain name that appears to correlate with the sender’s address [that's actually not exactly true but it's a simplistic explanation].
• FCrDNS: RDNS lookup followed by a DNS lookup e.g. 94.136.61.118 -> commonagency.com -> 94.136.61.118
  This is apparently the best approach and is now used by many email servers.

Why care? Well hopefully you won’t ever need to, but when a client calls to say that they can’t get emails through to one of their customers, these are the kind of things you learn. Usually you’ll have set-up your DNS/RDNS in such a way that FCrDNS works by default, and if not you can usually do it quite quickly. There’s a great tool at http://ipadmin.junkemailfilter.com/rdns.php which helps with testing. Basically, if you know that your RDNS is set-up correctly and that you’ve got some appropriate SPF records set-up too but you’re still finding some emails get blocked, check out your FCrDNS. And if nothing else, it’s another acronym that you didn’t know you didn’t know, but now do.

Hopefully no major surprises to web designers and developers in this 10 Usability Crimes You Really Shouldn’t Commit, except that one which I think is often ignored these days is maintaining a visual indicator for links that have already been visited. Often, from a visual perspective, having unvisited and visited text links appear in two different colours can look slightly untidy but it’s a valid point that the usability issue of not recognising that you’ve visited a link previously has a potentially greater negative impact on the user experience than the different colours.

Econsultancy’s article describes a handful of rules that many information-centric mobile sites would do well to learn from. The tips in Mobile news sites: best practice tips range from technical issues such as auto-redirection to the mobile site from the full website [if searching from mobile] through to content issues such as providing as much content as possible and allowing commenting. The article doesn’t dig much deeper than some introductory tips but it’s a good baseline to start from.

Something I’m often asked is “What’s the point of building a mobile-specific internet experience when many new phones have the capability to browse full websites?”. [Or even worse, people usually say "my iPhone" rather than "many new phones"]. I’m a strong believer that a mobile-specific service will always provide a better user experience than merely viewing a web-oriented one on a capable device. Even though there are a number of technical reasons to consider [connection speed, screen size, processor speed, lack of rich-media support, etc] there are far greater and more impacting user-focussed reasons, including user context, use of mobile enablers, stronger likelihood of task-oriented activity, appropriate interface design and navigation approaches. The summary from mobiThinking in The mobile Web is dead… Long live the mobile Internet explains some of the reasoning in more detail.

From Wordcamp Seattle, Eric Amundson’s 5 Free Ways to Bulletproof Your WordPress Site provides a great 5-minute video overview of areas to strengthen your Wordpress site, including security, usability and user experience. We’re already using many of his techniques but two new plugins I now have to investigate are WP Super Cache to enable cached HTML pages to be served instead of server-greedy dynamic ones, and Relevanssi which allows for relevance-based search results instead of the default chronological results that Wordpress generates by default.

Slightly more niche post than usual but when you’re working on a Friday night and pulling what limited hair you have out then surely it’s worth it. For much of today I found that if I clicked in some empty space in Textmate then instead of the cursor jumping to the last valid space - usually the end of line - it would just stay where I had clicked. Unless you’ve experienced this it is indescribable just how infuriating and unproductive this is. [If you don't believe me and actually want to experience it then follow the same steps as my 'solution' below]. Anyway, it turns out I’d somehow enabled ‘Freehand Mode’. This can be toggled on and off by going to Edit -> Mode -> Freehand Editing. Should you ever have this problem, look there first. Ideally before you pull all your hair out.

I enjoyed reading this 15 CSS Tricks That Must be Learned post and think it’s a valuable resource. Whilst I agree with some of the comments that none of the tricks are anything new [nor does the author claim them to be], there are so many CSS workarounds that experienced developers use daily, some of which are incrementally developed over time, that it’s often handy to have a visual refresher such as this  to remind ourselves why we apply such tricks. And any young pups out there for whom the tricks are still new could do a lot worse than to start with this set of essential but well-explained suite.

I love Android. It’s not quite as slick in certain areas as iPhone but overall, especially if your connected world revolves around Google, it’s a fantastic mobile platform and day-to-day experience. However, one thing that’s been scuppering me for the past few weeks since using an HTC Magic was that I couldn’t get MMS working on Orange UK. Despite checking out the usual forums [Modaco, Android Central, XDA Developers] I couldn’t get the correct settings. And then I came across ‘Android Bloke‘. Were there ever a more male, techie “I call a spade, a spade” name for a blog? Anyway, not only can he accurately title garden implements, he also has the magic [ahem] combination of APN settings for Orange. The trick that I hadn’t previously come across is the value to enter in the ‘APN Type’ field at the bottom of the APN Settings. Instead of a helpful dropdown with options [presumably because in theory some developers may like to create their own APN types], the field is just a text entry field, and hence didn’t know to enter ‘mms’. I can now send pictures of my children to their grandmother again.

I really enjoyed reading Carsonified’s recent article on 10 Vital Lessons for Web Start-Ups [received via Smashing Magazine]. It’s an excellent account from the guys behind the new[ish], lightweight Perch CMS regarding the challenges and learnings in launching their first full product outside of their web development day jobs. It’s undoubtedly something that many small agencies/developers also face, or hope to face [ourselves included]. If nothing else, the article itself demonstrates an excellent PR exercise as I remember looking at Perch when it was launched and feeling that, without a demo, it wasn’t something I could evaluate quickly and, typically, haven’t been back since. However, amongst other things, the article explains how quickly such short-comings were revised and overcome. Looks like I better head back there soon and check out the now available demo!

We’re on the brink of finishing our first ‘full’ iPhone application to be distributed through the Apple App Store, and as such have been trying to learn more about the obvious pitfalls to avoid in terms of having an app accepted. We’ve already had some excellent word of mouth advice, and general rule of thumb seems to be “follow Apple’s guidelines like a bible!”. The following sites seem a good start for your checlist too… Avoiding iPhone app rejection from Apple offers a good starting point for the things to run through, with a round-up of comments/replies. Unsurprisingly, Stackoverflow always has excellent developer advice and discussion, and they too are a good starting point for successful AppStore submission.

Obviously we’ll update our own experiences in a few weeks once we’ve been through the process ourselves.

Having just been working on a concept with a more dark theme than my instinctive slant towards light/spacious/clean web design, I can across this collection of inspirational black websites. Whether you find the collection inspirational or not, webdesign.fm have a range of colour-theme comparisons of websites which can offer inpiration in when you’re scratching your head. Though there’s nothing like getting up from your desk and getting some fresh air to help on that front.

Symbols are too easily overlooked in Fireworks. Although we’re used to using them all the time in Flash, it’s only recently become apparent how useful they are in Fireworks as, yet again, it proves how much more effective it is for web and interactive design than Photoshop. Symbols allow you to define a visual object once and then re-use it time and again, with the ability to modify each instance’s paramters whilst having a single master object in the library to update if needed. The obvious usage in interface mock-ups is for buttons but once you’ve grasped the concept it’s easy to use for logos, site-wide graphics, navigation elements, etc. Check out this excellent Adobe article to get started.

Fireworks is pretty much the most powerful tool in our box, enabling us to deliver everything from interactive wireframes through to fully design UI mock-ups. However, it wasn’t until recently that we started to dig a little deeper into it’s customisation potential, and it was a very pleasant surprise to find that with only a little Javascript you can create very powerful Fireworks extensions. Photoshop introduced ‘Actions’ many versions ago but they always felt a little clunky and only worth setting up if you had a lot of repetitive tasks to get through. However, with extensions it is much quicker and more flexible to consolidate a whole range of steps into one command, and vastly increase your productivity in the meantime. Check out the Adobe documentation Adobe documentation or this tutorial to get started. You won’t regret it when it avoids a thousand select/copy/paste/tweak/save tasks!

Note to Mac CS4 users: the place to put your saved extension files is:
Macintosh HD:Users:<User>:Library:Application Support:Adobe:Fireworks CS4:Commands

Anyone who’s developed mobile internet sites will know that one of the biggest issues affecting the download experience is the latency often experienced when communicating via the operator gateway. This often means that no matter how fast the connection, device or the server, a noticeable and often unavoidable delay is created. However, a method using Base64 encoding could be used to circumvent this problem by, in simple terms, defining what would have been an external resource [requiring a request] in the form of a text string that can be embedded within a single file [such as a CSS stylesheet] and subsequently understood and decoded by the browser. As is often the case of course, any such trick often leads to other side-effects to be wary of  - one such effect in this case being that of the browser cache limitations. However, in many scenarios, this method could introduce potentially significant experience enhancements to the overall page request time.

Highly pertinent in the current financial climate, this article on technical debt offers an interesting means of defining technical shortcomings as types of debt. Whether used to help discuss development issues with a client or as a means of assessing and ratifying development issues internally, with money on everyone’s mind it’s a very tangible means of comparing the scale and type of technical issue.

Whilst it’s not usually an issue, sometimes the dotted outline that is applied to links in their active state [e.g. the point when they're clicked] looks visually untidy - especially if you’re also using lots of padding or text-indent tricks to hide HTML text. The following article about removing the dotted outline is a great summary of how to overwrite this behaviour whilst also maintaining accessibility [a key reason for the active state in the first place].

Font-replacement methods for substituting text on-the-fly with a non web-safe font are widely used now. However, having had a few run-ins with the very popular Flash-based SIFR recently - either due to small glitches [especially Mac related] or simply due to it’s limitations in certain contexts [especially when used over backgrounds that are not solid colour] - we’ve been looking at other options. As a lightweight solution, PCDTR seems to be one of the best image-based alternatives due to it being purely PHP and CSS based [e.g. no Javascript] and we’ll be putting this through it’s paces in a forthcoming project.

I had a quick need to try some CSS styled bar charts to demonstrate a very rough prototype idea and this article on 8 CSS Techniques for Charting Data came in very handy. I can’t vouch for the long-term effectiveness, robustness or flexibility of any of the techniques but as a starting point for your own methods it’s a helpful start [if not rocket science by any means].

As an average mobile user, you walk into a shop, buy a phone and come out with it all nicely set-up. If you’re a mobile professional or developer however you’ll frequently have had to set-up a phone from scratch or possibly change the settings to those of another network. I can’t imagine how many times I’ve used the GPRS information and UK settings on the filesaveas site but they have saved me time over and over again when settings up the 3G/data settings for a phone.

Web developers and designers using Mac OSX should check out the Hex Color Picker extension which adds an extra method for working with colours right at an OS level. The result is that all apps which use the standard OSX colour picker [yes, the one with the option to pick colours from a selection of crayons] benefit from an extra tab that allows you to use web style hex values such as #ff0000 [for red].

One thing missing from the OSX finder is the ability to toggle hidden files. If you’re a web developer you’ll have conctinual need to access hidden files such as .htaccess or .svn, but equally you may not want to make every Finder view look so untidy. Sure, you can use Terminal to enable/disable hidden files but sometimes you just want quick access to something you know is there but can’t see it. Well, this application appears to do just that. I’ve only just installed it so I can’t vouch for it’s long term usage but for now it offers exactly what I needed - a button on the Finder toolbar to toggle the visibility of hidden files.

Before reading this I’d already installed 1-6 of Wired’s 10 Most Awesome iPhone Apps of 2008 and was using Tweetie as my preferred Twitter app so either I’m very common or this is genuinely one of the better iPhone app round-ups. Of the one’s I’ve not used, NetShare sounds good - a feature I used previously for free on Windows Mobile. I’d also add a great little puzzle game called Subway Shuffle which I’ve used to occupy many a train journey.

There’s some interesting mobile and wireless predictions for 2009 on the mTrends site, ranging from how virtual goods and mPayments will rocket to the possibility of Apple bringing it’s iPhone success to the Nano end of their range.

No, that’s not the latest Wii accessory but a reference to the apparent requirement for every man and his dog to predict the big technology issues for 2009. I don’t think anyone ever comes back to these things and says, “Hey, you were miles off!”, but if you miraculously haven’t come across such articles earlier then have a read about robotics and business in Silicon Valley, the big steps in gaming, more robotics and music players.

Instead of predicting what might be big in ‘09, Wired magazine looks back at ‘08 and offers an excellent summary of the top 6 technologies to get into if you haven’t already.

This simple CSS Shorthand Guide produced by Dustin Diaz is an invaluable resource and makes for good practice in streamlining your CSS code.

MooTools is our preferred JavaScript effects/extension library, not least because of it’s easy extensibility - as demonstrated by a wealth of 3rd party extension scripts that are available. We haven’t used all these but this round-up is a handy starter.

As a designer with all those screen-hungry design apps, a mail program, a couple of browsers, file windows, text editor, etc all open at once, you can quickly lose your mind. Spaces - the multiple desktops feature in Mac OS X [borrowed from Linux I think] - is invaluable to solving this problem, allowing for a much more structured working environment. However, sometimes when moving between a dual-display and single-display set-up Spaces stops working and if you’ve become dependent on it you’ll suddenly feel shackled. However, before reaching for the “Restart” button, try this…

1. Open the Terminal.
2. Type ‘killall Dock’.
3. Spaces should come back to life.