Archives For Web Design

Skills Deep Dive

Steve —  3.10.2015 — Leave a comment

Work
I wanted to provide a deeper dive into what I’ve been learning over the past decade or so. For a resume and social media – head over HERE.

As a natural problem-solver, my exposure to and understanding of technology and the Internet have provided the context to add value to almost any related topic on multiple levels. The chart below outlines the various categories of expertise and an associated level of experience. These levels range from the following:

MORE »

Servants By Design
The long wait is over.

Way before I knew anything about building websites, I was introduced to something that has changed my life. An instrument used in the hands of the Almighty to teach me about who He made me and provide small glimpses into what I was put on this earth to do.

It’s called Servants by Design – a personality profiling system from Transpersonal Technologies, LLC that, like no other, predicts how we will behave under stress as well as normal conditions. This system is based on over 30 years of research and has been validated in all sectors of life.

It has been used to build NASA teams (it was the reason Chuck Yeager never got into space) as well as educational classrooms to help teachers profile their class to improve communication. It has applications in marriage, parenting and teamwork. And now, its online thanks to a great many contributors including yours truly.

MORE »

Tukey Hunt II

Steve —  12.7.2011 — 2 Comments

Turkey Hunt II
I thought it might be a good idea to document the second annual Turkey Hunt – a scavenger hunt meets Geo-caching meets family fun activity I developed last year and decided to continue again this year. I knew that I had to at least maintain the level of complexity to fun ratio that we all had last year, but I was really trying to do better. I’ll let you be the judge…

The participants were my brother and his family and my family – not even my wife was privy to the workings of the Hunt, which meant she could play right along. We also had to do this on Friday night after the Arkansas vs. LSU game (we won’t go into detail on this subject) because Saturday was supposed to be rainy all day. Luckily, I planned for rain.

This year started with three anonymous texts to my wife, brother and his wife. Each with one word each that when you put them together kicked off the Hunt officially. The words were UNDER, WELCOME, MAT. There they found an envelope with a letter stating the Hunt was now underway should they want to play.

MORE »

SWFObject

SWFObject has been around since October 2004 as a JavaScript method to detect not only the presence of the Flash Player, but minor versions of the Flash Player for feature readiness. Since then, it’s evolution has continued to add features that cover today’s ever-increasing code complexities. To get the SWFOjbect code as well as all other resources for this very useful tool, head over to http://code.google.com/p/swfobject/

As I stated in the overview article, this is my preferred method for Flash detection for the iPhone. This method is used on all of your SWFs and therefore inherently takes care of all detection and alternate content substitutions as part of the solution. In short, it’s simpler.

Obviously, the first thing to do is download the code and get it on your site. There are great instructions on the Google site on how to setup the include files and you also get some demo files that show how your code should look when using either the static or dynamic method.

I used hyper-linked images that looked similar to the Flash content as the alternate content so visually, there wasn’t much missing. Other than that, there isn’t much to it other than following the instructions and choosing the method that suits your content and situation better. There will probably be some trial and error that you’ll need to go through, but given an hour, you should have it just like you want it.

Here’s the JavaScript code on my example site (put inside <head> tag):

<script type=”text/javascript” src=”/Scripts/swfobject.js”></script> //the include JavaScript file
<!–Button 1 Code–>
<script type=”text/javascript”>
var flashvars = {};
var params = {};
params.wmode = “transparent”; //sets the SWF file to have a transparent background. Default is “opaque”
var attributes = {};
swfobject.embedSWF(“/assets/multimedia/PTT_Button1.swf”, “myContent1”, “174”, “40”, “9.0.0”, “”,  flashvars, params, attributes);
</script>
<!–Button 2 Code–>
<script type=”text/javascript”>
var flashvars = {};
var params = {};
params.wmode = “transparent”;
var attributes = {};
swfobject.embedSWF(“assets/multimedia/PTT_Button2.swf”, “myContent2”, “174”, “40”, “9.0.0”, “”,  flashvars, params, attributes);
</script>

And the associated content code (alternate content defined):

<!–Button 1–>
<div id=”myContent1″><a href=”html/FindTip.asp” style=”padding:4px”><img src=”assets/images/PTT_Button1.jpg” alt=”Defeat the Diaper | Find a Tip” width=”174″ height=”40″ border=”0″></a></div>

<!–Button 2–>
<div id=”myContent2″><a href=”html/GiveTip.asp”><img src=”assets/images/PTT_Button2.jpg” alt=”Defeat the Diaper | Give a Tip” width=”174″ height=”40″ border=”0″></a></div>

Given that, there is one piece of advice I can give:
Make sure you enclose the content you want SWFObject to examine in <div> tags. For those of you that code using tables, don’t try to affect a <td> as the SWFObject’s default behavior is to hide the element and this will destroy the table’s structural integrity and therefore produce undesired results.

For an example of a site that this method has been used, you can go to defeatthediaper.com – my community potty training tip site. I hope this helps and don’t forget to add the <meta> and CSS mods outlined in the overview article.

Flash Detection

When you publish your Flash content, you have the option of publishing HTML and in the associated option for HTML publishing, there are several check-boxes related to which version of the Flash Player you want to target and whether or not you want the resultant HTML to check for the presence of the specified version or above. FIG. 1 shows what you would check to get the HTML file that checks for the presence of a version of the Flash Player.

FIG. 1
Flash Settings

Provided you check the box shown in the figure and publish your content, you’ll get an HTML file that has the detection code in it. As you examine the code, you’ll see that the detection script looks for a specific minimal version of the Flash Player, not just the presence of the Flash Player. So, the detection script can “fail” for two reasons: 1) An insufficient version or 2) the absence of the Flash Player altogether.

Therefore it is a good practice to include the GetFlashPlayer icon linked to Adobe’s site in case they were sent to this page because of a version problem and not the absence of the Flash Player. I guess you could use the CSS mod outlined in the overview article to hide a <div> tag that includes the icon if you don’t want your iPhone users to see something they can’t act on.

The next step is to copy all of the detection code including the conditions to another HTML page and save it as the site’s default page – typically index.htm or default.htm. From there you can send your users to either the regular home page (successful detection) or an alternate page (failed detection). The alternate page is where you can customize an image-based version of the home page that can be seen by mobile browsers that don’t support the Flash Player as well as explain why they were sent there.

I then went a step further and set a session variable and checked it on every other page on the site that had Flash content so I could either substitute alternate content or hide the Flash content altogether. This has an inherent problem as the session will at some point time out and if the iPhone user closes Safari and comes back, they could be faced with a site that doesn’t know they are a non-Flash user.

To overcome this, you could call a modified version of the Flash Detection script on each of those pages that resets the session variable if the detection fails, but that starts to get pretty cumbersome and is why I eventually went to the SWFObject route. You can read about that method in THIS POST.

To see a site that uses this method, go to www.americanpiepizza.net – a Central Arkansas pizza joint with a killer menu.