Category Archives: Web Development

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.

“I need a new brandsite!”

brand strategyA what?

Working with as many clients as we have – and over as many years as TKG has been doing it – we’ve learned some things. Hence, we have this blog.

Often, something like this unfolds: We start working with the client on their new website. They say they are after a fresh look that better represents their product or organization.

No problem, we’ve got that covered. Responsive design, too? Check!

So we’ll move through the kickoff portion of our new project process and ask the client to send us their brand guidelines, including logo, colors, etc. At some point in this process the client will often mention, “oh, by the way, we hate those also and what we have does not target our market.”

Ahh. I see.

So if you are out there reading this, and you are a business in this predicament, let’s take a step back. Let’s start with the brand first.

Why?

Well, if the brand you have currently is really outdated or targets a market that is not your focus anymore, you’re going to need to re-do this before your website anyway. It not only affects your web and online marketing efforts, but also your business cards, letterhead, print items, wearables, signage … and on and on. All of these things need to be current and on target for your new online presence to take hold and be effective.

What now?

Get it done. TKG can help you determine what your brand is missing and develop new collateral that represents the business or organization you want to be today. Work with our team to create your new face so that you can put your best foot forward in the digital space and beyond. Brand, check!

Then what?

Bring that new brand online and proudly show it off to the masses, while your business reaps the benefits of your hard work.

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!

An Introduction to Icon Fonts

Icon fonts are a font that gets installed onto your website that allows you to use numerous vectored icons. This means these icons are very similar to any font that you would have installed on your computer, such as Arial or Helvetica.

Since these icons are vector objects, you have the ability to manipulate them via CSS, just like you would with any normal font.

Benefits to Using Icon Fonts

  1. Change colors with CSS
  2. Change the size with CSS
  3. Rotate them with CSS
  4. Works with retina display natively since they’re vector images
  5. Add drop shadows with CSS

You can see live working examples of these benefits over on Chris Coyier’s blog.

Font Awesome LogoMy favorite icon font to use is Font Awesome; however,  there are several others gaining popularity. Font Awesome works by using an <i> element with an icon-specific class such as:Font AwesomeAs you can see from the above example, adding Icon Fonts to your code will not bloat it at all and will greatly increase your sites page load efficiency.

Are you using Icon Fonts yet? Share with me in the comments which is your favorite.

4 Things We Bet You Didn’t Know Apoxe Could Do

When I came to TKG almost a year ago, I quickly had the opportunity to work in our homegrown CMS, Apoxe. Having worked in a lot of CMS’s before, I wasn’t expecting much (sorry!), but boy was I pleasantly surprised. There are a number of things that set Apoxe apart from the other CMS platforms out there, but here are 4 of my favorite features:

1. Page Order in Menus Can be Easily Changed

Sometimes you just want to re-organize your site. Maybe because keyword research suggests one topic is stronger than another and you want to place it more prominently, maybe because your business is shifting. Whatever the reason there are many CMS platforms out there that claim to make this easy. But, when you get into these platforms to edit content and change the order of menu items, it actually gets complicated very quick. With Apoxe you can easily drag and drop your menu items instead of clicking through a maze of pages in the admin.

Apoxe CMS Screenshot

2. Relate Pages, Articles, and More Via Relate Functionality

As you add content to your site, you may want to point visitors in the direction of it from related pages. Most CMS platforms give you the ability to setup menus, but Apoxe easily allows you to do that as well as relate content to other content, all in 3 easy steps. Typically these relations will show up on the pages as related reading.

For example let’s say that we just published a page called “Web Design Pricing” and we want to relate this page to the “Web Development” page.

Step 1: Click the relate button next to the item that you want to relate.
Apoxe CMS Screenshot
Step 2: Click the page that you want to relate the item to.
Apoxe CMS Screenshot
Step 3: You will see the relation shown in the right hand column. You are done.
Apoxe CMS Screenshot

3. Contact Form & Sales Reports can be Generated Easily

Part of a successful web marketing campaign is measuring your efforts against the results of those efforts. On most Apoxe sites there is a reports module that allows you to view, export, and print reports for form conversions, sales, site searches and more.
Apoxe CMS ScreenshotApoxe CMS ScreenshotThe other cool thing? Your form submissions are archived, so when your email crashes or you deleted something by accident, it’s all safe and sound.

4. SEO Page Properties Can Easily be Added to Pages, Articles & More

Some content management systems do this through some kind of SEO module – where you actually have to leave the page to find the place to put this data. Fun, right? With Apoxe, you do it all on the same page where you put your content. (And if you’re doing it in bulk, we have a few tricks up our sleeve for that also!)
Apoxe CMS ScreenshotWhat are your favorite things about your CMS? Does it work as easily as Apoxe? Tell us in the comments.

P.S. If you would like to learn more about the Apoxe Content Management System schedule a FREE CMS demonstration – you can see it live and in-person!

An SEO Friendly CMS is a Must

It’s hard to believe that this day and age, we would still be coming across recently built websites on content management systems that are not SEO friendly.  You’d be surprised how often we do.

It is our opinion that this should be a minimum standard by now.  Frankly a current CMS should go beyond being SEO friendly, making integration easy with CRM systems, email marketing service providers, social properties etc., simply because effective SEO really means a well-built website and a good content marketing strategy.

CMS + SEOIf you are evaluating a new CMS, it’s critical that you consider the following bare bones:

  • Human friendly, and search engine friendly URLs
  • Does not create duplicate content
  • Output of CMS is consistent with standards compliant markup
  • Individual page properties and meta data are separate fields in the CMS
  • Reorganization of content as the site grows is easy and clean, redirects applied as needed

Ideally you’ll be able to find a CMS that has been heavily influenced by true online marketers.  It’s true that software developers are very good at making very efficient content management systems that do generate web pages efficiently.  Your goal should go further than that though.  It should be efficient of course, in every way.  Time and skill needed to add pages should be minimal, server resources need to be considered etc.  Equally important are the needs of the online marketers who want to be able to effectively run an online marketing campaign.  Their goals are most often focused on growing the business of the customer, so their needs are important.

What it boils down to is most websites serve a purpose: To generate business.  If your CMS does not give you and your online marketing team the tools to meet that objective, then no matter how inexpensive, or how efficient it is, it’s a waste of time and money.

What is a CMS and Why Does it Matter?

You’ve probably heard the term “Content Management System” being bandied about, but do you really know what it is?

Confused about CMS?It’s sounds very technical, but in fact, it’s quite the opposite. A content management system is an application that allows users to add, edit and manage a website – without having to know any of the technical stuff that goes along with it.

Around TKG, we refer to it as simply CMS or admin – or Apoxe when we are talking about our very own TKG-built CMS (it’s pretty awesome, if we do say so ourselves).

A CMS allows a website owner or administrator to access all the files on the site easily. They can change copy, videos, pictures, SEO settings and anything else that he or she may want to freshen up. That site admin can take new pages live or take down any unnecessary pages very quickly and easily – and without needing any outside assistance from a web guru.

For example, if you have a new product you need to add to your site, a good content management system such as Apoxe will allow you to go into the admin of the site and add it right to the page yourself – even if you aren’t technically savvy (really!). A quick admin training to show you the ropes is all you need – it really is that straightforward. No coding, no HTML, nothing fancy. It’s simple, fast and easily maneuvered and changeable. Publish what you want, when you want it.

We’ve found that Apoxe saves our clients a lot of time and money, as they are able to make changes to their sites themselves, as opposed to paying a developer (us) to make the changes for them – and then waiting for that to happen. This is especially helpful for e-commerce sites with regularly changing product offerings or informational sites where new copy needs to be added or updated on a regular basis.

If you’d like to see Apoxe in action or sit in on a training session, give us a call at 888-485-4932 or drop us a line. We’d be happy to show you how easy using your very own CMS can be.

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…

Compass vs Bourbon

Back in March, I shared my experience with SASS. Since then, I have been able to play around a little more and experiment with some of the other capabilities of SASS and the two main libraries that can be used with it: Compass and Bourbon. Both are sets of functions, or mixins, and pre-set styles that help ease the process of writing styles for a website. While they both share the same purpose, they are not quite the same and I have found that I ended up favoring one over the other.

Compass

compassAfter talking with other developers, they all seem to favor using compass whenever they are writing styles with SASS, and I don’t blame them! It is a very powerful tool helping developers make use of the latest technologies and not having to worry so much about browser compatibility. One thing that TKG always places at high value when we develop new websites is browser compatibility to encompass the greatest number of exposure to the public for clients. Without Compass, certain styles would need to be written 3-5 times in order to cover all of the browsers that we need to cover. Compass can be used to write that same code once, and it will write that style the other 2-4 times, speeding up the development process. Compass is able to help with 5 areas of writing styles: CSS3, Typography, basic style patterns, page layout, and even comes with a CSS reset to give your site a fresh start.

Compass Addons
Susy is a responsive website framework that works with Compass. It is helpful, but I found some things to be counter-intuitive and a little more confusing to use. If you are using compass, I will still recommend this framework, though, for responsive web design.

The Downside of Compass
The only downside I have found with is the size of the library compared to how much is typically used. I used this framework starting out and would only ever use the CSS3 capabilities, which leaves 80% of what I’m including into a website unused.

Bourbon

bourbonOn one of the more recent projects, I have tried a different SASS framework: Bourbon. A co-worker found this framework and was able to give it a shot before I did, so I had a frame of reference as to the usefulness as compared to Compass. It has the following similarities to compass:

  • CSS3, layout, and reset styles are included in the package
  • Helps with making sure the styles on a site are browser compatible
  • Has a set of addons that makes developing websites a lot quicker

The ease of use seems to be much better as compared to Compass. Everything is very straight forward and there is very little that needs to be “figured out”. Part of this comes with Bourbon being a much smaller size than Compass limiting it down to just the necessities. Even with the first time I have used this framework I felt like I was developing at a faster rate than when I was using Compass

Bourbon Addons
Bourbon has 3 major addons Neat, Bitters, and then Refills. Neat is the responsive framework that goes along with Bourbon, Bitters, is the style reset as well as some base styles for different elements, and refills is not so much an addon, but more so a set of basic patterns that can easily be implemented to a site.

The Downside of Bourbon
There may be a little more coding involved as compared to Compass.

After evaluating both, I chose Bourbon. It is very lightweight in comparison, and, for me at least, was a lot easier to use. Since it provides the same capabilities as Compass, without including as many files that go unused, and still has a solid responsive framework and style reset, I would put my money behind this being a better choice.

Have you tried either Compass or Bourbon? Let us know your opinion in the comments…

3 Questions to Ask When Shopping for a CMS

Find the right CMS for your bizLooking for the right CMS platform can become difficult and confusing with all of the choices out there. Many of them claim to be easy to use and all of them claim to be the best. The question is, how do you find the right CMS for your business? To answer that question, I’ve identified 3 things to ask yourself when browsing through all of the CMS options out there.

1. Is The CMS Scalable?

Most of the CMS platforms out there do one or two things very well, but aren’t scalable. For example; There are hosted CMS platforms out there such as Wix, Weebly, Squarespace, LightCMS and many more, that all have some decent out of the box features. You might look at these platforms and say wow this is what I need “right now” and they are affordable too. The reality is that these platforms give you very little control over the types of content you can add.

LightCMS for example prides itself on being an easy to use e-commerce platform which it is. However it is not good for large e-commerce companies. Most companies would look at this and say, “I only have a few products, this should work great.” The reality is that after you get past 100 products, LightCMS gets very difficult to navigate. There is minimal reporting, product management cannot be done in bulk and a slew of other usability problems.

2. Will I Be Able To Use It?

Another common problem with CMS platforms is that some of them are still too complicated for the average user to use. When looking at using a CMS for your website, make sure that you read reviews and articles about the usability of the platform. You can even inquire about usability from companies on the platforms featured list.

Another thing to ask is whether or not the platform is “supported” or in other words, is there customer service available. There are a lot of platforms that are open source and have “community based” support which means there is no email or phone support and you will have to crawl through forum articles to try and figure out your problem.

Select a CMS platform that is supported in case problems arise. TKG’s Apoxe, for example, is fully supported and our team is available to answer your questions via email or phone.

3. Will I Own My Website?

This might seem like a no brainer. Of course I will own it. I am paying for it right? Well it is not that simple. A lot of CMS platforms are “Hosted Platforms” meaning you can only use the platform when it is hosted on the servers of that platform.

This is not necessarily a bad thing. If you are a low tech person who is looking to have an easy to use website solution then these hosted CMS platforms could be for you. More often than not the downfall to these platforms is that you actually do not “own” your website. If you discontinue using that platform your site is erased, literally.

The other downfall is that platform updates and server updates are left up to the CMS platform company. You will have very little if any control over server settings, server speed, platform updates, etc.

In a nut shell, hosted CMS platforms are like renting a house. Not always a bad thing but you are paying money and spending time adding content that cannot be transferred out if you should choose to leave the platform. If you can afford to buy, we recommend going with a solution that will allow you or your web development company to have complete control over the site.

To get a feel for how our customized CMS Apoxe works, request an Apoxe CMS demo or contact us.