Structure in Basic
   Web Design
Structure
Structure

“The subjects were asked to categorize the information items in such a way that they could be related hierarchically.
The subjects received cards with a one-line description of each item. Their task was to organize the items into
categories or groups of items that, according to them, were related and therefore should be found in the same place
in an information system. As we were interested in finding a hierarchical structure, we asked them to group the
categories into higher order categories until they reached a unique superior level. The items to be classified could be
situated in any of the levels. An item like telephone number of the department directory for example, could be in the
same branch but on a lower level to that of the list of staff of the university. Lastly, they were allowed to include the
same item in two different categories which would show the existence of a direct connection between this item and
another category which in turn symbolizes a direct connection that breaks the hierarchical structure.”
Structure

“The subjects were asked to categorize the information items in such a way that they could be related hierarchically.
The subjects received cards with a one-line description of each item. Their task was to organize the items into
categories or groups of items that, according to them, were related and therefore should be found in the same place
in an information system. As we were interested in finding a hierarchical structure, we asked them to group the
categories into higher order categories until they reached a unique superior level. The items to be classified could be
situated in any of the levels. An item like telephone number of the department directory for example, could be in the
same branch but on a lower level to that of the list of staff of the university. Lastly, they were allowed to include the
same item in two different categories which would show the existence of a direct connection between this item and
another category which in turn symbolizes a direct connection that breaks the hierarchical structure.”

BEHAVIOUR & INFORMATION TECHNOLOGY, 1999, VOL. 18, NO. 4, 248
gory which in turn symbolizes a direct connection       5) The distance between two items situated in
 breaks the hierarchical structure.                        diŒerent places of the hierarchy but still directly



               Structure
he aim of the study was explained to the subjects and      connected would be one. For example, d(c,e) = 1
  were allowed to examine all the items before             These links are not necessarily symmetric so you
nning the classi®cation. They were also allowed to         might be able to traverse easily from one point to
 ge their minds as they worked and only ®nished            the another but the return could be di cult. This
n they were happy with the ®nal product. The task          is symbolized in ®gure 1 with a one-way arrow
  approximately one hour for all the subjects.             An example is d(e,c) = 3, so it easier going from c
Student Matrix   Teacher/Staff/IT Matrix
Structure
Structure

“Google has always had the mantra of 'focus on the user and all else will
follow', so the company puts a significant amount of effort into researching its
users. In fact, Au estimates that 30 to 40 per cent of her 200-strong worldwide
user experience team is compromised of user researchers.”
Structure

“Google has always had the mantra of 'focus on the user and all else will
follow', so the company puts a significant amount of effort into researching its
users. In fact, Au estimates that 30 to 40 per cent of her 200-strong worldwide
user experience team is compromised of user researchers.”
By Oliver Lindberg on Techradar.com
Structure

“Google has always had the mantra of 'focus on the user and all else will
follow', so the company puts a significant amount of effort into researching its
users. In fact, Au estimates that 30 to 40 per cent of her 200-strong worldwide
user experience team is compromised of user researchers.”
By Oliver Lindberg on Techradar.com

http://www.techradar.com/news/internet/google-explains-its-minimalist-design-philosophy-641441
Structure
Garrett:
Structure
   Defines how users got to that page and where they go when
   they are finished
   Defines arrangement of Categories
   Information Architecture: the arrangement of content
   elements within the information space
Structure


Having an intuitive, clear structure aids navigation
   Websites are not linear, like a book, but have “levels” of
   access
http://www.thewebsqueeze.com/web-design-tutorials/a-websites-structure-from-a-to-z.html
Structure
Purpose of Website
   information repository
   links database
   Information
   Education
   Interactive
Structure
Target for Website
Access to content
    The rule of Two - 2 pages; two screens; 2 clicks; 2 ways - is the
    important info available on the home page in less than two screens
    are important documents or pages less than two clicks from the
    homepage
    are there multiple access points to the info on the site or through
    links

Structure in Basic Web Design

  • 2.
  • 4.
  • 5.
    Structure “The subjects wereasked to categorize the information items in such a way that they could be related hierarchically. The subjects received cards with a one-line description of each item. Their task was to organize the items into categories or groups of items that, according to them, were related and therefore should be found in the same place in an information system. As we were interested in finding a hierarchical structure, we asked them to group the categories into higher order categories until they reached a unique superior level. The items to be classified could be situated in any of the levels. An item like telephone number of the department directory for example, could be in the same branch but on a lower level to that of the list of staff of the university. Lastly, they were allowed to include the same item in two different categories which would show the existence of a direct connection between this item and another category which in turn symbolizes a direct connection that breaks the hierarchical structure.”
  • 6.
    Structure “The subjects wereasked to categorize the information items in such a way that they could be related hierarchically. The subjects received cards with a one-line description of each item. Their task was to organize the items into categories or groups of items that, according to them, were related and therefore should be found in the same place in an information system. As we were interested in finding a hierarchical structure, we asked them to group the categories into higher order categories until they reached a unique superior level. The items to be classified could be situated in any of the levels. An item like telephone number of the department directory for example, could be in the same branch but on a lower level to that of the list of staff of the university. Lastly, they were allowed to include the same item in two different categories which would show the existence of a direct connection between this item and another category which in turn symbolizes a direct connection that breaks the hierarchical structure.” BEHAVIOUR & INFORMATION TECHNOLOGY, 1999, VOL. 18, NO. 4, 248
  • 7.
    gory which inturn symbolizes a direct connection 5) The distance between two items situated in breaks the hierarchical structure. diŒerent places of the hierarchy but still directly Structure he aim of the study was explained to the subjects and connected would be one. For example, d(c,e) = 1 were allowed to examine all the items before These links are not necessarily symmetric so you nning the classi®cation. They were also allowed to might be able to traverse easily from one point to ge their minds as they worked and only ®nished the another but the return could be di cult. This n they were happy with the ®nal product. The task is symbolized in ®gure 1 with a one-way arrow approximately one hour for all the subjects. An example is d(e,c) = 3, so it easier going from c
  • 8.
    Student Matrix Teacher/Staff/IT Matrix
  • 9.
  • 10.
    Structure “Google has alwayshad the mantra of 'focus on the user and all else will follow', so the company puts a significant amount of effort into researching its users. In fact, Au estimates that 30 to 40 per cent of her 200-strong worldwide user experience team is compromised of user researchers.”
  • 11.
    Structure “Google has alwayshad the mantra of 'focus on the user and all else will follow', so the company puts a significant amount of effort into researching its users. In fact, Au estimates that 30 to 40 per cent of her 200-strong worldwide user experience team is compromised of user researchers.” By Oliver Lindberg on Techradar.com
  • 12.
    Structure “Google has alwayshad the mantra of 'focus on the user and all else will follow', so the company puts a significant amount of effort into researching its users. In fact, Au estimates that 30 to 40 per cent of her 200-strong worldwide user experience team is compromised of user researchers.” By Oliver Lindberg on Techradar.com http://www.techradar.com/news/internet/google-explains-its-minimalist-design-philosophy-641441
  • 13.
    Structure Garrett: Structure Defines how users got to that page and where they go when they are finished Defines arrangement of Categories Information Architecture: the arrangement of content elements within the information space
  • 14.
    Structure Having an intuitive,clear structure aids navigation Websites are not linear, like a book, but have “levels” of access
  • 15.
  • 16.
    Structure Purpose of Website information repository links database Information Education Interactive
  • 17.
    Structure Target for Website Accessto content The rule of Two - 2 pages; two screens; 2 clicks; 2 ways - is the important info available on the home page in less than two screens are important documents or pages less than two clicks from the homepage are there multiple access points to the info on the site or through links