The drawback with TwinView is that, in spite of its power to display the differences between two versions, it becomes so hard to see what is the same. After a few insertions and deletions on each side the two columns quickly get out of alignment. When the user scrolls down to study a bit of text how does he or she find the corresponding text in the other version? Without synchronisation you are forced to scroll up and down manually to try to match up the texts when the computer should be really be doing all that for you in the blink of an eye.
The possibilities of providing visual cues in a web browser to indicate alignment are quite limited. There is no way, for example, to connect text blocks using lines that cross from one window to another, as in Nelson's Parallel Textface. And it is very difficult or impossible (at least I can't see how) to synchronise the scrolling of two <div>s in parallel. On the other hand, maybe something simpler might actually be more effective. The technique I eventually settled on uses <span> and the onclick attribute. When the user clicks on a bit of black text common to both sides it causes the corresponding text in the other frame to scroll down to precisely the same position as the clicked-on text, and then highlights it. Using <span> instead of hyperlinks has the advantage that the text is still selectable – very handy for choosing and copying text to search for in other versions. It is also intuitive: a naïve user will eventually click on the text and discover the alignment facility. (Text copyright Vicenzo Cerami)
Before the click on the left – hopelessly out of alignment
... and after – beautifully aligned and everything clear.
No comments:
Post a Comment