CSS типография- част 5

CSS типография- част 5 Въведено на: 30.05.2010
Категория: Web дизайн и типография
Към статия: CSS типография

Създаване на четим текст

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

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

Външни препратки

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

  • Kottke.org – Сайта на Джейсън винаги е бил пример за много четим уеб продукт. Тук има доста текст и междуредовото пространство, оставящо буквите да дишат, е наистина от голяма полза.
  • Rob Weychert – Роб страхотно съчетава различни шрифтове и чист CSS, за да придаде интересен и разнообразен вид на нещата.
  • Subtraction – С вниманието си към детайла, размерите на шрифтовете и междуредовите разстояния Кхой доказва, че е възможно да използвате Arial, най-широко разпространеният шрифт в уеб, за да създадете нещо красиво.
  • A List Apart – Типографските решения на Джейсън са страхотни. Той използва курсив и главни букви, за да придаде на текста разнообразие и смел типографски почерк, като при това лежи почти изцяло на CSS.
  • Reading Online Text: A Comparison of Four White Space Layouts – Изследване за използването на... бялото пространство и четимостта на текста.
  • Текст и шрифт в уеб дизайна: основни грешки

Следващите линкове дават допълнителна информация за шрифтовете по подразбиране в Windows и Mac:

Mac

Windows

Обобщение

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

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

Автор: Гарет Даймън за Digital Web Magazine



« Предишна част

Още за CSS типография


Линкове за CSS типография



Още статии от Web дизайн и типография

Прочетете повече за Основи на типографията

28.05.2010- Основи на типографията

Тук ще кача съкратен мой превод на първата глава на една невероятна книга- The Non Designers Design Book. В нея невероятно лесно са описани правилата на печатния дизайн и просто обръща начина на мислене. Препоръчвам ви горещо да си я купите, ако я нямате.
Прочетете повече за Типографията в web- основите

25.05.2010- Типографията в web- основите

Статията е превод на наистина интересна статия за web типографията от блога ilovetypography- мястото, където най-добрите дизайнери обменят идеи за оформлението на текстове и т.н. Типографията е науката за оформянето на печатните медии.
Прочетете повече за Правилата на типографията в примера на един банер

30.05.2010- Правилата на типографията в примера на един банер

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


Категории в блога на Awsum labs




Сподели страницата




Ключови думи: web дизайн, уеб дизайн, web design, типография, css


На фокус

Dream CMS

Dream CMS събира в себе си опита на Awsum labs за проектиране на натоварени сайтове и управление на SEO. Това е може би една от най-бързите системи за управление на съдържание на българския пазар.

Портфолио

    Реклама

    Новини

    Довършен редизайн и нов javascript framework

    Довършен редизайн и нов javascript framework 09.08.2010
    Новият ни дизайн вече може да бъде обявен за довършен и изтестван. Основната разлика е в анимираните ефекти по сайта и представянето на галерии и информация на индексната страница. В него prototype и ...

    Редизайн на сайта ни

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


    Script executed in 0.0200s.