MP0615: F2_Lahbib_Lahbib(el bueno)

1. Cerca i selecció de la paleta de colors accessible. (20%)

Què fa que una paleta de colors sigui accessible? (Contrast cromàtic WCAG AA/AAA).

Una paleta es accessible quan els colors tenen un contrast suficient entre ells segons les wcag :

Nivell AA
- Text normal: contrast mínim 4.5:1
- Text gran (18 px o bold 14 px): 3:1
Nivell AAA
- Text normal: 7:1
- Text gran: 4.5:1

Esto asegura que persones amb baixa visió daltonisme o fatiga visual puguin llegir el contingut sense esforç

Explica la selecció de colors que has triat. Tria 2-3 colors. (adjunta captures de la paleta)

Combinació perquè passi AA i AAA.

Color principal (fons): #FFFFFF (blanc)
Color secundari (text): #1A1A1A (quasi negre)
Color destacat (botons/enllaços): #005FAF (blau accessible)

Exemple:

Justificació d’aquesta selecció

Blanc + quasi negre dona el contrast més fort possible i sempre compleix AAA.
El blau #005FAF és un color molt utilitzat en disseny accessible perquè:
- Manté identitat visual
- Funciona sobre blanc i sobre negre
- Supera AA per a text i elements interactius

Utilitza l'eina Color Contrast Checker o WebAIM Contrast Checker per avaluar el contrast de la paleta de colors. Adjunta la imatge resultant.

1) Blanc (#FFFFFF) sobre negre (#1A1A1A)

2) Blau (#005FAF) sobre blanc (#FFFFFF)

2. Selecció de textura o patró de fons

Tria d’una textura suau o patró SVG

Textura triada

He triat un patró SVG molt suau, format per línies lleugerament ondulades i amb una opacitat baixa. Aquest tipus de patró crea profunditat sense distreure l’usuari ni dificultar la lectura.

Explicació: Què significa saturar una pàgina amb textura?

Una pagina està saturada a nivell de textura quan:

La textura és massa detallada o té massa elements repetits.
Els colors són molt intensos o contrasten massa.
Distrau l’atenció del contingut principal.
Dificulta llegir el text o veure correctament botons i seccions.

Per tant, una textura suau ha de tenir:

pocs detalls
colors neutres o opacitat baixa
repetició regular i no invasiva
compatibilitat amb text accessible

Origen de la textura i motiu de l’elecció

He extret el patró de la web:

www.svgbackgrounds.com

Motiu de l’elecció:

Proporciona patrons SVG simples i nets.
Es poden personalitzar colors i opacitat.
La càrrega és molt lleugera.
Manté una aparença moderna i professional.

Captures

explicació:

He afegit la textura a la pàgina web utilitzant css.Primer he descarregat la textura des de (nom de la web). Despres l’he guardat dins la carpeta del projecte. Finalment, he afegit la textura com a background-image dins l’arxiu styles.css.

Captura de la web d’on s´ha tret la textura: