web

  • July 12, 2013

    Testing your Responsive Site

    Over the last year or so I’ve been involved with a few major projects that required responsive design/development. One of the most important things to remember about a responsive design is that it’s not just good enough to make sure your design shrinks with a smaller browser on your computer. Presumably, you’re doing this because people will be accessing your website on mobile devices. Therefore, you have to do device testing! In this post I will outline what I think is proper testing practice.

    Device Testing

    I know this can be difficult since not everyone can get their hands on a wealth of devices. You may be lucky enough to be close to an Open Device Lab, but if not, you should try your best. Note: If you’re an “agency” or a “firm” that’s advertising being skilled in RWD, you need to pony up and buy the devices. RWD isn’t just a buzzword and it should be done right.

    • iPhone 4, 5
    • iPad 2 or new iPad
    • Android 4.0+ Phones: Galaxy Nexus, Galaxy Note II, S3 or S4, Droid Incredible (one of them), Droid DNA or Razor Maxx
    • Android pre-4.0 Phones:  Moto DroidX, Evo4G
    • Android Tablets: Nexus 7, 10, Samsung Galaxy Note 10, Galaxy Tab 8.9, Kindle Fire, Moto XOOM
    • At least one Blackberry (Q10, Z10)
    • At least one Windows Phone (Lumia or HTC 8x)
    • For fun: a Kindle or some other eReader

    Of-course, do this at your discretion and based on your own analytics. If 0% of your users are using Gingerbread, pre-4.0 phones might not be an issue for you. My list for Android device testing is based on some cursory stat-searching, including LifeHacker’s most common phones and stats directly from Google, which you can view on the Android Dashboards page (these update in real(ish) time).  Finally, when it comes to RWD, device testing isn’t the only aspect. You also need to consider speed.

    lifehacker-android

    @brad_frost did a guide a while back on how to cheaply get real devices to test on. You can also check out Swappa for second hand devices.

    Browser Testing

    This should be nothing new, but with the whole host of new devices, it might be worth while to check out these browsers now:

    • The device’s native browser (Safari, Browser, etc)
    • Chrome on Android and iOS
    • Mobile Opera
    • Dolphin
    • Mobile Firefox

    Also, make sure to test in IE 8,9, and 10! If you take a Mobile First! approach, keep in mind that IE8 does not support media queries.

    Speed Testing

    You cannot assume that everyone will have your great 70mbps connection (that’s a real max speed for me). People could be getting less than 1mbps at times, and that’s terrible if your site is huge. I would recommend testing on:

    • Broadband (wired or wifi connection)
    • 4G (on multiple carriers if possible)
    • 3G (on multiple carriers if possible)
    • 4G and 3G while traveling

     Wrapping Up

    I understand that this can be cumbersome and cause a lot of work, and admittedly I haven’t been as diligent as I should be either. There are, however, way you can do this sort of testing without breaking the bank. Aside from what Brad mentions, you can do things like an open or closed beta, inviting people with different devices and connections to test on their devices and report back. I will generally have my friends and co-workers test designs for me. Or hey, you could always start an open device lab ;-)

    What kind of testing for RWD do you do?

  • July 9, 2013

    Some Interesting Links & Podcasts

    I just started listening to podcasts regularly so I figured I’d share some of them, as well as your normal cool links.

    Stuff You Should Know: A podcast from How Stuff Works about general knowledge stuff that covers a wide range of topics from Bitcoin to Torture. Very interesting stuff!

    Stuff You Missed in History Class: Another podcast from How Stuff Works that covers topics you may have not learned about in school.

    ALA’s 2013 Summer Reading List: @alistapart is the best source on the web for web development and design articles. This is their recommended reading list.

    Yesterland – Tobacco Shop: In looking for a cigar shop around Disneyland, I came across this interesting bit of history regarding Main Street USA in Magic Kingdom Disneyland. This talks about the Tobacco Shop, one of the first shops in the strip.

    How to not be Alone: A really interesting article from @nytimes about how technology affects us. My favorite quote: Technology celebrates connectedness, but encourages retreat. 

    The Missing Linc’s Doctor Who Viewing Guide – Series 1: I recently started watching Doctor Who. My friend Joe (@iammissinglinc) created this nifty viewer’s guide to help you learn what’s what!

  • July 8, 2013

    The Mobile Web App Developer’s Dilemma

    I’m currently sitting on an Amtrak train from NY Penn to Exton, PA (the Philly-ish area). The ticket taker was coming by on his nifty device scanning tickets, which would then check a database of purchased tickets to confirm the purchase and the identity of the purchaser. However, when we hit a tunnel (and therefore no data connection), the device stopped working; any scans returned “Ticket not found.” You would think that whoever developed this system for a subway/train company would have considered that at times there might not be a data connection, but that didn’t seem to be the case. This is a bit of a dilemma for anyone developing apps for mobile.

    (more…)

  • June 20, 2013

    Web Development Resources, Summer 2013

    I have a ton of bookmark folders to help keep myself organized, though to be honest I usually bookmark something and then forget about it. So, while looking through some of my folders, I can across a good amount of web development resources I’ve been keeping. I’ve decided to share them.

    (more…)

  • June 14, 2013

    Interesting Links for Friday

    The Offline Glass: This is fantastic. A glass that will only stand up if a cell phone is under it. This is needed in all bars.

    Google Robot helps boy throw out first pitch: This is ridiculous and amazing. Google is doing things that are truly changing the world. And the story isn’t too bad either 😉

    8 Months in Microsoft, I Learned These: This is a post by a kid out of college and working at Microsoft. It’s a little scary, the disparity between what you’re taught and what happens in the “real world.” Some of these things are understandable, but some are outright wrong.

    Connecting Custom Post Types: I gave this talk twice this week. Here are the slides and resources.

    The Missing Linc’s E3 Coverage: Over at my friend Joe’s blog there is fantastic coverage of the E3. You should definitely check it out!

    Also announced this week: iOS7 and PS4. I may do bigger write-ups on these, but my initial thoughts are that:

    • iOS7 looks really nice, if not incredibly familiar (*cough Android* *cough Windows Metro*)
    • PS4 is doing it right. It’s like they took away everything everyone complained about regarding the Xbox One and removed it. It looks like they’ve also learned a lot since the launch of the PS3.
    • I have a theory about 3rd gen consoles with the announcement of the Xbox One; it’s a lot like a musician’s sophomore slump. The Xbox 360 is incredible and Microsoft seems to miss the mark (despite my defense of them a couple of weeks ago).

  • November 20, 2012

    My Slides from PABUG 2012

    Here you go! My slides from my talk, “Using PHP to Create a Web-­Based Mobile Banner Application” from @PA_BUG are available for download (links to my Public Dropbox folder). There is also a link to our current mobile app.  Thanks to everyone who came out, and to PABUG for having me!

    If you have any questions or comments/please email me at joseph.casabona@scranton.edu.

  • January 25, 2011

    Manifest Development Redesign 2011: The Homepage

    [singlepic id=7 w=320 h=240 float=right] Last week I launched a redesign of my freelance site, Manifest Development. I started developing it in late November, and wanted to revamp the site completely from design to content. I got some feedback from my students during one class when we were talking about the importance of a small business’ website, and I wanted to integrate that, as well as some of the new things I learned over the last two years. I’m planning on making this a multipart series, and in today’s installment, I want to talk about the most important part of a website: The Homepage.

    (more…)