Comments on Beta Web site design

A few comments after a quick pass over the current incarnation of 
http://beta.w3.org/, as of 2009-09-17 1 PM PDT.

 

    * The tiny triangle used to indicate expanded/contracted content is
      too subtle, making it both hard to tell if something is expanded
      or contracted and hard to see that you have the option. (Just
      because Apple uses it doesn't, in this case, make it good---easily
      perceivable---user interface design.)
    * When you tab to the three views buttons (print, mobile, desktop)
      the focus rectangle stretches all the way from the edge of the W3C
      logo to the button that has the focus, including any other buttons
      to its left. It should be only on the button that has the focus.
    * I consider the style imposed for links (a thick but very light
      blue underline) to be too subtle and hard to see, especially on
      the light gray background where the contrast is very low.
    * When overriding author-specified colors (e.g. in Firefox, turning
      off Tools -> Options -> Content -> Colors -> Allow pages to choose
      their own colors, instead of my selections above) and leaving the
      default white background, all icons become invisible, being white
      lines on the default white background. (This includes the buttons
      for Print, Mobile, and Desktop views are invisible, as well as
      icons in the list of Standards.)
    * Interesting that neither the U.S. nor North America are not listed
      in "W3C By Region"; are the designers U.S.-based and consider it
      above such categories :-)
    * The Tab order is quite inconsistent with the visual layout. The
      Tab order should generally go left to right, top to bottom, except
      where there is a good reason to do otherwise. The current page
      starts with the "Skip" link on the right side, third line down,
      then jumps to the upper left for the W3C logo, then goes to the
      Search field (far right, second row down), then UP to the
      drop-down list of regions, then RIGHT to the Go button, then skips
      LEFT to the left-most view button, then RIGHT through the other
      enabled view buttons, then down and to the left to the Standards
      page tab and rightwards through them, then SKIPS RIGHT to the
      "Seach" button that should have been immediately after the Search
      box., etc.
    * The "Permalink" buttons should have unique Alt text, as in
      "Permalink for W3C Announced Two New Co-Chairs...".
    * When Images are turned off there is nothing replacing the View
      button icons; there should be Alt text for these images.
    * DIV elements used to divide the page into navigational sections
      should have Title attributes giving them human-friendly names, so
      that users of assistive technology can navigate easily.
    * When Images are turned off, and using the default color scheme
      that has a white background, the years for events are nearly
      invisible, being white text on a light gray background.
    * When text size is enlarged sufficiently (in Firefox 3 or Safari 4,
      View -> Zoom), the links for Standards, Participate, etc.
      disappear altogether as the text is below the bottom edge of the div.
    * With a large minimum text size set the links for Standards,
      Participate, etc. are cut off because the size of the div
      containing them does not grow to accommodate their increased
      height. (In Firefox 3, Tools -> Options -> Content -> Fonts &
      Colors  -> Advanced -> Minimum Font Size; in Safari 4, Edit ->
      Preferences -> Never use fonts smaller than -> 20.)
    * With a large minimum text size set the Event dates overlap each
      other as their containing boxes don't grow in height to
      accommodate them. In Safari 4, the lines of text for one entry
      overlap each other because their vertical spacing does not
      increase sufficiently. (In Firefox 3, Tools -> Options -> Content
      -> Fonts & Colors  -> Advanced -> Minimum Font Size; in Safari 4,
      Edit -> Preferences -> Never use fonts smaller than -> 20.)
    * In Internet Explorer 6, the page does not respect text size
      changes specified by the user (View -> Text size -> Largest).
    * When increasing the font size (e.g. in Firefox 3, View -> Zoom)
      the bottom section of the page does not text-wrap to the window
      width. (The rest of the page does.)


Oddly enough, I've also encountered some strange but not replicable 
behavior. For example, once the two sections on the left were both 
labeled "Web for All", once the amount of content increased when I 
browsed away and back, etc.

    Thanks,
    Greg

Received on Thursday, 17 September 2009 22:09:31 UTC