Tag Archives: Web

"off-left" convention is bad news for RTL

[This post presents a web designers technical problem, in which a hack for improved accessibility damages RTLability]

This weekend I tried to debug an annoying problem in Drupal's Acquia Marina theme on RTL mode, in which a horizontal scroll bar appears with no good reason (layout doesn't scale horizontally).

I turned to monkey HTML debugging, a term I just invented for removing element-by-element until getting to a super simple HTML file which reproduces the bug.

Eventually the one to blame was an element placed at "left: -999em" absolute position,  a far place horizontally, and triggered the scroll bar to appear (on FF and IE, not on Chrome). When on LTR mode, it didn't, and things work perfectly. This setting aims to simply hide the drop-down menu when mouse is not hovering above it.

Q: Why don't they use CSS display:none, which seems to make more sense than hiding things off the screen?

A: looks like it has to do with screen readers (as this article suggests), which are apparently not aware of display:none text but are aware of off-screen text. A little puzzling. I suspect that it's too old info, for it seems to be written on 2003. I wonder if new screen readers have this problems as well, and whether the reason for using off-left is not just an ancient myth.

The problem with RTL

When placing things off-left (e.g. left: -999px) on LTR mode, all browsers do NOT widen the page horizontally. It makes sense - the page goes from left to right, not from left to even-more left.

However, when on RTL mode, left: -999px does widen the page horizontally to the right (and the off-left element is actually visible when scrolling there), which is a very unwanted effects.

Here's a related drupal discussion about the problem and possible solutions.  The problem seems broader than just acquia marina .

Continue reading

Browser Wars: we win!

Due to Windows 7 release, many people indirectly upgrade from IE6 -> IE8 these days. You can see this here and here.

With IE7, IE8, FF, Chrome, Safari & Opera - the web would look much better. PPK's forecast -  that adding IE6 support would cost more money to the business - is becoming real.

This basically means that web is getting more standard than it used to, and "sites the work only in IE" should become rare even in the short term. Amen.

(Also, these days IE8 is starting to overcome IE7)

Choosing a CMS: any reason NOT to choose Drupal?

While researching the current free CMS software options, I realized that Drupal wins in almost any category: it's intensively developed, has a wide community, lots of plugins, amazing taxonomy extension, etc.

I recommended an organization I volunteer at to swtich to Drupal (they need a major upgrade anyway). After I've said all the good things to convice them, they asked me: "what are the disadvantages of Drupal". Smart question. I wasn't sure what to say. In many Drupal vs. Joomla comparisons, the only Joomla advantage (more or less) was Joomla considered easier to use. From my little experience, it's not true (maybe it was, in earlier versions). A user can easily create content when using FCKEditor and IMCE plugins, and administration is also pretty straightforward.

The ease-of-use issue matters in my particular case, for it's possible that the next admin will be less technology oriented.

What do you think, is Drupal really more difficult to administer? Other reasons to choose something else?

* WordPress is really cool for personal blogs, I believe it's less cool for a more complex organization website.

Weird CSS tricks

I was quite surprised to find out these two interesting css "tricks":

  • Data urls: putting the data inside the CSS (inline).
  • CSS sprites: instead of loading many small images (one per item), it's possible to load one big image that contains them all.. then play with the offsets to get the right image.

Radio Buttons: a bad design?

Just a thought: once a user clicks on some radio button, it'll be selected, but the user will have no standard way to remove/undo this selection. The only possibility is to switch to another radio button on the same radio button group. As far as I know*, this behavior occurs on all popular GUIs, including web, windows forms, qt and gtk, and probably others.

It's been like that for so many years, isn't it time to add a "deselect radio button" standard? Just like a checkbox, a single click would be a simple enough way to undo a selection. For special cases, a "ForceSelection" property may indicate that this radio button group cannot be deselected, to preserve the current behavior.

* I merely researched this topic, it's a just-a-thought kind of post and might be inaccurate.

HTML "name" attribute, Firefox misbehaves

It's been a long time since I wrote something about web-dev, that's because I code less web-stuff recently 🙂

"id" vs. "name" attributes

so far, I thought that "id" should be used for unique IDs, and "name" can be used for non-unique names, i.e. multiple HTML tags with the same name. I've been using document.getElementsByName(str) to get an array of elements with the same name.

Today I've figured out that it's only partially legal: the name attribute can be used only for specific elements (such as INPUT), but cannot be used on many elements (such as DIV). For some reason, Firefox accepts the name tag for any HTML element, while IE follows HTML 4.01 and doesn't accept name tags for "illegal" HTML tags.

Proof of concept

The next piece of JS/HTML code, gives different results on both browsers:

<div name="foo">bla</div>
<script type="text/javascript">
alert(document.getElementsByName("foo").length)
</script>

Results:

  • Firefox 3: 1
  • IE 7: 0

Here is a nice explanation with a full list of "name"-allowed HTML tags.

Playing with Drupal

I've been looking for a FOSS CMS, and chose Drupal (v6.5) due to the good feedback.

I'll try to sum up the experiment shortly:

Disclaimer: I'm a new Drupal user and I might've missed many important features or misunderstood some. Please comment if you disagree with stuff I wrote below. Also, I'm not familiar with other CMS other than MediaWiki and WordPress.

The good

  • Flexibility:
    • a very flexible menus system; easily create "boxes" and set their location.
    • With some web development skills there are hardly any limits: raw html+javscript can be used in pages!
      and, of course, everything (themes + modules + core) is open source and can be modified as a last resort.
  • Modules: lots of modules that do anything and integrate drupal with other software (i.e. the gallery module). Drupal is very modular and even basic things are actually modules.
  • User roles, access: a mature user-access system. Admin can fine-tune users' permissions.
  • Integrated right to left: enabling the "Hebrew" language quickly loads an "rtl" CSS file (if supported by the theme; popular themes have it), thus enabling a fully RTL CMS.
  • Community: many answers to questions are available on the net.

The bad

  • Ease of use: installation was quick. Using the system for simple stuff (write pages, create menus) was really simple. But some other tasks were more complicated for first use, such as the Taxonomy (tagging) system, user roles system, protecting specific pages from anonymous users.
  • Modules: many modules haven't been ported to v6.x yet.
  • Rich text editor: by default Drupal has only a boring textarea as an editor. Some RTE modules are available out there. I tried TinyMCE which didn't work well with v6.x (still beta), and FCKEditor which is a bit too simple, but it works. Maybe I've missed some amazing editor?
  • Drupal as a blogging platform: after installing the right modules ("blogging" + some rich text editor) Drupal can be a fine blogging platform. Still, I find WordPress much more suited for blogging.

As a conclusion, I truly recommend Drupal for creating general purpose websites: both for simple and complex ones. For blogging-only needs, I find WordPress better and easier. Anyway, writing websites from scratch belongs to the past. I figured that out a bit late 🙂

Beware: Flash Cookies

If you read it on Slashdot, you can skip this post 🙂

Some guy writes about a flash web privacy thing with high importance, that I believe many people (incl. me) have never heard about.

Bottom line: the browser options "delete all cookies" or "clear all private data" are not doing 100% of the job. Flash local data can be deleted from here (on Macromedia.com)[1].

Also, you're using flashblock, right? 🙂

[1] I wonder how they secure that thing: after all it's a flash app with privileges for messing with the client's settings!

משפרים את הווב הישראלי

לא מאתמול אני מתלונן (בעיקר לעצמי) על הרמה הנמוכה של אתר הווב הישראלי הממוצע. ב"רמה נמוכה" אני מכליל תאימות לתקן ובפרט תמיכה בדפדפנים נפוצים, אבל גם נגישות, שימושיות וזמינות.

להרגשתי: המצב בארץ נמוך מהמצב באירופה וארה"ב, שכן אתרים של חברות ענק כמו חברות הסלולר, הבנקים, שלא לדבר על אתרי הממשלה, סובלים מבעיות רבות וטריוויאליות.

כשאני מסתכל במבט רחב יותר, אני רואה שתי השפעות חשובות שיש למצב הזה:

  • עיכוב אימוץ תוכנה חופשית ולינוקס בפרט; כיום אחת הסיבות לרתיעה מפיירפוקס ואפילו מלינוקס בכלל, היא מס' אתרים ישראליים חשובים שפשוט דורשים ווינדוס ואקספלורר.
  • חוסר הערכה למפתחי ווב טובים, אשר גורם לאנשים ברמה גבוהה להתרחק מהתחום ×”×–×”.

ואז עלה רעיון: לפתוח בלוג שיעסוק בביקורות על הווב הישראלי. לפני פרסום כל ביקורת נפנה לקבלת תגובה מהגוף הרלוונטי (שתפורסם אף היא).

הביקורות יכילו לא רק רשימה של "מי לא תומך בפיירפוקס" (שגם היא חשובה מאוד) אלא כאמור, ביקורת על נגישות, שימושיות וזמינות.

אשמח לפידבקים (אולי זה כבר קיים?) ורעיונות, ובהמשך גם לביקורותיכם.

עדכונים בקרוב.