Добавлен новый раздел, посвящённый HTML5, в котором собраны воедино материалы сайта об этой технологии.

В дополнение к формату PDF сделана локальная версия справочника CSS в формате CHM. Это популярный формат справки для операционной системы Windows, который позволяет в одном файле хранить веб-страницы, изображения и скрипты. Кроме того доступна удобная навигация, поиск и добавление отдельных страниц в Избранное.

Выглядит это все наглядно и красиво. Подсветка синтаксиса в примерах имеется.

Стоимость 35 рублей. Цена смешная, сам бы взял, но у меня уже есть.

По многочисленным просьбам добавил для приобретения обновленный справочник CSS в формате PDF.

Справочник содержит описание работы стилевых свойств, псевдоклассов и псевдоэлементов. Приведена таблица браузеров с номерами версий, которые поддерживают указанное свойство, синтаксис написания, допустимые значения, наследование и к каким элементам свойство применяется. Каждое свойство иллюстрируется примером, который показывает область его применения. В большинстве случаев приводится рисунок, демонстрирующий результат примера, что позволяет наглядно понять, как действует то или иное свойство CSS.

Включены свойства CSS3, а также свойства характерные для браузеров Firefox, Opera, IE, Safari и Chrome.

Стоимость всего 35 рублей, оплатить можно разными способами, например, через WebMoney, Яндекс.Деньги, терминалы оплаты и др. Если вам нравятся материалы сайта, можете считать приобретение справочника формой поддержки. Заодно получаете и полезный материал, который всегда рядом.

Написание статей — мощный инструмент маркетинга, позволяющий раскрутить ваш ресурс.

Вебмастера и владельцы рассылок всегда ищут хороший контент для статей. Статьи — это лучшая бесплатная реклама для вашего сайта.

Вот 10 советов, как создать эффективную статью.

1. Перед тем, как приступить к написанию статьи, сядьте, и ответьте на вопрос: какую проблему вы поможете решить этой статьей?

2. Захватите внимание читателя. Если это возможно, захватите внимание читателя сразу же, используя эффективный заголовок. Первый же параграф должен просто заманить читателя и не дать ему расслабиться. Используйте первый параграф как вводную аннотацию к самой статье.

3. Пишите для одного человека. Забудьте о том, сколько людей прочтет вашу статью. Вы должны писать только одному человеку, так, как сейчас я пишу вам.

4. Поддерживайте логическую цепь. Избегайте набора несвязанных между собой идей. Каждый следующий блок текста должен логически продолжать предыдущий.

5. Используйте цитаты, чтобы поддержать вашу основную идею. Высказывания известных людей — лучший метод укрепить ваши идеи. Они помогут укрепить ваш авторитет.

6. Делайте ваши параграфы краткими. Идеальный объем текстового блока 4–6 строк. Они выглядят более читабельными.

7. Вдохновите на действие вашей статьей. Если ваша статья направлена на решение проблем, дайте читателю конкретный план действия.

8. Когда это возможно, связывайте ваш текст сравнением с простыми действиями или фактами. Например, «Жизнь — как коробка конфет». Периодически упрощайте текст подобными сравнениями, облегчая его восприятие. Применяйте ваши идеи в жизни ваших читателей.

9. Подведите итог. Изложите основные мысли в последних 1–2 параграфах. Обозначьте, какие действия читатель может предпринять, и чего он при этом достигнет.

10. Теперь не забудьте о самом главном: текст-блок информации о вас. Напишите ваши фамилию и имя, род вашей деятельности, контактный адрес. Затем укажите свой URL, если он у вас есть.

Практическое применение этих советов даст большой отклик от читателей.

Изображения и фоновые рисунки позволяют легко изменить вид текстовых полей и кнопок для отправки формы на сервер. Как обычно, вначале требуется нарисовать желаемые элементы в графическом редакторе (рис. 1), а затем сделать отдельные изображения для каждого поля.

Конечно, Internet Explorer содержит большое количество ошибок в разных версиях, но с помощью условных комментариев с ними можно бороться, добиваясь их устранения. Но вот чего нельзя ничем исправить, так это то, что IE безнадёжно устарел. Пока остальные браузеры включают всё больше свойств CSS3, поддерживают различные новомодные технологии, IE топчется на месте. Выход IE9 не решит проблему, предыдущие версии от этого в одночасье не испарятся. В такой ситуации наилучшим решением будет изящная деградация (graceful degradation) — принцип сохранения работоспособности при потере части функциональности.

В IE6 содержится некоторое количество ошибок, так или иначе связанных со свойством hasLayout. Непосредственно установить его нельзя, но можно сделать это косвенно. Так что большинство проблем связанных с этим свойством можно исправить его установкой, добавляя в стилях элементу zoom: 1 или height: 1%. Эти свойства кроме своих непосредственных характеристик устанавливают hasLayout.

Блочные ссылки это приём, который активно используется в различных меню, таким способом повышается полезная площадь ссылки. В IE6 если ссылка установлена блочной с помощью display: block она не занимает доступное пространство родителя и ссылкой является только текст. Эта ошибка проявляется в том случае, когда к родителю добавляется свойство float (пример 1).

Некоторые ошибки в Internet Explorer можно обойти, установив для элемента «лейаут». Большинство пользователей не подозревают о значениях «лейаута» применяемого к элементу. Данный документ объясняет, что происходит, когда элемент содержит «лейаут» и последствия этого.

В квитанциях, купонах или газетах порой можно встретить пунктирную линию с изображением ножниц и надписью «линия отреза». Такая фраза говорит, что надо отрезать этот кусок по приведённой линии, чтобы в дальнейшем использовать по назначению. На сайтах подобные инструкции не имеют никакого смысла, никто тыкать в монитор ножницами в здравом уме не станет. Но можно использовать горизонтальную линию в качестве элемента дизайна страницы, к примеру, для визуального отделения одного материала от другого.

Наша линия будет содержать три элемента: саму пунктирную линию, рисунок половины ножниц и надпись «линия отреза». На рис. 1 показано, что хотелось бы получить в итоге.

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

Самоучитель HTML доступен теперь в формате PDF. В отличие от самоучителя CSS он не претерпел никаких изменений и является калькой материала с сайта.

Скачать в архиве (1,57 Мб)

Файл распространяется по лицензии Attribution-NonCommercial-NoDerivs 2.5 Generic (CC BY-NC-ND 2.5), так что вы можете свободно копировать, пересылать и публиковать этот материал у себя.

Оригинал статьи на английском: http://www.alistapart.com/articles/previewofhtml5

Перевод: Влад Мержевич

Сеть постоянно развивается. Новые и инновационные сайты создаются каждый день, расширяя границы HTML в каждом направлении. HTML4 был вокруг нас в течение почти десяти лет, и издатели ищут новые методы, чтобы обеспечить расширенную функциональность, которая сдерживается ограничениями языка и браузеров.

Чтобы дать авторам больше гибкости и совместимости, сделать их сайты и приложения более интерактивными и захватывающими, HTML5 вводит и расширяет диапазон возможностей, включающий элементы форм, API, мультимедиа, структуры и семантики.

Сайт переехал на другой хостинг, так что проблем с доступом больше не будет. Спасибо Виктору Степанькову и Алексею Колосову за помощь с переносом.

Самоучитель CSS доступен теперь в формате PDF. Практически это тот же текст, что и на сайте, но слегка доработан и дополнен. Также добавлено две новые главы «Валидация CSS» и «Идентификаторы и классы», которые не представлены на сайте. Еще один довод скачать файл.

Скачать в архиве (2,13 Мб)

Файл распространяется по лицензии Attribution-NonCommercial-NoDerivs 2.5 Generic (CC BY-NC-ND 2.5), так что вы можете свободно копировать, пересылать и публиковать этот справочник у себя.

У разработчика сайта не так и много средств по изменению вида шрифта, в частности вообще нет способа управления сглаживанием текста. Кто не в курсе, это способ сделать буковки более гладкими за счет добавления пикселов разных цветов. Если увеличить текст в Windows, то это становится хорошо заметно (рис. 1).