A textúra egy rettentően általánosító szó, sok mindenre használjuk, különösen a design és grafika kontextusában. A szó nyilván az anyag minőségét, tapinthatóságát, felületét jelenti, de pontosan mit is jelent ez a webdesign szempontjából? Indításnak érdemes eloszlatni a félreértéseket és megpróbálni elválasztani a két másik nagyon hasonló kategóriától, a mintától és a háttérképtől.

Minta

A minták kisméretű, mindkét tengelyen egymáshoz fűzhető, jellemzően viszonylag kontrasztos, jól kivehető ábrákból-formákból állnak, amikkel kitölthetünk felületeket.

Háttérkép

A háttérkép alapvetően egy nagyméretű, nem ismétlődő kép, amivel a lapunkat díszítjük. Jól látható, részletgazdag fotó, grafika vagy illusztráció. Központi design elem, jól látható helyre kerül.

Textúra

A textúra valahol a kettő közé esik: olyan, gyakran ismétlődő grafikai elem, ami a mintákhoz képest jóval kevésbé kivehető, véletlenszerűbb. Ahogy a neve is mutatja, a legtöbb esetben az a funkciója, hogy anyagszerűbbé, tapinthatóbbá tegye a felületeket.

A textúrák szerepe a webdesignban igazában egy letűnt korszak, a szkeumorf UI-k idején volt nagyon nagy, a textúra itt kikerülhetetlen eszköz volt, amivel a designerek kő-, bőr-, fa- vagy papírmintát tudtak kölcsönözni az oldalaik hátterének, de ma sem szabad alábecsülni egy jól megválasztott textúra hatását, bármennyire is a flat design és a minimalizmus uralkodik a trendi weboldalakon. 

Ami még mindenképpen jó hír a textúrák kedvelőinek, hogy a szemcsés, homokfújt érzetű textúrák éppenséggel megint kezdenek divatba jönni, és az elmúlt 1-2 évben megtalálták a helyüket a flat designban is. A szemcsés textúrájú felületek kifejezetten gyakran előkelő helyen szerepelnek a  2021-es év webdesign trendjei között.

A szemcsén kívül még rettentő jól állhat egy ügyes textúra vintage vagy kézműves hatású honlapok designjának is, érdemes fontolóra venni a használatát. 

A textúrák használatát, ha magába a grafikába építjük bele, természetesen magában a Photoshopban érdemes a képekbe beledogozni. Az Envato Tuts+ blogon lehet egy régi, de elég alapost tutorialt találni a textúrázás néhány alapfogásáról. Ha kicsit ügyesebben szeretnéd megoldani az oldalaid plasztikusabbá tételét, css-ből pl. az opacity használatával könnyen helyezhetsz a képeid vagy háttereid főlé valamilyen ismétlődő textúrát – ez akár egy animált gifen is alapulhat. 

Ugyan az előbb tisztáztuk, hogy mi a lényegi különbség a minták és a textúrák között, mégis figyelmetekbe ajánlom a CSS3 Patterns Gallery nevű oldalt, ahol nagyon jó, css-ben leprogramozott háttérmintákat találhattok – egy-kettő közülük kis túlzással textúrának is elmegy, és mindenképpen baromi jól néznek ki.