Primary links

52.4 Valbox

Kärt barn med många namn, till exempel ”rullista”, ”vallista”, ”listruta”, ”listlåda”, ”flervalslista”, ”selectlista”, ”rullgardin”, ”alternativlista”, ”drop-down” och ”pop-up” . På engelska kallas den selectbox, men också där finns många andra benämningar.

Här kommer den att kallas för ”valbox”. Det är ett godtyckligt val, inte mer officiellt än något av de andra. Eftersom den kallas för så många olika saker, är det viktigt att vara extra tydlig med vad man menar när man pratar om den, till exempel i instruktioner.

Användning

Ett av alternativen är förvalt och det är endast det som syns.

Med hjälp av mus eller tangentbord kan man välja något av de andra alternativen.

Någonting är alltid valt (men detta kan vara ett alternativ som inte har någon effekt och som är tomt eller har formulering som kan uttolkas ”Inget valt”).

Det är tekniskt möjligt att samtidigt välja flera alternativ, men i praktiken bör kontrollen bara användas för att välja en sak åt gången.

Utformning

För de flesta webbläsare går det att ställa in typsnitt, textstorlek, fet eller kursiv text samt bakgrundsfärg. För enskilda alternativ går det vanligen att sätta färg på text och bakgrund.

Hela kontrollen kan inaktiveras. Även enskilda alternativ kan inaktiveras, men få webbläsare stöder detta.


Texten ovan är ur Användbarhetsboken. Varje avsnitt har sin egen webbsida med rättelser, tillägg, blogginlägg och kommentarer. Några sidor (till exempel den du läser nu) har också hela bokens text. Varje dag publiceras ett nytt avsnitt här på webben.

Ur bloggen

11 Sep 2006

Tillgänglighetsverktyg

Accessify.com bjuder på en stor uppsättning verktyg för att producera tillgänglig html- och css-kod. Till exempel Accessible Table Builder som ställer ett antal frågor om tabellen som skall göras och sedan producerar koden.

Andra verktyg:


  • Accessibility Tools
    • Accessible Form Builder – A simple but very quick way of putting together a form that uses either CSS or table for layout, automatically creates label elements and the associated for and id atttributes, as well as (optional) title attributes for each text field. It’s as simple as entering a list of fields that need to be captured and hitting return.
    • Form Element Generator – Build individual form elements that are accessible (requires JavaScript to work). Could be used after creating the form above to address fields that are not straightforward text inputs.

    • Pop-up Window Generator – Create pop-ups that are accessible and search engine-friendly. Note: this tool is going to get a revamp very soon, such that inline event handlers are not used. So, don’t flame me, all ye DOM scripters!
    • Favelets – Little pieces of JavaScript that can be saved as favourites in Internet Explorer, Mozilla and Opera. You may find these useful for checking features of a page (for example, what links are present, images missing alt attributes etc
  • General Developer Tools
    • Yes/No List creator – It’s a tool for quickly generating accessible, XHTML-compliant yes/no radio button choices from a list
    • Insta-Select – An easy XHTML-compliant select list generator (paste in your list and out comes the select with relevent option elements and value attributes)
    • List-o-matic – Create CSS-styled navigation blocks based on unordered list <li> items.
    • Acrobot – converts all your acronyms/abbreviations using the <acronym> and <abbr> tag
    • HTML to JavaScript Convertor – Similar to Response.Right, this tool takes your markup and converts it to a series of document.write() statements that you can use in a block of JavaScript.
    • XFN (XHTML Friends Network) Link Creator – Build up XFN-friendly links for copying/pasting into a blog-roll or navigation menu.
    • Response.Right – Save time converting large blocks of text/HTML to server-side write statements (such as PHP echo or ASP response.write) with this handy convertor.
    • Quick Escape – Converts HTML to escaped characters suitable for pasting into form textarea inputs.
Läs mer: