Dan’s our web programmer-in-chief, specializing in “back end” systems like Apoxe, our own custom content management system. He’s also a pretty funny guy – if anyone could make “trends in web programming” interesting, it’s Dan.

Email Dan | Read Full Bio

Programming Challenges are With Me Everywhere I Go

image_712016 is shaping up to be a big year in the life cycle of Apoxe.   After letting some competing technologies battle for supremacy its time to re-evaluate the winners, methods, and techniques and vet them against core fundamentals of what Apoxe is so that it can move to the next level.

Taking Apoxe down to the studs so to speak has me excited and anxious to get in there and get geeky.  This reminded me of an article I read a few years ago by Joel Lee that I feel is still relevant and at least for me – reaffirms that I’ve chosen the right profession.  If any aspiring programmers are reading this, I highly recommend you take the time to let the following points sink in.  Its ok, I’ll wait… http://www.makeuseof.com/tag/6-signs-meant-programmer/

Each point made in his article about why you shouldn’t be a programmer rings true for me on some level.  For example, the first point “You Lack Experimental Creativity” made me chuckle because I can think of a few times that I spent hours coding, only to scrap it later because some revolutionary thought came to me later in the day.  I wasn’t that sad to scrap it, instead I was excited to try a different approach.   Or, You Want Normal Work Hours.   Just this past holiday season I was on the couch programming away ideas for Apoxe while kids were watching TV, and I found it very relaxing. Even in church I may have wondered from the sermon thinking about a lingering problem I wanted to solve.  Programming challenges are with me everywhere I go, and most of the time, I’m OK with that.

As I approach 16 years with TKG, and 20 years (holy crap) since building my first websites –  I feel lucky that challenges that got me hooked on programming and web development have been replaced with new challenges to continue to grow – and that the thought of getting in there to solve them continues to motivate me.

Image Credit

Life with Microsoft Edge

Let’s just get this out of the way.  Microsoft cannot make a browser that satisfies everyone.  If you remember a few months ago, I wrote about how the excitement around IE’s demise at the hands of a brand new browser was losing its appeal to me.   At that time a look at the touted new features and work Microsoft had put into IE over the last few years left me feeling ‘meh’ about Edge.

Windows 10 has been out for a little over a month now and as promised, Edge is front and center.  Technically it does what a browser is supposed to do – show you a webpage.  Its rendering feels snappy and its minimal interface falls in line with what other browsers are doing. Actually trying to use it however seems like it is a very 1.0 release to me.   Refinements found in more mature browsers are missing, and in some ways it actually falls short when compared to IE.

Let’s start with my biggest annoyance.  As a web developer, I often times have to copy/paste part of the address for a task. To do this, I simply put my cursor where I want to start, and click.  If I needed “/web-development-portfolio” below, I’d put my cursor at the ‘/’

microsoft1

So, what happens when I do that? Edge suddenly fills in a lot more of the URL and my cursor isn’t where I intended. The start of the highlight below shows where my cursor was after the click.

microsoft2

Next, I rely on “Home” to get me back to some starting pages I need often through the day.   See the address bar image above?  Do you see a home icon? Nope, it’s not there by default.   Granted, you can turn it on under the hidden ‘Advanced Settings’ but it’s pretty well buried for people like my dad so I’ll get the tech support phone call when he finally moves to 10.    Ok, so it’s turned on – you would expect it to take you back to the page or group of pages define in the “Open with” settings, right?   Wrong, you get a single URL option that is different from what you see when you first open the browser.

microsoft3Speaking of the Open With setting, which defines what you see when you start Edge, what a cheap ploy by Microsoft to get traffic to their online properties. MSN and Bing both get top billing for the ‘specific page or pages’ option with a sort of cryptic “Custom” option that allows you to enter a URL 1 at a time for multiple tabs.   I know this labeling of “Custom” will be another phone call from Dad.

Finally, remember Cortana – Microsoft’s digital personal assistant?  As I mentioned last time, it felt like Microsoft knew they had a hit, so they decided to put her into every nook and cranny if it made sense or not.   To find her, you highlight text on a page, right click and choose “Ask Cortana”   Below shows her response to my selection of “CMS” on a certain web development company’s website.   “Centers for Medicare and Medicaid Services?   “Food and Drug Administration”?  Thanks, Cortana.

Why isn’t the fact that I’m on TKG.com, which Bing knows as a web-development website, taken into consideration for Cortana’s response?  I would expect then to see information about “Content Management Systems” which would be helpful in the context of the site I’m currently on.

microsoft4

I tried, really I did, for a week or so to make Edge my default browser.  In the end it just has too many rough edges and no compelling reasons to stick to it.  For now it’s back to the dynamic duo of Google Chrome and Internet Explorer as my browsers of choice.

Fading Excitement over Microsoft’s New Web Browser

My excitement over Microsoft’s new browser, Edge, is rapidly disappearing as more and more details emerge.

Originally billed as a replacement for Internet Explorer, Microsoft introduced some potential (and since removed) confusion when it announced that the browsing experience in Windows 10 would default to the new rendering engine and ‘auto-roll’ over to the IE engine when it detected legacy code. So basically, one browser with two hearts. Fortunately, the masses have convinced Microsoft to make a stand alone browser on the new engine, and leave IE alone to die in piece. Or have they?

I believe the driving factor behind a new browser is simply marketing. You see the IE team really has made drastic improvements to the browser over the last few versions. The problem is, no one cares.  IE’s image is tainted with the horrific days of IE 6,7 and 8, and no amount of work to make 9,10 and 11 ‘modern’ has been able to shed that negative reputation. So what is the answer to win back market share from competitors? A new browser.

Rather than going back to the drawing board and evaluating “today’s web,” Microsoft has taken the heart of IE, the Trident rendering engine, and rebranded it as “EdgeHTML.” Don’t get me wrong, there are improvements to the new browser, but I’d bet those improvements could have been packaged as IE 12.

Microsoft’s marketing for this new browser, Edge, is gimmicky and reminds me of “Web Slices” and “Accelerators” from IE8.  Don’t know what “Web Slices” and “Accelerators” are? That’s because they weren’t useful, and no one adopted them.  From microsoft.com:

Accelerators. Accelerators give people easy access to the online services they care about most from any page they visit. Meanwhile, developers gain an easy way to extend the reach of their online services. Accelerators also allow users to browse faster by eliminating most of the clicks required to access desired content and services.
Web Slices. With Web Slices, people can see the information they want to see most often without going away from the page they are on, and developers can mark parts of Web pages as Web Slices and enable users to easily monitor the information they most frequently browse to, all while they move about the Web. Web Slices appear in the Favorites bar, where people can identify updated sites when in bold. From there, they can see a rich Web Slice visualization of their content with easy access back to the source Web page.

The touted features front and center on Microsoft’s new web browser, Edge, are “Inking” and are you ready“Cortana.” Inking is the ability to take notes over the content of a webpage, but seriously, how often have you needed to do this? Then there’s Cortana, Microsoft’s digital assistant, that on my Windows phone, I LOVE.  MS has a hit with Cortana, so in historic fashion, that hit is being crammed into every nook and cranny, whether it fits or not.

My limited tests with Cortana in Windows 10 have left me frustrated and annoyed.  I can only imagine the experience will be similar with Cortana in Edge. Get me to Google and let me find what I need-  that’s it – I don’t need her (Cortana) stepping in to undo years of conditioned habbit.

Still not convinced that Edge is merely IE12 in a different skin? I’ll leave you with this comic pointing out the announcement of the new Edge logo, and the side by side comparison.

comic
image credit

icon
image credit

 

image credit

Have you ever wondered what that “http” is in your web browser?

httpHTTP stands for Hypertext Transfer Protocol and it’s a request-response protocol that drives the web. Think of your browser as the client requesting information. It puts this request into a HTTP message and sends it to the server. The server will then send the response back to the browser. That response may be a picture or a webpage, for example.

The current standard HTTP/1.1 has been around since 1999 and it’s starting to show its age. Back then, webpages were much simpler and required fewer resources. Today however, a webpage can contain many additional resources to show you, the user, what the web developer built. Javascript, CSS, images, videos and even Flash are pulled in and rendered by your browser. This results in many back and forth request/responses and puts a large load on the server and the browser.

There are many techniques that attempt to alleviate the data transfer, but these methods are still at the mercy of HTTP/1.1 and its rules. Images can be compressed, resulting in less data transferred, or a server can tell the browser to store files locally (caching) so that future requests for that resource are pulled locally instead of being transferred again by the server. Web developers can bundle and minify resources. Instead of having 3 or 4 CSS files referenced (which means 3 or 4 request/responses over HTTP), we take those files and make one larger file. We can then take out white space and shorten it up to make it as small as possible.

So far, those solutions have worked but what really needs to happen is an evaluation of HTTP and a new version that is in line with today’s web. Enter HTTP/2.

HTTP/2 has been designed to speed traffic in a number of different ways. First, it transfers all data as binary instead of HTTP 1.1s for text message styles. The format is easier and more compact to transfer, meaning it will take less time to transmit. Next, the new version can deal with multiple data requests at the same time. HTTP/1.1 only allowed one data request at a time, meaning first get HTML, next get CSS, next get Image 1, then Image 2, then Javascript – a lot of back and forth. The result of HTTP/2 style requests is a faster and cleaner data connection. Finally, the new protocol includes server push. Today when you access a webpage, the server sends back HTML, your browser parses it and starts requesting additional resources like images, Javascript and CSS. With server push, a response from the server will send a page’s full content.

In order to realize the benefits, both the client and the server have to communicate via HTTP/2 and luckily the roll out of support has already begun. Realizing the full value is still a year or two away, however. Internet Explorer and “Spartan” will support it in Windows 10, Chrome and Firefox already support it. On the server end, the next version of Microsoft’s IIS will support it, with Apache support expected soon.

There is more to HTTP/2, but hopefully this has introduced to you a very important piece of the web, and how it’s being improved.

Image Credit

Microsoft’s Move to Cross-Platform Development

Satya NadellaMicrosoft recently shocked and excited developers with a few major announcements. They are open-sourcing the ENTIRE .Net server stack, and creating officially supported versions that will run in Linux and Mac server environments. Everyone was taken aback by this because just a few years ago then-Microsoft CEO Steve Ballmer famously said that “Linux is a cancer.” Ballmer stepped down earlier this year and Satya Nadella is now leading the company. His quick and decisive actions to make Microsoft technology obtainable to many platforms shows this is a new Microsoft and it’s worth revisiting what Microsoft has to offer.

There is no doubt that this move is designed to keep Microsoft relevant in a world that is no longer ruled by PC operating systems. Developers have many choices of languages and environments and by open sourcing .Net, Microsoft hopes to keep their cloud platform (Azure) competitive by increasing the flexibility of its developer technology.

This move worked for them in the past, and I see no reason why it won’t work today. Back in the early DOS days, Microsoft catered to developers because they knew without compelling applications to run, their operating system would become useless and irrelevant to the end user. Their efforts to create tools and technology developers wanted to use resulted in a world at one point saw over a billion people using Windows and countless applications daily.

Putting my Microsoft fan boy status aside for a moment, it seems to me that as a developer I can more effectively create products and solutions that take advantage of a single platform than I could by trying to create the same solutions multiple times depending on what server the finished product will run on. I know this type of thinking is exactly what Microsoft is hoping for, but I’m only one developer. Time will tell if this bet pays off for them in the long run.

We will be trying out .Net and Linux in the coming months. There will be benchmarks, and testing if it really is a “write once, run anywhere” promise finally fulfilled. Stay tuned to learn what we find.

Satya Nadella image courtesy of Microsoft

Google Update: Executing and Rendering Javascript

In terms of annoyance, JavaScript may have ranked right up there with animated gifs, or <blink> dancing hamsters back in the mid-90s to early 2000’s.

A developer’s stance on pure JavaScript centered on the differences between engines and browsers, or possibly security concerns since the code is executed by the client instead of the server and it could expose their machine for malicious purposes. End users wanting to accomplish something on a webpage might have been greeted with butterflies floating across the screen, endless popup boxes or pages that simply didn’t work in their browser.

Overall, JavaScript had a horrible reputation and (in my opinion) needed a few saviors to keep it from the technology graveyard. Enter frameworks, AJAX and standards.

Over the last few years, JQuery, Mootools, Dojo, Node and a host of other frameworks have distanced developers from the pain of IE vs. Chrome vs. FireFox by adding a consistent layer of methods and properties that deal with the browser differences under the hood. Taking browser differences away allows developers to focus on maturing the use of JavaScript – and gone are the butterflies and Rick-Roll popups. Form field validation, handling responsive design for different devices and parsing AJAX now compliment the end user experience instead of hindering it.

Standards have also been added into these browsers so there are less and less differences in the interpretation of JavaScript. It has now turned into a speed contest between browsers to tout how fast their rendering engine is. All of this is pure benefit to the end user. It creates consistency and allows users to choose what browser they like the best instead of the webpage forcing them to use a particular one.

The modern web could not exist without AJAX. This crucial technology allows small requests and responses to happen within a web page without a complete page reload. Maps, chat feeds and news services all rely on this technology to create a fluid user experience. The workhorse for this, however, is JavaScript. The events of the user trigger JavaScript functions to initiate the AJAX request, and it’s up to JavaScript to then change the webpage to do something useful with the response.

So why does any of this matter for your business and marketing strategy? Perhaps the final piece of the puzzle to solidify JavaScript as a key component in websites is that Google announced that they are now executing and rendering JavaScript as they crawl websites. Until recently, Google would look at only the HTML of a page, relying on solid markup and content in that HTML to rank it. Google has recognized that times have changed and now the importance of a site isn’t necessarily limited to that static content. JavaScript and AJAX may be creating a different page for the end user that Google would not see without executing the JavaScript also.

Take a look at the following picture. On the left is what a normal user sees when they visit this certain webpage. On the right shows what that same page looks like when JavaScript isn’t executed. It is quite a difference – and it creates a huge difference in experience and content.

javascript

Google’s execution of JavaScript is a welcome announcement – and I, for one, am thrilled that JavaScript is being recognized by a major search engine as a component of web development that is important enough to include in their crawling and ranking process.

For the Best ROI: Your CMS Should Be Easy to Use

increase ROI with the right CMSOne last thing to consider when selecting a CMS for your business is the actual return on investment for maintaining your content. We learned years ago that the ones responsible for maintaining content are usually the ones that could care less about system configurations, file permissions, and access to server level tools.The typical CMS user wants to do their job of managing content, not managing a complex path of procedures and cryptically labeled checkboxes. This is why we strive to make it easy for non-technical people to get in, do their thing, and get out – we’ll take it from there.

The best way to illustrate this is to do a side by side comparison of a common task, say adding a photo to a product. The following is an actual list of steps required to accomplish this task for a client that built their website before they knew Apoxe existed.

  1. Expand “Home” then expand “Product Database” then expand “Brand” then expand “Product Type”
  2. Scroll through the list and find the product you want to work with
  3. Click on the product
  4. Scroll to the middle of the edit page, click on “Browse”
  5. Navigate a Media Library folder structure to find the image you want to add
  6. If the photo is not uploaded already:
    a. Open a photo editor on your computer
    b. Find the file on your machine
    c. Resize the image to the size you want it on the product detail
    d. If you forget the dimensions of the product detail image
    — Go to the website
    — Navigate to a similar product
    — Right click on that product’s image, make a note of dimensions
    e. Go back to your photo editing program
    f. Enter those dimensions you jotted down into the resize dialog
    g. Adjust the quality of the image
    h. Make sure the DPI is appropriate for the web
    i. Save the image

7. Select “Browse” in the Media libraries file upload window
8.  Navigate to where you just saved the newly created image
9. Upload
10. Once uploaded, click on the “Properties” button to enter alt text for SEO / Accessibility
11. Repeat Steps 1 through 10 for the Small image, Medium Image, and Thumbnail Image
12. Save the product
13. Publish the site content

Spread this procedure out over say 100 products during the life of the website, and very easily you’ve just paid your employees a significant amount of money to maintain content, while frustrating them by making such a simple task difficult, usually in order to save some upfront cost. Let’s look at this same task in Apoxe:

  1. Click on “Products”
  2. Begin typing the product name in the search box, click on the autocompleted result
  3. Scroll to the bottom of the editor to the “File Upload” area
  4. Click browse, find the image on your computer
  5. Fill in the alt text
  6. Select the file placement you’d like to make this image
  7. Click upload

What is going to happen for you is that based on the selected file placement, Apoxe will create every appropriate size of the image needed. A slideshow image, for example, needs a small, medium, and large version – they are all created for you. The file becomes associated directly to that product instead of associated to a separate media library that you must remember separately from the product. The alt text is saved at the point of upload instead of adding and then instantly editing the file. Clearly – a lot easier to use than that other system.

And, really, that should be the goal of a content management system: Something that is easy to use and with all your needs already planned for, so that you and your team can concentrate on creating great content and generating business.

What CMS does your website use? Is it easy to use? Are you happy with it? Did you get your ROI? Tell us in the comments!

3 Reasons Why You Don’t Need To Invest in Mobile Apps

Why You Don't Need a Mobile App for Your BizWhen Apple released the iPhone in 2007 there was a huge outcry from developers wanting to create applications for this new and exciting platform.  Apple listened and in 2008 with the iPhone 2, introduced the tools developers wanted and a revolution was born. Suddenly the buzzword “app” was everywhere and many businesses felt they needed to create an app to stay competitive, sometimes ditching or ignoring the web presence they spent years to build.

Of course, the other big tech players saw this model and how people were drooling over the latest Doodle Jump, Weather widget, or news reader and they wanted a piece of the pie.  Enter market fragmentation.

Now businesses are becoming a bit more gun shy about this app craze because they now have to develop and maintain software for at least 3 different, incompatible, platforms.  Fortunately, a well-crafted mobile web experience can negate the need for such an investment of time and money.

1. Mobile Apps often rely on data from the web anyway.

Where do you think your phone goes to figure out what the temperature is, or the market value, or movie times? The web. A mobile app simply takes this returned data and parses it for use on the native platform.  Creating a mobile web experience that does the same thing will often times result in an experience that is universal across devices. This central experience is then much easier to maintain and update instead of having to keep up on the latest changes to various operating systems and platforms.

2. The modern mobile web is much more robust than it was 10 years ago

I have to admit, Apple got something right.  When the iPhone was released, they were smart by putting the same rendering engine from the desktop onto the phone. At the time when BlackBerry and Palm ruled the roost, mobile web experiences were held hostage by these half-baked browsers and lack of any sort of standard. Mobile web surfing was painful at best. So, it would make sense to avoid that pain by investing in an app. Now, the mobile web has matured and is able to meet expectations of consumers across devices.

3. As a business, you’ve invested a significant amount of time, money, and energy in your online presence, why not show it to the world?

Any time you develop an app, you are going to segment your market and message. That’s great that iPhone users see your message in an app, but that’s only 41% of the market. OK, so you develop an Android version you’ve now bumped that up to 90%. You’ve just sank a boat load of resources into products that will at best serve 90% of the market all while maintaining and investing in a web component as well. A solid mobile web experience means that 100% of the market has the ability to find your company. It also means that your www investment is complimented instead of competing against a native app to say the same message.

What has been your experience with business app development? Share with me in the comments…

Windows XP is Dead

Windows XP is DeadDid you survive?  Is your computer OK? How did your office make it through? What am I talking about? In case you haven’t heard, Windows XP is dead.

On April 8th, coincidentally also my birthday (thanks for the present), Microsoft officially ended support for the 12 year old operating system.  This doesn’t mean that your computer will not turn on any more, it just means you are on your own for support.  It is now you verses the thousands of hackers eagerly awaiting to exploit vulnerabilities that simply won’t be fixed.

Microsoft 2001Without a doubt the computer landscape has drastically changed in the last 12 years. Mobile, always connected, devices now rule the roost. Desktop PC sales continue to decline in favor of lightweight functional tablets. Fresh and clean interfaces get out of the way for users to accomplish their goals. The cloud reigns supreme in keeping you together with email, social media, browser favorites, and music.

It easy to forget that in 2001 Microsoft thought you wanted a cute cartoon puppy and 3 boxes to input choices to help you find files on your computer. Or how the icons seem too cutesy as an effort to hide gory technical features behind bright colors and cartoons to make a computer friendlier.

Microsoft XPWindows XP was the result of an effort to end the “95/98/ME” and “NT” versions of Windows by combining the consumer and business OS’s into a common architecture. It had to be welcoming enough for parents, and powerful enough for IT admins. Microsoft got neither 100% right.

But in typical Microsoft fashion, the parade of hotfixes and service packs transformed this raw and generally hated OS into a complete and well-loved piece of computer history. Just how well loved is apparent in that about 25% of desktops, close to 300 million, still run it despite 3 other major versions of Windows being available. Or that April 8th was Microsoft 3rd attempt to end XP and previously bowed to the demand of loyal XP users due to the sheer number of XP users.

ATM Windows XPThe concern now is falling on those devices that you never thought about what the underlying OS was. A whopping 95% of all ATM machines for example are still using this OS to dispense cash. If you think “wouldn’t hackers be tempated to take advantage of this?”you’d be right.

This doesn’t mean withdraw your cash, close your accounts, and stuff piles of money under the mattress. It just means that although Microsoft is closing the chapter, Windows XP will continue to be part of our lives for months, if not years, to come in a variety of locations.

In fact, as governments are realizing that this April 8th cutoff date is real, they are now striking deals with Microsoft by paying millions for an additional year of support. Without sounding political, it’s absurd that these governments have known about this deadline for at least 6 years and now are paying this money unnecessarily. If they had just acted sooner by moving to a more modern platform.

For all the ups and downs that Windows XP has given us, it’s finally time for mainstream developers, end users, and media to put it to rest. I wish the remaining holdouts good luck.

The 411 on 200, 301, 404, 500

You may hear us throw around these numbers during meetings and sit there and nod and look thoughtful as you wonder to yourself “What the heck are they talking about”  Fortunately a small understanding of just a few numbers will vastly improve your knowledge of how the web works and you’ll have a great conversation starter at your next party.  Ok, not really, but you will appear smarter to your friends.

The web is built around a request/response model. When you type in www.tkg.com and hit enter, you begin the request process. That request travels the Internet and lands on our webserver.  The server then responds to that request and the loading of the webpage begins. Since there are so many variables between you and the webserver Tim Berners-Lee (the father of the web) devised this numeric code to keep both you and the server in sync to what’s actually happening.

The numbers are actually sort of a family of similar meanings with each hundreds place defining the family.

A 2xx response is a Successful response. When the server responds with a 200, its telling your browser everything is A-OK and here comes the webpage. Other 2xx codes also mean success, but vary on the conditions.

The 3xx family begins the redirection family. A 301 response tells the browser (or search engine) that what you requested has gone away, and all future requests should be directed to the specific URL. An example of this may be changing the URL www.tkg.com/danhall to www.tkg.com/dan-hall  The server will see the “danhall” request and tell the requester go to “dan-hall” instead. This is very important when dealing with SEO strategy because a search engine will transfer any ranking it built for ‘danhall’ to ‘dan-hall’.

A single webpage can make many, many, requests back to the server to load graphics, styling, and javascript needed to render the page. Transferring the same resources over and over again puts a substantial amount data on the network. Browsers have a caching mechanism built in that saves these resources locally once downloaded. Wouldn’t it make sense to use what’s just been downloaded instead of waiting for it to download again? That’s where a 304 response comes in. Its basically the server telling the client “You already have this, just use that instead”  This message is a lot smaller and quicker to get to the client instead of downloading a 1MB image for the 5th time during a web visit.

Next up is the 4xx family.  Sorry, but this group basically indicates you did something wrong.  Say you try to go to www.site.com/restricted-area A server would respond with a 401 code which means you simply aren’t allowed because you’re not authorized.  This would trigger the browser to prompt you for a user name/password which in turn the server authorizes and you get in.   Another common 4xx family member is the dreaded 404. This simply indicates that what was requested couldn’t be found.  Sites sometimes take this response and give back a sitemap, or a friendly message prompting the user to check the URL and try again.

TKG.com 404 Error PageFinally, we have the 5xx family.  Remember the web is a request/response model, right? We handled errors in the request side with the 4xx family, so the 5xx family handles errors in the response side. 500 is a generic response that something crazy happened on the server, but not additional details are available. 503 will be given back if the server is unavailable.  This may be that it is overloaded, or down for maintenance.

There you have it, a small break down of some common codes used on the web.  Next time you see a broken image, or get a picture of a broken robot instead of the latest news you’ll know you just encountered a 404 error. If you load www.facebook.com and scroll through the latest memes you can say “thank goodness for 200 responses” Well, maybe not, but hopefully this little guide has helped you demystify a small section of how the web works.