nathanchase.com

The portfolio, resume, and blog of Nathan Chase

Archive for the ‘Design’ Category

I recently started a Twitter discussion with Chris Coyier of CSS-Tricks on the relevance and usefulness of the <small> tag. I’ve had this same debate with co-workers on why one would still use <small> over just using a <p> or <span> with an appropriate <class> or <id> to define the “smallness” of the tag. The one thing we both noticed is that no one uses the <big> tag anymore, so why should anyone use the <small> tag? This seems to be only the tip of the iceberg when it comes to determining which element to use for an intended result. Let’s look at a few more instances of controversy in the realm of standards and semantics on the web.

(more…)

IETester - The Ultimate Web Test Suite

Ever wished you had one place to test your web designs in all browsers easily? Well thanks to IETester, it’s now possible to check your work in IE 6, IE 7, IE 8 Beta (and even IE 5.5 for anyone still living in the year 2000). It’s still in alpha, so it has occasional crashes, hiccups, and limited browsing functions. In spite of this, the app in its current release is already incredibly useful. The developer has a forum set up for feedback and bug reporting as well which should hopefully keep the project moving forward.

With IETester combined with VMWare Fusion, I can now test my work on my Intel Mac in Internet Explorer, Safari, and Firefox without having to resort to remoting to other machines, using slower web-based visual checks, or using Virtual PC to test multiple IE versions anymore. It’s a fantastic setup.

Now if only there were conditional comments, and a version of Firebug for IE and Safari… Hey, a web designer can dream, right?

Blogger Labels

I just discovered the relatively new Labels feature of Blogger and I’ve been going through the archived posts and tagging them all with relevant labels. It very neatly auto-creates all the label pages and collects all the posts that reference that particular label. Very cool stuff. I’ll be setting up a labels list in the sidebar for easy searching through topics shortly.

UPDATE: Apparently since I have an old Blogger template I am unable to add the labels list to my sidebar. Rats!

  • 0 Comments
  • Filed under: Design, The Web
  • Konami Code Captcha System

    I came across an article on Digg about an alternative way of showing a captcha using pictures of kittens. This got my brain thinking on how would I devise a better captcha.

    My solution is this:

    What about putting a sequence of UP, LEFT, RIGHT, and DOWN arrows over a grid pattern. Then the user would just push the arrow keys in the sequence shown. All of the angles would be impossible for a computer to decipher what combination would work - but a human could distinguish the arrows and press accordingly.

    It would be like entering the Contra code as a captcha.

    This would also work on keyboards worldwide, as non-western keyboards might have characters outside of the English alphabet - but all keyboards have arrow keys (as far as I’m aware).

    This doesn’t solve the issue of accessibility for the blind however that all captcha’s suffer from. The best solution I’ve found is an audio file that reads off what’s visually shown. This presents another issue - what language would it be read in? What if you are blind and deaf? What if you have no keyboard? At what point do you stop?

    A truly worldwide, accessible captcha - Is it possible?

    Poetic Rage Clothing


    A clothing fashion website I’ve been working on has just launched.
    Take a look at their military inspired designs.

    Poetic Rage Clothing, Co.

  • 1 Comment
  • Filed under: Design
  • Microsoft Sparkle


    The first thing I thought of concerning Sparkle is customer support. If we design a site using Sparkle, and our customers visit the site, what sort of experience will they have if they don’t have Windows Vista? Imagine a Mac user on Safari. Or a Linux user? They will have no way to view the content. The app will just break.

    Alternately, you would have to point those users (XP, Mac, Linux) to a special download of an altered or limited version of Avalon made for those platforms. It seems that downloading something with that large of a graphic framework would not be as simple as a Flash Player download.

    You would download probably a 60MB+ file (just a guess) and then after install have to reboot before you can view the content. That’s a journey that nearly any non-computer savvy customer will not be willing to take. And most companies, large or small, would be hesitant to help them through.

    Right now we can do a LOT with the Flash Player using the tools Macromedia provides, and a new install takes seconds, and without a reboot if users don’t happen to have it. In my mind, Sparkle’s features will be the best thing ever to hit application development for Windows Vista and future platforms. But for the web, Sparkle has a lot of limitations compared to Flash’s cross-platform ubiquity.

    Flash-based Amazon.com Album Art Sidebar Widget

    Well I dove headfirst into some Flash programming this weekend and came out with a success. Now I know this is probably not the most efficient way, correct way, or best way to do this, but it got my XML parsing chops up, and I learned how to tap into the Amazon API while creating it. I’m stoked at the result.

    What it’s doing is it’s taking my last played song’s Album Title and Artist Name (thanks to Audioscrobbler/last.fm) and sending it along to Amazon as a keyword search. Amazon then gives back an XML file with the results, and then my Flash app parses the XML and finds the node with the CD cover that matches the keyword’s search results. So if you look over there in the sidebar, you’ll see that the cover appears as it would show on Amazon. Pretty neat huh?

    And here’s the code, if any Flash junkies want to see what I was working on. If you have any questions about it, email me or hit me up on IM. I still have to add something if there is no image available, and maybe try another service (Google, AllMusic) if Amazon comes up short.

    // Allow this Flash app to show the loaded images consistently from the remote server, images.amazon.comSystem.security.allowDomain("http://images.amazon.com");////var audioscrobblerURL = "http://ws.audioscrobbler.com/rdf/history/[YOURPROFILENAMEHERE]";var audioscrobblerReply_xml:XML = new XML();audioscrobblerReply_xml.ignoreWhite = true;audioscrobblerReply_xml.onLoad = function(success) { if (success) {  //  trace(audioscrobblerReply_xml);  processAudioScrobblerXML(audioscrobblerReply_xml); } else {  trace("error loading"); }};audioscrobblerReply_xml.load(audioscrobblerURL);function processAudioScrobblerXML(audioscrobbler_xml) { audioscrobblerArtistTitle = audioscrobbler_xml.firstChild.firstChild.nextSibling.firstChild.nextSibling.nextSibling.nextSibling.nextSibling.nextSibling.firstChild.firstChild.firstChild; trace(audioscrobblerArtistTitle); audioscrobblerAlbumTitle = audioscrobbler_xml.firstChild.firstChild.nextSibling.firstChild.nextSibling.nextSibling.nextSibling.nextSibling.nextSibling.nextSibling.firstChild.firstChild.firstChild; trace(audioscrobblerAlbumTitle); // set the standard Amazon URL var amazonURL = "http://webservices.amazon.com/onca/xml?Service=AWSECommerceService&amp;SubscriptionId=[YOURDEVIDHERE]&amp;Operation=ItemSearch&amp;Keywords="; var urlEnd = "&amp;SearchIndex=Music&amp;ResponseGroup=Images"; var keyword = audioscrobblerAlbumTitle+" "+audioscrobblerArtistTitle; // create new XML var amazonReply_xml:XML = new XML(); // ignore the whitespace amazonReply_xml.ignoreWhite = true; // trace the returned XML and process it amazonReply_xml.onLoad = function(success) {  // trace(amazonReply_xml);  if (success) {   processXML(amazonReply_xml);  }  error = "error loading"; }; // send off the URL to pull back the new XML data from Amazon (note variable "keyword" comes from textfield on stage) amazonReply_xml.load(amazonURL+keyword+urlEnd); // create the function of processing the returned XML function processXML(amazon_xml) {  // amazon_xml is now a reference to the XML  // object where information is stored  // trace(amazon_xml.firstChild.firstChild.nextSibling.firstChild.nextSibling.nextSibling.nextSibling.firstChild.nextSibling.nextSibling.nextSibling.firstChild.firstChild);  albumCoverURL = amazon_xml.firstChild.firstChild.nextSibling.firstChild.nextSibling.nextSibling.nextSibling.firstChild.nextSibling.nextSibling.firstChild.firstChild;  //load CD Cover image into movieclip on stage  imageHolder.loadMovie(albumCoverURL); }}

    Xbox 360 Unveiling


    Although the MTV special was quite possibly the worst unveiling of a product ever, it looks like the design team got everything right on this one.

    About Me

    Nathan Chase

    I am:

    • living in Winter Garden, Florida
    • a web & print designer
    • a multimedia professional
    • an online culture and social networking enthusiast
    • a proud father
    • an avid PC and console gamer
    • an incessant movie watcher
    • known for an eclectic musical taste
    • periodically avoiding being shot by paintballs
    • often writing and performing music - on the drums, guitar, piano, or computer

    Most Popular Posts


    Projects


    Friends


    Family


    Wishlists


    Affectivities


    Bands I've Played In


    My Songs & Remixes


    nathanchase.com Tags



    Categories


    Archives