Tag Archives: Tutorials

4 big problems caused by old browsers

EducationAbout a month ago, an online retailer made the news for imposing an “IE7 Tax” on its customers. Any customer using the Internet Explorer 7 (IE7) browser was charged a 6.8% tax on their total bill. In their opinion, the tax helped offset the cost of supporting the IE7 browser.

While the move probably riled up a few customers, it brings up some good questions: What’s so bad about old browsers like IE7? Are they really that expensive to support? Why are modern browsers so important? To answer those questions, let’s take a look at 4 problems caused by old browsers: Continue reading

How to use CSS3 gradients to improve your web apps

EducationYou’ve probably heard a lot about HTML5 and CSS3 recently. While they’ve been in production for years, we’re finally seeing browsers that support most or all of these new standards. What does this mean for you, your business, or your web apps?

Rather than focus on the technical details, let’s focus on the important questions: What can you do now that you couldn’t do in the past? What new features do these standards offer that can improve your web apps, or your business?

While CSS3 and HTML5 bring many new features that could improve your web apps, today we’re going to focus on one in particular: Gradients. CSS3 adds a new gradient element, which can help you create more attractive and “lighter” web apps. How so? Read all about them in our latest CSS3 tutorial, which you can find here.

Tutorial: Create a pure CSS navigation menu for your web apps

EducationYou’ve heard the saying, “Don’t judge a book by it’s cover.” It’s good advice, but largely ignored. Whether consciously or subconsciously, we pass judgements based on appearance on a daily basis.

This fact is especially important in business. Studies have shown that people judge a web page/app in less than one second. What does that mean? If you’re building apps for customers or prospects, appearance can affect revenue. If you’re building for internal users, it can affect usability.

Don’t get me wrong–I’m not telling you to focus solely on appearance. I’m telling you not to ignore appearance, because like it or not, an app is judged by it’s appearance first, and usefulness second.

How can you improve your application’s appearance? There are a few ways, but one of the best and easiest way is the navigation menu. A well-designed navigation menu will improve the overall look and feel as well as the usability of the web app. If you’d like to learn a simple way to create a good-looking navigation menu using CSS, we’ve written up a tutorial, which you can find here.

For more tips on usability, this article gives a few more ideas.

Tutorial: Improve web app usability with zebra striping

EducationBusinesses today are facing an overwhelming amount of data, which must be displayed in a usable format if it is to provide any value to the company. Of course, there are many ways to put that data in a usable format. For example, you could build an interactive report or even a web-based pivot table over that data.

While those application types are great for sorting through large amounts of data, sometimes it’s the little tweaks here and there that can really improve an application’s usability. For instance, a few weeks ago we shared a technique for adding conditional formatting to your web apps. Today, I’d like to share a similar technique for adding zebra striping and row highlighting to your web apps using jQuery. Continue reading

Geolocation: Web apps that know where you are?

EducationOur HTML5 tutorial this week focuses on an area of HTML5 that you may already be using: Geolocation. Chances are, if you use a smartphone, you’ve encountered geolocation-aware web pages.

In short, geolocation gives a web page/application the ability to find the user’s location. While that might sound like an invasion of privacy, there’s no need to worry. A website can’t find your location without your permission. Continue reading

HTML5 Tutorial: Canvas is flash without Flash

EducationWhen you hear about HTML5, some new features cause more excitement than others among web developers. The new canvas element is one of those features. The canvas element is an area you can place on a page and fill with a variety of items, such as: Images, text, graphs, charts, animations, interactive tools, etc…

If you’ve spent any time on the internet, you’re familiar with Flash-based games and web tools. The canvas element is similar, but does not require Flash. Like the new video tag we covered a couple of weeks ago, the canvas takes another step in freeing us from third party plug-ins. It also takes another step in creating a consistent browsing experience across all platforms, including smartphones.

Want to learn how to use the new canvas element? You will find the tutorial in our forums.

HTML5 Video: Benefits and drawbacks

EducationIn the latest HTML5 tutorial, we cover the topic that everyone’s been talking about: Video. HTML5 video will free us from “plugin prison.” Online video will no longer require external plugins, like flash, quicktime, or realplayer. Additionally, online video will be accessible via mobile devices, such as smartphones.

This latest tutorial covers everything about HTML5 video. It will teach you how to add video to your web pages, and explain a few hurdles you’ll have to jump over if you want to use HTML5 video right now.

You can find the tutorial in our forums.

HTML5 tutorial: New elements = easy maintenance

EducationIf you’ve ever worked with HTML, you know what “div overload” means. It’s when the web page designer relied too heavily on the “div” tag, resulting in a jumbled mish-mash of code. This creates code that is confusing and harder to maintain.

HTML5 adds new markup elements designed to decrease our reliance on the div tag and leave us with cleaner, more readable code. Page maintenance will be easier and faster than ever! No more scanning through a pile of div tags… HTML5 adds elements specific to certain sections on a page.

You can find the latest HTML5 tutorial covering new structural elements in our forums.

HTML5 tutorial: Forms are now exciting!

EducationAs mentioned last week, we are writing a series of HTML5 tutorials. They will help you learn more about the upcoming HTML standard, what’s new, and how it affects you. The new features in HTML5 will make you more productive and help you create even more powerful web applications.

The first of our HTML5 tutorials focuses on forms. While forms don’t sound very exciting, wait until you see what’s new with forms in the new HTML standard. HTML5 includes features that were formerly only available with javascript! As you will see from the tutorial, forms are about to get a lot more powerful.

You can find the tutorial in our forums.

HTML5: Much more than just iPhone video

EducationThe talk surrounding HTML5 these days is largely focused on video thanks to Apple’s decision to not allow Adobe flash on the iPod, iPhone, or iPad. However, there is so much more to HTML5 than the ability to play video natively.

In fact, when you really begin looking at the enhancements in HTML5, you realize video playback probably isn’t even the most important new feature. Those who work with HTML at all will stand to save a ton of time and be able to do things they could never do before using plain old HTML. Continue reading