Arranged Delirium

Now that Adobe has finally abandoned Flash and embraced HTML5 it’s producing a number of tools to facilitate development. I think we’ll be going through a period of time where we’re waiting for the dust to settle, but there are a number of interesting tools to explore while waiting. First, Adobe bought out Nimblekit and wrapped PhoneGap into Dreamweaver so you can compile mobile apps developed in HTML5. It’s a good approach, and makes Dreamweaver even more useful - but it continues to add to the bloat of that application (meaning that DW is essentially a software development platform and not as useful for small projects). That’s all good if you know what you are doing, but if (like my students) you are just learnign how to do some of these things, it’s not the best tool.

I am excited though about Shadow, which is a new tool on Adobe Labs that lets you view your HTML5 development on multiple devices. As it matures, this could be a versatile tool. On of the challenges I’ve noticed in my own web/mobile development is that it’s much easier to write new code that runs well on all platforms than to try and go back and re-tool older code that I wrote years ago. Shadow can make it easier to see how those new designs will look on multiple devices.

If you are into this stuff, you might also be interested in Edge (essentially a timeline-based animation tool). This would give you a good idea of where to go now that Flash is dead.

Students in web design are creating (possibly) a new web site for the ITL department. But one thing that is always important to me is making sure that everyone know how to publish email links without just putting them out there for spam-bots to harvest. There are all sorts of complicated ways to prevent this; but there are also some very simple ways that can limit the nefarious spam industry. Here are the simple ones in order of complexity:

1) You simply use the [amp#64;] character instead of the @ sign in your code. This is quite easy; but there are numerous email harvesting spiders that can reconstruct this, so the amount of protection is very minimal.

2) You could also use characters or even type the address differently to obfuscate the address: name (at) washjeff _dot_ edu. This works a bit better, but depending on the formulae, most of these have been cracked; and from a user-interface perspective it can create effort on the part of the sender. This is a less than ideal solution if you actually want people to contact you. Plus, its pretty easy to de-munge.

3) In your code you could replace the actual text with hex values for the characters. This provides a bit more protection that the steps above, but there are still bots that can crack it. That being said, unless you are attracting spammers, it’s probably enough protection. Most certainly, it’s better than nothing! You can find tools online that will generate this for you. This is probably the course of action that you want to take if you are avoiding javascript.

4) You can use javascript to obfuscate the email address. As long as users have javascript enabled, they will see a clickable email address, but the bots will encounter javascript. It’s only a matter of time until this process becomes less effective; but thus far it still works well for me and the organizations I’ve done development for. I use the online tool Enkoder to generate the javascript for me. Supper-easy.

Of course there are better ways to do this - you could create a form, use captchas (annoying), or use a php script to protect email addresses. But truthfully, the javascript method works well enough unless you are being targeted and it is much better than just posting the email address out there where anyone can see it. Publicly broadcasting email addresses is a sure indicator of novice development - you don’t want to do it.

Adobe appears to have thrown in the towel recently regarding flash development - at least for mobile devices. Reuters has an good article on the topic here. This clears most of the remaining barrier for the broad-based acceptance of HTML 5 as the development platform of choice for web development and web-based mobile apps.

This really shouldn’t be too surprising. Adobe has updated Dreamweaver in version 5.5 to be a viable mobile app development platform, and it’s bought out other text editors that might have fulfilled a significant competitive role. This does however make the forthcoming Adobe Edge product more appealing as well. In combination with the PhoneGap API libraries that you can access through Dreamweaver, this tool could enable app creators to include a significant amount of interactivity.

Students in ITL 275: Web Design and Development are developing a new site for the ITL department here at W&J. Part of the process includes determining the audience and identifying who you are trying to serve. This seems like a good point to remind everyone of NetMarketShare which hosts monthly breakdowns of web content access by device and platform:

Some interesting notes - IE still makes up over 50% of desktop browsers. This isn’t as horrible as it once was, since both IE8 and IE9 are acceptable browsers; but 13% of users are still employing IE6 and IE7, meaning that there’s a whole lot of content that they can’t get to unless the developers are conscientious enough to query for the browser version and push out a different stylesheet.

Another resource for students is the Web Style Guide (2nd). Ignore the third edition - it goes too far afield for the work we’ll do this term.

I’m always telling my students not to plan on Flash as the sole tool for web animations, and I think they are always hesitant to believe me. But as I move toward implementing HTML 5 in my web development courses, I don’t see any reason not to abandon Flash altogether for the types of things we do. (And, I would argue that most folks developing Flash content do not use its full set of capabilities.) Anyway, I’ve been looking at Hype as a potential tool for creating simple web animations that will work on all devices. Check it out!