Koncept för stockholm.se #1 – Kontraster

Postad av: Johannes Söderlund,

En del i vårt arbete med att ta fram guidelines för e-tjänster och byggandet responsiva stockholm.se var att definiera konceptet för stockholm.se på ett samlat och tydligare sätt. Detta för att förbättra kännedomen (för beställare och konsulter) om vad som fungerar från tidigare erfarenheter och kunskap, men också för att säkra användbarheten i utvecklingen framöver för oss själva.

Under våren har också stockholm.se granskats tillsammans med FunkaNu för att säkra tillgänglighetsaspekterna och då också de konceptuella delarna.

Nedan beskrivs konceptet med fokus på kontrasthantering i gränssnittet.

Hantering av kontraster i stadens webblösningar:

Det finns tre parametrar vi mäter kontraster på, skillnad i färg, skillnad i ljusstyrka, skillnad i ljusintensitet.

Riktlinjerna nedan är tolkade som just riktlinjer och inte som regler.

Skillnad i färg

Den färgpalett som tagits fram har säkrats utifrån detta:
1. Blå 2. Ljusblå Färgkoder för 1. Blå och 2. Ljusblå 1. RGB	0/110/191 2. RGB	214/237/252 1. HEX	#006ebf 2. HEX	#d6edfc 1. Lila 2. Ljuslila Färgkoder för 1. Lila och 2. Ljuslila 1. RGB	93/35/125 2. RGB	241/230/252 1. HEX	#5d237d 2. HEX	#f1e6fc 1. Rosa 2. Ljusrosa Färgkoder för 1. Rosa och 2. Ljusrosa 1. RGB	196/0/100 2. RGB	254/222/237 1. HEX	#c40064 2. HEX	#fedeed 1. Grön 2. Ljusgrön Färgkoder för 1. Grön och 2. Ljusgrön 1. RGB	0/134/127 2. RGB	213/247/244 1. HEX	#00867f 2. HEX	#d5f7f4 1. Orange 2. Ljusorange Färgkoder för 1. Orange och 2. Ljusorange 1. RGB	221/74/44 2. RGB	255/215/210 1. HEX	#dd4a2c 2. HEX	#ffd7d2

Skillnad i ljusintensitet

Det verktyg som använts för att mäta skillnad i ljusintensitet (kontraster) finns på: http://www.paciellogroup.com/resources/contrastAnalyser, samt skillnad i färg: http://snook.ca/technical/colour_contrast/colour.html

Exempel på fonthantering:

 

Kategori: Design


Kommentera

E-postadressen publiceras inte. Obligatoriska fält är märkta *

Subscribe to comments