Note:

If you want to create a new page for developers, you should create it on the Moodle Developer Resource site.

Link: Difference between revisions

From MoodleDocs
mNo edit summary
mNo edit summary
(2 intermediate revisions by the same user not shown)
Line 1: Line 1:
[[ Moodle User Interface Guidelines|Moodle User Interface Guidelines]] > '''Link'''
[[ Moodle User Interface Guidelines|Moodle User Interface Guidelines]] > '''Link'''
{{Work in progress|forumurl=http://moodle.org/mod/forum/discuss.php?d=126884|info=<br /><br />'''This is a guideline for a [[Moodle_User_Interface_Guidelines|Moodle Interface Guideline]]. Comments: [http://moodle.org/mod/forum/discuss.php?d=126884 developer forum thread] '''}}


== Problem ==
== Problem ==
Line 24: Line 22:
  and lost when the back button is broken.  
  and lost when the back button is broken.  
  --[[User:Olli Savolainen|Olli Savolainen]] 19:26, 8 August 2009 (UTC)
  --[[User:Olli Savolainen|Olli Savolainen]] 19:26, 8 August 2009 (UTC)
=== Icons ===
Links should include associated image (if available). For example, looking at an assignment in a course displays the assignment pic and then the assignment description as a single link; however, most of the blocks like the activity block exclude the image from the link. This is important as some folks are more graphically rather than text oriented and click on the picture and do not understand why it is not working. We need to be consistent (see MDL-6820). ([[Interface_guidelines]])


==  Related guidelines ==
==  Related guidelines ==
Line 37: Line 38:
* [http://discuss.joelonsoftware.com/default.asp?design.4.403046.4 links: http://msdn.microsoft.com/en-us/library/aa511483.aspx]
* [http://discuss.joelonsoftware.com/default.asp?design.4.403046.4 links: http://msdn.microsoft.com/en-us/library/aa511483.aspx]
* [http://discuss.joelonsoftware.com/default.asp?design.4.403046.4 http://discuss.joelonsoftware.com/default.asp?design.4.403046.4]
* [http://discuss.joelonsoftware.com/default.asp?design.4.403046.4 http://discuss.joelonsoftware.com/default.asp?design.4.403046.4]
[[Category:Moodle User Interface Guidelines]]

Revision as of 14:37, 15 May 2010

Moodle User Interface Guidelines > Link

Problem

The user needs to be provided the choice to issue a command or to navigate in the user interface.

Forces: factors that affect selection

  • Links take up less screen real estate than buttons
  • Links are meant primarily for navigation and users may not expect clicking them to have consequences
    • If used for commands, this can be alleviated by having the link label clearly state what it does as command verbs: "Undo"

Solution

Best practice is to label navigational links the same to their target page's main heading (or title). This way, the user experience has continuity: users get what they expect.

For command links, use an action verb. When using command links, the command is mediated to the server in form of a GET parameter. To keep all Moodle URLs bookmarkable, redirect (using HTTP headers) any page, the url of which contains GET parameters that result in user data being changed, to a new URL that does not contain the GET parameter.

Popups are adviced against. Users easily lose context when a new window opens. If you absolutely must use popups, have the actual URL in the href attribute of the HTML anchor (a) element, and use an event to create the popup. This way, links are still bookmarkable, can be opened to a new tab, and still work without javascript.

I have testified numerous times in usability testing,  
a user clicking a link: when a new window opens, the user
does not realize this (despite a new button appearing in 
the task bar of the operating system). They are puzzled 
and lost when the back button is broken. 
--Olli Savolainen 19:26, 8 August 2009 (UTC)

Icons

Links should include associated image (if available). For example, looking at an assignment in a course displays the assignment pic and then the assignment description as a single link; however, most of the blocks like the activity block exclude the image from the link. This is important as some folks are more graphically rather than text oriented and click on the picture and do not understand why it is not working. We need to be consistent (see MDL-6820). (Interface_guidelines)

Related guidelines

Further information / Sources