The World of Texture. Simple textures | WebReference

The World of Texture. Simple textures

  Simple textures

Graphic design (including, different as it is, web design) and fashion design are positioned somewhere between pure art and applied craft.  Just as there exist "haute couture" and "street fashion," it's not difficult to tell if a web page was designed with a major regard to professionals' approbation or with an attempt to please popular tastes.

Of course "high" and "low" design styles do not exist in isolation---they share a lot of common elements and actively influence each other (I've touched on this issue in a previous article).  No accounting for tastes, but the worst thing I could say about the "high" style is that sometimes it's not very practical (and is often not meant to be), even though its leading role in design evolution is beyond question.  However, "street style" can also produce great compositions, although many of them are likely to be dismissed as tawdry by professionals.

Speaking of textures, today's "haute couture" in web design prefers simple geometric textures, and of these, the most primitive one: flat, plain, homogeneous color with no texture at all.  Of course it's not surprising that of several options, the simplest one is most widely used. However, the strong standing of "flat color" in professional design still needs some explanation (especially if we compare it to the abundance of naturalistic textures on amateur pages).

I think that, besides the obvious general trend toward geometric simplicity in modern design, this can be in part attributed to the wider color repertoire of electronic media.  In absence of any texture, color is king---and the rich, vibrant colors of high color and true color systems (which only recently became available to a wide audience) bring so much life to the page that any additional texturization may only become an interference.  Also, texture is the first thing to drop when you're trying to achieve maximum impact with minimum visual means---the principle of economy is quite valid in design as it is in any other art.

However, sometimes plain color just isn't enough, and the next step on the texture complexity stairway is occupied by various geometric patterns: checkers, diamonds, circles, etc.  These textile-inspired themes are not very popular now; although perfectly geometric, they're often too symmetric and repetitive, and symmetry is of no particular value for modern designers.  I have found precious few web pages to exemplify the use of a strict geometric pattern for its own merits.


  One such example can be seen on this page.  The main error of this page is that it almost prevents you from reading any text placed over the repeating background! A simple way of avoiding this issue is to use black text and/or making the background image transparent. Both in combination would increase the readability of this page.  This background issue is further aggravated by the text floating on the page, an issue discussed in the web page format guidelines. In this case, the text changes position, depending on the size of the browser window.  

  (By the way, the postal stamp design story related on that page is particularly interesting in view of the above high vs. low design styles discussion, as the 19th Amendment stamp combines many characteristic features of the "haute couture" of modern design.)  

  Moving in another direction from the dangerous zone of interfering texture element sizes, we arrive into the quite interesting realm of pixel-sized patterns.  If you create a regular (especially striped) pattern which is a few pixels wide, the resulting surface will look neither smooth nor really rough, but can instead convey a quite involving feeling of "fine print", not unlike that of old engravings or dollar bills (which are involving, of course, not only because of their nominal value, but also because they represent a peculiar design artefact).  

Link 3:  Web Page Background For Designers (magnified)
One example of such pixel-fine texture is the pinstriped background of the "Web Page Design For Designers" site by Joe Gillespie; only in magnification you can see that the rows of light-blue pixels are fetched out by concurrent black strips.  At the Cyber Circus, another of Joe's sites, the same theme is used to implement half-transparency---a feature so regretfully lacking in the GIF image format (note the clown silhouette on the first page---it's made of checker-wise alternated black and transparent pixels).
Link 4:  The Ghost of a Cyber-Clown

  Stripes and other pixel-size patterns are not too common on the Web, although this technique is capable of creating some very interesting effects.  Beware of some related caveats, however.  Pixel-size patterns may cause all sorts of moire effects, and on low-frequency and interlaced monitors, they sometimes result in a flaming flicker which is hardly tolerable if the pattern's colors are bright.  

Created: Dec. 19, 1997
Revised: May 03, 2005