Skip to main content

APEX UI Lessons - Part II

As soon as I posted this entry yesterday, I thought of a few additional "rules" that probably should have been included.  Pitor's comment also spurred on an additional rule.  So without further adieu, here they are:

Standards

Learn 'em and stick to 'em.  Period!  Most modern browsers do pretty well with them, so the closer you are to them, the better off your site will be in the long run.  

Ignore Old Browsers When Possible

Take a page from the Apple playbook here, and simply stop supporting browsers that are too old, despite the fact that they may still be in use.  (I'm looking at you IE 6 & 7…)  Be careful with this one, as you may have no choice but to support some of the older browsers, based on your customers or potential customers.  We wanted to be sure to provide support for at least IE 7 and above, and that decision did add some time and effort to our design process.  We did this because some of our existing and potential customers - at least for the short term - are running IE 7.  Not having support meant not having customers, so the decision was quite simple.

On the other hand, not for a single second did we consider supporting IE 6.  At the beginning of the development cycle, we did have a couple of prospects on IE 6, but we took a gamble that by the time we were production, they would be on at least IE 7.  That gamble paid off, and we saved countless hours by avoiding IE 6.

Identical Look & Feel Across Browsers in Unachievable

This is another rule to address up front to save a lot of time later. Your application will look a little different on IE than it will on Firefox or Chrome or Opera.  And that's OK.  In fact, it's unavoidable.  Throw in the way that the Mac renders and smooths fonts vs. how Windows or Linux does it, and you'll have even more differences.

Thus, making the site look similar across browsers is a more achievable goal than striving for perfection.  Unlike most developers, most users are are "single-browser" users, so they will never know the difference at all.

When in Doubt, Hire Someone

Either you're a graphic designer, or you're not.  If you're somewhere in between the two, then it will take your users about 2 seconds to realize that.  Thus, know your limitations.  There's plenty of free or low cost templates that you can use, and a decent graphic designer also won't set you back too much.  At the end of the day, the way your application looks and feels is critical, and will make a lasting impression on your users and potential customers.  Don't cut corners here and don't be afraid to seek assistance from a professional.

Comments

Christian Rokitta ♠ said…
...and don't be afraid to seek assistance from a professional who, ideally, knows the specific needs for APEX. themes4apex

Regards,
Christian ;-)
May 10, 2012 at 8:35 AM
Piotr Jasiński (APEXUTIL.com / DBE) said…
I would add one more thing to the list - Section 508. Lately one of our client ask us to design them in this in mind.

After short lecture i find this rules quite simple and easy. Also this will be good for the app and for your customer as they are good for SEO.

Best regards
Piotr
May 11, 2012 at 5:01 AM
Post a Comment

Popular posts from this blog

Custom Export to CSV

It's been a while since I've updated my blog. I've been quite busy lately, and just have not had the time that I used to. We're expecting our 1st child in just a few short weeks now, so most of my free time has been spent learning Lamaze breathing, making the weekly run to Babies R Us, and relocating my office from the larger room upstairs to the smaller one downstairs - which I do happen to like MUCH more than I had anticipated. I have everything I need within a short walk - a bathroom, beer fridge, and 52" HD TV. I only need to go upstairs to eat and sleep now, but alas, this will all change soon... Recently, I was asked if you could change the way Export to CSV in ApEx works. The short answer is, of course, no. But it's not too difficult to "roll your own" CSV export procedure. Why would you want to do this? Well, the customer's requirement was to manipulate some data when the Export link was clicked, and then export it to CSV in a forma...
76 comments
Read more

Manipulating Images with the... Database?

A recent thread on the OTN HTML DB Forum asked about how to determine the width & height of an image stored as a BLOB in an Oracle table. I mentioned in that thread that I have some code to manipulate an image stored in a BLOB column. This is particularly useful if you’re going to let users upload images, and you want to re-size them to display as a thumbnail. Thanks to Oracle interMedia , it is trivial to manipulate the width, height, and other attributes of images stored in an Oracle table. I’ve created a sample application here which demonstrates Oracle interMedia and HTML DB in action. Feel free to have a look. You can download this application from HTML DB Studio as well. Basically, this application allows you to upload images and perform an operation on the image as it is inserted into the PHOTO_CATALOG table. There are two places where some PL/SQL code is required: an After Submit process on page 2, and a procedure to display the images. Here is the PL/SQL for the After...
33 comments
Read more

Refreshing PL/SQL Regions in APEX

If you've been using APEX long enough, you've probably used a PL/SQL Region to render some sort of HTML that the APEX built-in components simply can't handle. Perhaps a complex chart or region that has a lot of custom content and/or layout. While best practices may be to use an APEX component, or if not, build a plugin, we all know that sometimes reality doesn't give us that kind of time or flexibility. While the PL/SQL Region is quite powerful, it still lacks a key feature: the ability to be refreshed by a Dynamic Action. This is true even in APEX 5. Fortunately, there's a simple workaround that only requires a small change to your code: change your procedure to a function and call it from a Classic Report region. In changing your procedure to a function, you'll likely only need to make one type of change: converting and htp.prn calls to instead populate and return a variable at the end of the function. Most, if not all of the rest of the code can rem...
5 comments
Read more