source: products/qPloneTiles/trunk/README.txt @ 1

Last change on this file since 1 was 1, checked in by myroslav, 18 years ago

Building directory structure

  • Property svn:eol-style set to native
File size: 4.4 KB
Line 
1qPloneTiles
2
3
4Usage
5
6  Plone Product for creating "Tile" links.
7 
8  Provide class 'tile' for html element you want to
9  have link behaviour. Then select one of the anchor
10  elements inside that tile by adding it class =
11  = 'primary'. Thus, our tile element will redirect
12  you to primary anchor target. So all tile area,
13  except anchors within it, is linkable and behave
14  like a link! If you define your tile element, but
15  not select your primary link inside tile, href
16  attribute of the first anchor will be taken by
17  default.
18 
19  Example 1:
20   
21    <div class="tile">
22      <a href="www.example1.com">First link</a>
23      <a href="www.example2.com">Second link</a>
24    </div>
25  Here we have div element with class 'tile'. But any
26  element inside div haven't class 'primary'. So by
27  default will be used href of the first link. And
28  when you click in scopes div element and outside a
29  element you'll be redirected to www.example1.com.
30     
31  Example 2:
32 
33    <div class="tile">
34      <a href="www.example1.com">First link</a>
35      <a class="primary"
36         href="www.example2.com">Second link</a>
37    </div>
38  In this case we have (in addition all we have in previous
39  example) second link with primary class. So div element
40  have "www.example2.com" location.
41 
42  Example 3:
43 
44    <div class="tile">
45      <a href="www.example1.com">First link</a>
46      <div class="tile">
47        <a href="www.example1.com">First link</a>
48        <a class="primary"
49           href="www.example2.com">Second link</a>
50      </div>
51    </div>
52  This last example show us that we could have nested
53  tile elements. In practice, everything works like in
54  previous examples except one. Tile element look for
55  primary link. In this example primary element is
56  inside both tiles. But if you want to have for outer
57  div first link as primary, you could simply add
58  class 'primary' to 'First link'. In this case tile'll
59  search only to first primary link. And it won't
60  affect inner div element.
61  So remember that tile element could inherite href
62  attribute only from inner anchors.
63 
64 
65Inspiration
66
67  "#120: Support and use "Tile" links":
68 
69  One of the classic, testable usability laws is Fitt's
70  Law, which simply says that the efficiency of a user
71  interface item is directly proportional to its size.
72  Plone currently has a lot of user interface items that
73  could have bigger clickable areas without changing the
74  elements themselves.
75                     
76  Proposed by::
77    Alexander Limi
78  Proposal type::
79    User interface
80  Assigned to release::
81    Plone 3.0
82  State::
83    being-discussed
84
85Motivation
86
87  A lot of the user interface elements in Plone only
88  work when you click the links they define instead
89  of the entire UI element. This is bad UI, although
90  most web-based systems work this way.
91
92  I have already experimented with changing this for
93  a limited set of items in previous Plone versions;
94  in Plone 2.0 I made the entire item in the
95  navigation tree clickable and it indicates when it
96  is selected with a block of color around itself,
97  so you know you can click (this doesn't work in
98  Internet Explorer because it's a buggy piece of
99  crap, more about that later ;). In Plone 2.1 I made
100  all the portlet items be clickable in the entire
101  area through a display:block definition of the link
102  tag.
103  It's time to take this to the next level.
104
105
106Proposal
107                                         
108  Because of the limitations (as far as I have found,
109  at least), it's hard to make certain elements
110  entirely clickable through re-defining the link tag
111  only. In a separate project I was involved in, we
112  used a tiny piece of JS to assign clickable behaviour
113  to an arbitrary element, which worked well.
114  (Note that the normal "read more" or whatever link
115  still remains, so it's not removing links for people
116  that have JS turned off or browsing via lynx or
117  similar — this is merely augmenting the link behaviour,
118  not moving it into JS.)
119  This also has the advantage of being able to make any
120  area clickable. My pet peeve is that Plone in "Summary
121  view" doesn't accept clicks anywhere within the area
122  of one of the items listed, but only on the links. The
123  interface would be so much more efficient if we could
124  click anywhere within that item's area.
125 
126                                         
127Implementation
128                                         
129  We should find a good way to define an area as clickable.
130  In the project I was in, we defined that on the tag
131  itself, and did it explicitly, but this can possibly be
132  improved.
Note: See TracBrowser for help on using the repository browser.