Практика показывает, что если тире или кавычки — это первое, что изучают при появлении интереса к «типографике» (а на самом деле — к грамотному набору текста), то правильное употребление апостро́фа, знаков минут и секунд, знака ударения вызывает почему-то бо́льшие затруднения. На самом деле, всё очень просто, и статья будет довольно короткой. Всё, о чём будет сказано ниже, относится к современной русской традиции типографики.
Ihor Zenich @Delka
Frontend Developer for EPAM Systems
Всё ли так просто с многоточием?
7 min
94K
Многоточие (эллипсис, от греч. ellipsis — незаполненность) — самостоятельный типографский знак, разновидность отточия, состоящий из трёх точек идущих подряд, используется для обозначения скрытого смысла, особенностей устной речи (вздох, пауза, задумчивость), недосказанности либо для исключения из текста некоторых слов, например при цитировании.
+112
2+3
1 min
714Маленькая заметка о том как запускать несколько разных версий Лиса. Простым пользователям нафиг ненадо, а вот вебразработчикам и кодерам пригодится.
Предположим у вас уже есть Лис версии 2.0.*, и вы стремясь к рекорду скачали 3.0. Не спешите ставить, если все пустить на самотек — установку по умолчанию то затрется ваш предведущий профайл. Поэтому запускаем уже установленую версию фокса с ключем -ProfileManager, примерно так firefox -ProfileManager.
Создаем дополнительный профайл, после чего начинаем установку третьей версии. Ее необходимо ставить отдельно не в туже директорию, я выбрал директорию рядом. Получилось примерно так, особой гениальностью я не блистаю потому и приставка к версии.
А теперь давайте создадим башскрипт firefox.bat который собственно и будет запускать фокс
Это мой батник, под мои условия установки (всего 1 файл). Если у вас пути отличаются или профайлы по-другом называются, измените его под свои условия, или создайте для каждой версии свою версию. Я же создал два ярлыка для башскрипта, и пеердаю в качестве аргумента версию Лисицы.
Ну а теперь задача за малым, как различать версии по ярлыкам? Просто укажите путь к новым иконкам которые вы можете взять со следующих источников
Спасибо за внимание.
Предположим у вас уже есть Лис версии 2.0.*, и вы стремясь к рекорду скачали 3.0. Не спешите ставить, если все пустить на самотек — установку по умолчанию то затрется ваш предведущий профайл. Поэтому запускаем уже установленую версию фокса с ключем -ProfileManager, примерно так firefox -ProfileManager.
Создаем дополнительный профайл, после чего начинаем установку третьей версии. Ее необходимо ставить отдельно не в туже директорию, я выбрал директорию рядом. Получилось примерно так, особой гениальностью я не блистаю потому и приставка к версии.
Версия | Куда поставил | Профиль |
---|---|---|
2.0.14 | C:/Program Files/Firefox/2.0.14/ | 2.0.14 |
3.0 | C:/Program Files/Firefox/3.0/ | 3.0 |
А теперь давайте создадим башскрипт firefox.bat который собственно и будет запускать фокс
@echo off set MOZ_NO_REMOTE=1 start "" "C:\Program Files\Firefox\%1\firefox.exe" -p %1 set MOZ_NO_REMOTE=0
Это мой батник, под мои условия установки (всего 1 файл). Если у вас пути отличаются или профайлы по-другом называются, измените его под свои условия, или создайте для каждой версии свою версию. Я же создал два ярлыка для башскрипта, и пеердаю в качестве аргумента версию Лисицы.
Ну а теперь задача за малым, как различать версии по ярлыкам? Просто укажите путь к новым иконкам которые вы можете взять со следующих источников
Спасибо за внимание.
+25
Картинки в теле страницы с помощью data: URL
1 min
4.9KTranslation
Примечание: ниже расположен перевод статьи «Inline Images with Data URLs», в которой рассматривается вопрос о внедрении картинки на веб-страницы при помощи
Встроенные (inline) изображения используют схему
Хотя Opera 7.2+, Firefox, Safari, Netscape и Mozilla поддерживают
читать дальше на webo.in →
data:URI
. Эта схема позволяет вставить код картинок прямо в (X)HTML-страницу без обращений к внешним файлам, что уменьшает общее количество HTTP-обращений к серверу. Мои комментарии далее курсивом.Встроенные (inline) изображения используют схему
data:URI
для внедрения прямо в тело веб-страницы. Как было определено в RFC 2397, такие URI предназначены для вставки небольших объектов как «непосредственные» данные. Такие объекты должны рассматриваться так же, как и любые другие внешние файлы. Использование встроенных изображений позволяет сэкономить HTTP-запросы к внешних ресурсах.Поддержка браузерами data:URL
Хотя Opera 7.2+, Firefox, Safari, Netscape и Mozilla поддерживают
data:URI
, Internet Explorer 5–7 совсем нет. Однако, сообщается, что Internet Explorer 8 будет поддерживать эту схему, так как проходит Acid2 тест, что позволяет использовать data:URL
как реальную альтернативу для внедрения небольших декоративных изображений. Существует также несколько приемов для поддержки старых версий Internet Explorer.читать дальше на webo.in →
+46
Вредная верстка
9 min
74KКак определить, что сайт сверстан качественно?
Есть много статей о том, как делать хорошо, но совсем нет – о том, как делать не надо, ведь даже валидный и кроссбраузерный сайт может быть сверстан отвратительно.
Есть много статей о том, как делать хорошо, но совсем нет – о том, как делать не надо, ведь даже валидный и кроссбраузерный сайт может быть сверстан отвратительно.
Из этой статьи вы узнаете:
- О плохих приемах современной верстки;
- О том, как даже не будучи профессионалом, за 5 минут определить плохо ли сверстан сайт или нет.
+147
Оформление цитат на сайтах
8 min
94KОбычно при вёрстке текстов для веба на оформление цитат не обращают достаточного внимания. Стараясь исправить это досадное недоразумение, мы коснёмся двух вопросов: типографического оформления цитат (в той части, где чаще всего допускаются ошибки при вёрстке) и реализации этого оформления в HTML-коде.
Мы также не будем касаться вопросов проверки смысловой точности цитирования, правильного использования купюр, сокращений и дополнений — всех интересующихся ждёт «Справочник издателя и автора» А. Э. Мильчина и Л. К. Чельцовой.
Надеемся, что эту запись будет удобно использовать как справочник по часто встречающимся вопросам оформления цитат.
Мы также не будем касаться вопросов проверки смысловой точности цитирования, правильного использования купюр, сокращений и дополнений — всех интересующихся ждёт «Справочник издателя и автора» А. Э. Мильчина и Л. К. Чельцовой.
Надеемся, что эту запись будет удобно использовать как справочник по часто встречающимся вопросам оформления цитат.
+102
Yahoo Search будет индексировать микроформаты
1 min
1.2KВ качестве очередного шага на пути к созданию открытой поисковой платформы, компания Yahoo объявила о поддержке микроформатов и других семантических веб-стандартов. Таким образом, разработчики могут смело внедрять в HTML-код данные hCard, hCalendar, hReview, hAtom и XFN, а также создавать структурированные фиды на RDF и eRDF. Поисковый робот Yahoo будет корректно распознавать перечисленные микроформаты и добавлять информацию в общую базу.
Многие продвинутые сайты, такие как LinkedIn, уже давно используют микроформаты, но у рядовых разработчиков до сих пор не было мощного стимула для использования структурной разметки. Поддержка микроформатов со стороны поисковых систем может стать таким стимулом.
Было:
Будет:
Многие продвинутые сайты, такие как LinkedIn, уже давно используют микроформаты, но у рядовых разработчиков до сих пор не было мощного стимула для использования структурной разметки. Поддержка микроформатов со стороны поисковых систем может стать таким стимулом.
Было:
Будет:
+27
CSS только для Mozilla (в том числе — FireFox)
1 min
19KУ верстальщиков до сих пор возникает задача — подключить стили только для определённого браузера. Для IE проблема решаема — мало кто из верстальщиков не знает что такое conditional comments. Но исчезающе малое количество народу знает про per-site user stylesheet rules. Интересны они тем, что Mozilla FireFox поддерживет их через собственное правило — «@-moz-document».
Вообще, это правило позволяет подключать стили в зависимости от домена, URL или его префикса. Для нас важно, что эти правила увидит только FireFox.
Простой пример использования, из которого становится понятен общий принцип:
У приведённого примера есть недостаток — такой CSS не пройдёт валидацию, что лично для меня определяющей целью не является, но для многих это как скаутский значок.
Принципы фильтрации по URL и доменам так же могут оказаться полезными, например, в случае, если CSS для нескольких поддоменов грузится с одного адреса, где располагается вся статика. О них можно почитать, например, в архиве W3C.
P.S. Если в статье что-то не так — подскажите. Это мой первый опыт.
Оригинал статьи опубликован в моём блоге.
Вообще, это правило позволяет подключать стили в зависимости от домена, URL или его префикса. Для нас важно, что эти правила увидит только FireFox.
Простой пример использования, из которого становится понятен общий принцип:
White in FireFox
У приведённого примера есть недостаток — такой CSS не пройдёт валидацию, что лично для меня определяющей целью не является, но для многих это как скаутский значок.
Принципы фильтрации по URL и доменам так же могут оказаться полезными, например, в случае, если CSS для нескольких поддоменов грузится с одного адреса, где располагается вся статика. О них можно почитать, например, в архиве W3C.
P.S. Если в статье что-то не так — подскажите. Это мой первый опыт.
Оригинал статьи опубликован в моём блоге.
+23
Делаем закругленные уголки с помощью псевдоэлементов: before и: after
1 min
3.4KВнимание! Это все устарело, но публикацию не удаляю, чтобы все знали как мы мучались в 2007 году из-за IE6 :-)
Задача: сделать врезку с закругленными уголками с минимумом html-кода.
Задача: сделать врезку с закругленными уголками с минимумом html-кода.
+54
Боремся с толстыми шрифтами на темном фоне в Сафари
1 min
1.4KВсем известно, что на маках замечательный рендеринг шрифтов ;) Но, к сожалению, на темном фоне при сглаживании «Medium» текст выглядит очень жирным, что меня, мягко говоря, раздражает. Вот, например, кусочек меню Smashing Magazine с рендером по-дефолту:
К счастью, я нашел обходной путь этой проблемы. Заключается он в следующем: если указать тень (параметр text-shadow), то для текста с тенью включается «фотошоповский» рендеринг без субпиксельного сглаживания (Standard в System Preferences/Appearance). И никто не мешает нам сделать нулевую тень :)
Прописываем в CSS элементам такой параметр:
Вуаля! Надеюсь, этот трюк поможет эстетствующим любителям шрифтов и Сафари :)
UPD: Если вас смущает ругающийся валидатор, то могу сказать, что это баг самого валидатора, который проверяет CSS2.1, т.к. параметр text-shadow является валидным и присутствует в спецификации CSS2 и CSS3. Решение проблемы — в More Options валидатора выбрать Profile: CSS version 2 или CSS version 3.
К счастью, я нашел обходной путь этой проблемы. Заключается он в следующем: если указать тень (параметр text-shadow), то для текста с тенью включается «фотошоповский» рендеринг без субпиксельного сглаживания (Standard в System Preferences/Appearance). И никто не мешает нам сделать нулевую тень :)
Прописываем в CSS элементам такой параметр:
text-shadow: #000 0 0;
. Смотрим:Вуаля! Надеюсь, этот трюк поможет эстетствующим любителям шрифтов и Сафари :)
UPD: Если вас смущает ругающийся валидатор, то могу сказать, что это баг самого валидатора, который проверяет CSS2.1, т.к. параметр text-shadow является валидным и присутствует в спецификации CSS2 и CSS3. Решение проблемы — в More Options валидатора выбрать Profile: CSS version 2 или CSS version 3.
+34
Information
- Rating
- Does not participate
- Location
- Харьков, Харьковская обл., Украина
- Date of birth
- Registered
- Activity