ISSN 1312-0379
За сайта | Карта на сайта | Контакт | F.A.Q.

Главна > Статии > Мнения

Дао на уеб дизайна. От Джон Алсъп.

Въведение

Това, което беше Дзен през седемдесетте (особено за поддържането на мотоциклет), през деветдесетте беше Тао Те Чинг. Мнозина виждаха смисъл в това да прилагат Тао Те Чинг в неща като Прасчо и Мечо Пух или пък физиката (Тао на Физиката) и обратно - да прилагат нещо към Тао (Тао на Пух). Изглежда като евтин номер, но по-късно открих, че като се вгледаш през призмата на Тао, можеш да разбереш доста за уеб дизайна.

Даоизмът е философия, подобно на Будизма, начин на живот, начин да бъдеш на този свят. Той е почерпен от един текст, запазен от древни времена - Тао Те Чинг, чиито 81 "глави" загадъчно блуждаят из човешкия опит, но имат една обща идея - тази за хармонията.

За добро или лошо, през последните няколко години моят живот се въртеше около style sheets. Писах софтуер, наръчници и пътеводители за тях; отговорих на неизброимо количество въпроси за тях по нюзгрупите и по e-mail; борих се за тяхното възприемане чрез The Web Standards Project. И така бавно започнах да разбирам уеб дизайна по съвсем различен начин заради тях, а и прозрях силната връзка между дизайна и Тао.

Това, което чувствам е едно напрежение между мрежата такава, каквато я познаваме и мрежата - каквато трябва да бъде. Това е противоборство между една съществуваща медия - на печатото издание, и нейното дете - мрежата. Време е вече да разберем отношенията между родител и дете и да пуснем детето да върви по своя собствен път.

Добрата стара нова медия?

"Старите йерархии трудно се изкореняват;
старата вяра не се изоставя лесно;
така ритуалът поробва поколение след поколение."
Тао Те Чинг; 38 Ритуалът

Ако никога не сте гледали стари телевизионни програми то трябва да знаете, че са доста поучителни. По онова време телевизията често е била описвана като "радио с картинки", а това е едно доста точно описание. Много от телевизиите следвали схемата на по-популярното по това време радио. Всъщност програми като Шоуто тази вечер и неговите варианти, които могат да се видят във всяка една телевизия по света (включва оркестър, разговор с водещия и седналите гости), или пък новините прочитани от сериозен, костюмиран говорител, са следите на медията, от която се появи телевизията - радиото, т.е. един завет от миналото на медията.

Същото е и с първите музикални клипове (малко от нас са чак толкова възрастни, че да помнят). В общи линии те представляваха група, в ролята на самата себе си, изпълняваща някоя песен. Завладяващо зрелище.

Когато новата медия заема нещо от съществуващата такава, понякога то има смисъл, но в повечето случаи е безсмислено, "ритуал", и често ограничава новата медия. С течение на времето новата медия развива свои собствени и отхвърля съществуващите безсмислени правила.

Ако някога гледате стара теливизионна драме ще забележите пример точно за това. Понеже радиото изисква присъствието на разказвач, който да описва на слушателите това, което не могат да видят, то и в ранните телевизионни драми често има разказвач, който описва това, което зрителите могат да видят. Това е прост, но внушителен пример за това, което се случва, когато една нова медия се заражда от друга - вече съществуваща.

Мрежата е нова медия, която се появи от медията на печатните издания и чиито похвати, дизайнерски символи и закономерности силно и влияят. Все още тя прилича прекалено много на това, от което беше породена. Обикновенно "убийствени уеб сайтове" са тези, които опитомяват дивата мрежа, ограничвайки страниците все едно са отпечатани върху хартия - предпечатна подготовка за интернет. Този консерватизъм е естествен - "старата вяра не се изоставя лесно", но е време да тръгнем напред, да приемем мрежата като една нова медия. Време е да изоставим ритуалите на старата печатна страница и да възседнем новата медия, есещайки истинската и природа.

Това не значи, че изведнъж трябва да се откажем от мъдростта на стотиците години печатно дело или на хилядите години писменост. Ние трябва да разберем кои от техните уроци важат за интернет и кои са просто ритуали.

Контролът върху уеб страниците

Мъдрецът

"... приема възходите и паденията,
подготвя ги, но не ги изживява,"
Тао Те Чинг; 2 Отделяне

Ако прекарате известно време в нюзгрупите и мейллистите за уеб дизайн и ще откриете някои ключови думи и идеи, които се повтарят през цялото време. Разбира се най-често въпросът е "Как да ...?" Но зад въпроси като "как да накарам страниците си да изглеждат по един и същи начин на всички платформи" и "как да накарам шрифтовете ми да изглеждат еднакви в Макинтош и в Уиндоус" се крие въпроса ""как да контролирам броузъра на потребителя?" всъщност думата контрол се появява изненадващо често.

В основата на всичко това е вярата, че дизайнерите са надзиратели (помилсете си за смисъла на термина "пиксел механик"). Дизайнерите искат да променят желанията на потребителите и решенията, които са взели по отношение на това, което искат да виждат (променяйки големината на шрифта, например). Дизайнерите искат да предскажат разликите в платформите (за пример - стандартното разрешение на екрана при Макинтош е 72dpi, а при Уиндоус е 96dpi). Дизайнерите са всезнаещите и няма да приемат нищо друго освен изображение, което във всички броузъри е точно като на техния собствен екран с точност до пиксел.

Естествено това е преувеличение, но не голямо. Убедителен пример за това е често изказваното разочарование от факта, че CSS, не са "предпечатна подготовка за интернет". Ако сте с Макинтош вече знаете колко много от големите сайтове злоупотребяват с CSS, за да направят страниците си просто неразбираеми. Възможно е те да използват пикслели или точки, като мярка за големината на шрифта. В основата на този избор се крие философията, че "дизайнерът е надзирател".

Откъде идва тази идея? Вярвам, че тя извира от медията на печата. В печатните издания дизайнерът е господ. От WYSIWYG се разви огромна индустрия, а много от уеб дизайнерите са дълбоко свързани с вярванията и практиките, с ритуала на тази медия. Като дизайнери ние трябва да преосмислим тази роля, да изоставим надзирателството и да търсим едно ново отношение, когато става въпрос за страницата.

Защо това е важно?

"Новороденото е нежно и крехко,
старецът - твърд и груб.
Живите растения и животни са гъвкави и сочни;
мъртви са повехнали и сухи.
Така нежността и крехкостта са присъщи на живота,
а твърдостта и грубостта - на смъртта."
Тао Те Чинг; 76 Гъвкавост

Възможно е невъзможността да се "контролира" страницата да е ограничение, грешка на мрежата. Когато идваш от света на WYSIWYG, да смяташ така е първичният ти инстинкт. Признавам, че това беше първата ми реакция, а и убеждение, което се задържа дълго време. Но вече не смятам, че е ограничение. Виждам, че това е силата на новата медия.

Нека погледнем през другия край на микроскопа. Фактът, че можем да контролираме печатната страница е истинско ограничение на тази медия. Можеш да си кажеш - мога да променя големината на текста - или пък да си кажеш - големината на текста е неизменима. Можеш да си мислиш - размерите на страницата могат да се контролират - или пък да си мислиш - размерите на страницата не могат да се променят. Това са просто истините на тази медия.

И не е обезателно това да са добри истини, особено за читателя. Ако зрението на читателя не е като на орел, има вероятност дизайнерът да е направил нещата прекалено малки и да не ти е приятно да четеш без някакво увеличение. Ако читателят е на определено място - във влака на път за работа, в самолет, то вестниците с голям формат са прекалено големи. И читателят не може да направи почти нищо по въпроса.

Контролът, който дизайнерите познават от печатните издания и често искат да имат в интернет, е просто функция на ограничението на печатната страница. Би трябвало да приветсваме факта, че мрежата няма същите рамки и да правим дизайн в синхрон с тази гъвкавост. Но първо трябва да премем "възходите и паденията"...

Настройване = достъпност

"Най-добрият човек е като водата,
която облагородява всички неща и не се състезава с тях,
която тече през места, които другите пренебрегват
и където тя е в хармония с Пътя."
Тао Те Чинг; 8 Водата

Има хора, които смятат, че фатализмът е присъщ на Дао. Най-простото четиво трябва да изненадва, без план, позволявайки нещата просто да стават и да реагира. Мился за това като казвам, че не трябва да се ограничаваме от своя план, с цели далеч в бъдещето, а да можем да се променяме, да не сме затворени в собствените си виждания или насоки.

"Да наблюдаваш детайлите е яснота,
да поддържаш гъвкавостта е сила;
използвай светлината, но не разпръсквай светлина
така че да не си навредиш
и да запазиш яснотата."
Тао Те Чинг; 52 Яснотата

Приемам гъвкавостта, за която говорих до сега, за "възможност за приспособяване". Всичко, което казах до сега може да бъде обобщено така: правете страници, които могат да се приспособяват/настройват. Правете страници, които са достъпни, независимо от броузъра, платформата или разширението, което е избрал или трябва да използва вашият читател. Това означава страници, които са разбираеми във всякакво разширение на монитора, или големината му, или цветовете му (и помнете, че страниците могат да бъдат разпечатвани, прочитани на глас от софтуер за симулиране на човешка реч или прочетени от брайлови броузъри за слепи). Това означава - страници, които да могат да се променят според нуждите на читател, който е със слабо зрение и иска да чете страници с много големи размери на шрифта

Създаването на страници, които могат да се настройват, означава създаване на достъпни страници. Вероятно най-голямото обещание на мрежата, което все още не е изпълнено, е че информацията ще бъде достъпна, независимо от трудностите. Това е най-важния принцип на World Wide Web Consortium и се превръща в императив за уеб дизайна, защото ското законът ще се изисква уеб страниците да предлагат универсален достъп, също както законите за собствеността върху сградите в цял свят изискват да се осигурява достъп до сградите.

Да се направи универсалната уеб страница изглежда невъзможно. Вероятно сега това е само намерение, с тези чупливи броузъри, а и устройствата, чрез които ще сърфираме вероятно все още не са се появили на бял свят, но и сега можем да направим много, за да поставим основите на страници, които ще се настройват към желанията и нуждите потребителите и по този начин ще бъдат достъпни.

Пътят

"Пътят се оформя чрез използване,
но след това формата се губи.
Не бързай да се върнеш към формата,
а остави чувството да се влее в света,
както реката се влива в морето.
Тао Те Чинг; 32 Форми

И така, как да се създава нещо променливо и следователно достъпно? Първо няколко начина на мислене биха били полезни. После имам няколко практически препоръки за стъпките, които можете да направите, за да не създавате недостъпни страници.

Първо, помислете за това какво правят вашите страници, а не как изглеждат. Нека вашият дизайн да следва услугите, които ще предлагате на своите потребители, вместо да се съобразявате с някаква всевластна идея за това как трябва да изглеждат. Нека формата следва функцията, вместо да правите някакъв дизайн и да го карате да "заработи".

Основният момент в тази идея е да се отдели съдържанието от неговия външен вид. Вероятно сте чували това хиляди пъти, но това е най-важната стъпка, която можете да направите. Нека вземем един прост пример. На дадена страница има текст, който е курсивен. Защо е в курсив? Може да е, за да наблегне на нещо. Може да е цитат. Може да е чужда дума. В традиционния печат, формата следва функцията. предимството на мрежата е, че можем да превърнем нещо имплицитно, когато е отпечатано, в същото, но експлицитно, когато е публикувано в интернет. Ако курсивът е, за да подчертае смисъла, то защо да използвате елемента <i>? Използвайте <em>, за да могат броузърите на потребители, които не са с РС, да се справят с елемента правилно.

Ако гледаме в по-общ план, то не използвайте HTML за оформяне на външния вид. Никакви <font>, <b> или <i> или други елементи за оформяне. Когато HTML предлага подходящ елемент, използвайте го. Където няма, използвайте CSS. И разбира се използвайте CSS, за да оформите външния вид на информацията си. Време е да погледнем в бъдещето, а не да се вкопчваме в миналото.

Ако изполвате CSS правилно - за да подскажете как да изглежда страницата, а не за да контролирате външния и вид - и не разчитате на вашите CSS да предават информация, то страниците ви ще изглеждат добре на всеки броузър. Броузерите, които не поддържат CSS, просто представявт страниците малко по-семпло. Най-голямата ни грижа са броузерите, които разбират стиловете погрешно. Днес това е проблем. Но не след дълго това вече няма да е толкова страшно. Засега можете да се ограничите с набор от стилове, които се поддържат доста добре и имат доста по-добър ефект отклкото представянето чрез HTML. Аз съм писал доста по този въпрос и другаде, така че няма да се повтарям тук.

В частност има някои неща, които трябва и които не трябва да правите, когато съставяте CSS, имащи отношение към възможността за настройка на вашите страници. Преди всичко не очаквайте всеки аспект от CSS да прави страницата ви по достъпна. Абсолютните единици като пикселите и точките трябва да се избягват (ако това ви изненадва, продължавайте да четете), а цветовете трябва да се използват внимателно и да не се разчита на тях.

Шрифтове

Обикновено в Уиндоус, Макинтош или някоя друга система са инсталирани само няколко основни шрифта. Между тези различни системи съществуват разлики точно в тези набори шрифтове. Вече в много броузъри, а и в още повече в бъдеще, потребителите могат да решават с кои шрифтове искат да разглеждат интернет страниците. Чрез CSS, можете да предположите броя и да покриете колкото се може повече набори от шрифтове. Но не разчитайте даден шрифт да е инсталиран, колкото и популярен да е.

Все още по-важна е големината на шрифта. Може би знаете, че при една и съща големина на точката, един шрифт изглежда по-малък на Макинтош, отколкото в повечето Уиндоус системи. В общи линии това се дължи на факта, че "логическото разрешение" при Макинтош е 72dpi, а при Уиндоус стандартно е 96dpi. Затрудненията възникващи в следствие на това са значителни. Първо, то гарантира, че текстът никога няма да изглежда по един и същи начин на Макинтош и на РС. Но ако сте възприели вярата, че трябва да има възможност за настройка, то това няма да има значение.

Моля? Ако ви е грижа за това как точно ще изглеждат страниците ви, то това е знак, че все още не мислите за страници, които могат да се настройват. Един от най-големите въпроси пред достъпността е големината на шрифта. Малките шрифтове се четат по-трудно. За тези от нас, които са с добро зрение, може да прозвучи шокиращо, но по-голяма част от хората изпитват трудности при четенето на нещо, коетое по-малко от 14pt times на хартия. От екран се чете по-трудно отколкото от хартия, защото разрешението (resolution) е по-малко.

Това означава ли, че минималната големина на шрифта трябва да е 14 pt? Това не помага на тези, които имат още по-слабо зрение. И така коя е минималната големина на шрифта, която трябва да използваме? Никаква. Не използвайте точки. Това позволява на читателите да избират големината, която предпочитат. Същото се отнася и до пикселите. Поради факта, че логическото разрешение на различните системи е различно, един пискел на едната платформа не е същия пискел в другата.

Въпреки това все още ще можете да предлагате по-големи размери на шрифта за заглавията и другите елементи. CSS предлага няколко начина, чрез които може да се подскаже каква да бъде големината на текста, запазвайки възможността за настройка. Ще разгледаме един от тях, за да разберем идеята.

Чрез CSS вие можете да определите големината на шрифта в процент от някой основен елемент. Например, загалвията са подчинени на елемента BODY. Ако не укажете големината на шрифта в елемента BODY, то текстът ще се появи с големината, която потребителят предпочита. По този начин предлагаме възможност за настройка и то просто без да правим нищо!

Можете да възразите - "текстът изглежда прекалено голям", ако останем само с направеното дотук. Направете го по-малък, но във вашия броузър. В такъв случай вашите читатели също ще имат възмоността да го направят по-голям или по-малък в своите броузъри, в зависимост от техните вкусове или техните нужди.

Като използваме големина на шрифта бихме могли да накараме заглавията и други елементи да се открояват, като определим заглавията от level 1 да бъдат с 30% по-големи от останалия текст, заглавията от level 2 - с 25% по-големи и т.н.. Така независимо от големината, която потребителят ще избре за основния текст, заглавията ще са пропорционално по-големи от нея. По подобен начин може да се определи големина на шрифта, която да е по-малка от тази на основния текст, но това може да доведе до ситуации, в които текстът да не може да се чете, така че внимавайте.

Направихме наистина много малко, като просто избегнахме употребата на абсолютни велични за големината на шрифта, а вече възможността за настройка на страниците ни и тяхната достъпност са значително по-големи.

Външният вид

Полетата, ширината на страниците и подравняването са аспекти на дизайна, които могат да подпомогнат четенето. Мрежата създава проблеми на дизайнерите с всеки един от тях. Прозорците на броузъра могат да бъдат увеличавани и намалявани, а така се промени и ширината на страниците. Различните устройства за интернет (WebTV, големите монитори или персоналните бележници) се различават по отношение на възможно най-големите или най-малките размери на прозорците си. Както и при фиксираните размери на шрифта, фиксираните размери на прозорците могат да доведат до проблеми с достъпността.

Както и при шрифтовете, при оформянето на външния вид на страниците могат да се използват проценти, за да се създават страници с възможност за настройка. Полетата могат да се определят като процент от елемента, който ги съдържа.

Използването на проценти (или други относителни величини), за да се определи външния вид на страницата в CSS, автоматично дава на нашите страници по-големи възможности за настройка. При промяна на широчината на прозорците, външният вид на даден елемент също се променя, за да запази същите пропорции и като цяло външният вид на страницата също се настройва. Читателите могат да изберат широчна на прозореца, която им отговаря най-точно на нуждите им.

Полетата, изравняването на текста и други елементи на външния вид също могат да се определят съответно на голмеината на текста, който съдържат, използвайки единицата em. Ако определите


P {margin-left: 1.5em}

казвате, че полето от ляво на параграфа трябва да 1.5 пъти големината на шрифта в параграфа. И така, когато потребителят промени големината на шрифта, за да направи страницата по-лесна за четене, полето се увеличава пропорционално, а ако я намали отново, то полето пак ще се настрои.

Цветове

Мрежата е медия с много повече цветове, отколкото печатната страница. Цветът в мрежата е по-евтин. Цветът може да се изполва за украса, за да се създаде визуална идентичност, а може да има и практическа стойност (червеното може да привлече вниманието към важна информация). Но цветовете поставят трудности пред достъпността.

Знаете ли, че в много страни (ако не и навсякъде), далтониците не могат да получат разрешително за пилот на самолет? Това е така, защото, за разлика от всички други способности, информацията свързана с опасност е свързана в повечето случаи с червения цвят, а тази за сигурност - със зеления. Просто е срамота, че предпазните индикатори не могат да се настройват.

Отпращат ли по подобен начин страниците ви хора? Би било срамота ако е така, защото в скоро време повечето броузъри ще предоставят възможност на потребителите да заместват вашите CSS и така да променят цвета на елементите. (Това е възможно в IE5 за Макинтош).

Как да избегнем тези проблеми? Използвайте CSS вместо елемента <font> в HTML. Освен това не разчитайте единствено на цветовета, за да внушите желаното значение.

Пътуването

"Дърво по-широко от човек може да се зароди от мъничко зърно;
Реката може да бъде преградена от бент, започнал от бучка пръст;
Пътуване от хиляди километри започва от мястото под нечий крак."
Тао Те Чинг; 64а Внимание в Началото

Да промениш начина си на мислене и поведение не е лесно. "Старите вярвания не се изоставят лесно". Но постепенно разбрах, че трябва да преосмисля голяма част от това, което съм считал за сигурно. Съдейки по това, което съм видял, по разговорите ми, по електронната поща, която съм изчел през последните няколко години, мнозина все още са със старите си вярвания и също имат нужда да ги преосмислят.

Сега е времето интернет медията да надрастне своите корени в печатната страница. Не да изостави цялата тази мъдрост и опит, а да тръгне по свой собствен път, където е възможно.

Вярвам, че най-голямата сила на мрежата често се възприема като ограничение, като дефект - тя е пластична по своята същност. Нашата роля като дизайнери и разработчици е да възприемем тази пластичност и да създаваме страници, които са достъпни за всички.

Пътуването започва, когато изоставиш контрола и приемеш пластичността.