Comments on: Базовая сетка в веб-дизайне http://designformasters.info/posts/baseline-grid/ Сайт для веб-разработчиков Fri, 30 Jul 2010 02:48:55 +0000 http://wordpress.org/?v=2.7.1 hourly 1 By: Scriptin http://designformasters.info/posts/baseline-grid/#comment-6701 Scriptin Sat, 12 Jun 2010 22:13:25 +0000 http://wordpress/posts/baseline-grid/#comment-6701 Вдохновившись идеей и фреймворком <a href="http://www.blueprintcss.org/" rel="nofollow">Blueprint</a>, создал простую <a href="http://dmitry-scriptin.blogspot.com/2010/06/web-grid-builder.html" rel="nofollow">программу для генерации модульных сеток</a> (рисует сетку, которую потом можно применять для создания эскиза страницы в графическом редакторе). Может, кому-нибудь полезно будет. Вдохновившись идеей и фреймворком Blueprint, создал простую программу для генерации модульных сеток (рисует сетку, которую потом можно применять для создания эскиза страницы в графическом редакторе). Может, кому-нибудь полезно будет.

]]> By: zest http://designformasters.info/posts/baseline-grid/#comment-6089 zest Mon, 11 Jan 2010 12:13:33 +0000 http://wordpress/posts/baseline-grid/#comment-6089 Отличная статья! Пара небольших замечаний к переводу: 1) все таки надо писать <strong>сетка базовых линий</strong> (шрифта), а не базовая сетка 2) «лидинг» — это <strong>интерлиньяж</strong>, или на крайний случай межстрочный интервал А вообще эта статья пролила свет на многое для меня! Хотя тут далеко не все хитрости работы с сеткой базовых линий приведены, взять хотя бы подписи для фото в примере, или колонку слева, там вполне можно было бы рассчитать интерлиньяж так, чтобы каждая третья строка ложилась на базовую линию, как это нередко делают «друзья из печатного мира» Отличная статья! Пара небольших замечаний к переводу:
1) все таки надо писать сетка базовых линий (шрифта), а не базовая сетка
2) «лидинг» — это интерлиньяж, или на крайний случай межстрочный интервал
А вообще эта статья пролила свет на многое для меня! Хотя тут далеко не все хитрости работы с сеткой базовых линий приведены, взять хотя бы подписи для фото в примере, или колонку слева, там вполне можно было бы рассчитать интерлиньяж так, чтобы каждая третья строка ложилась на базовую линию, как это нередко делают «друзья из печатного мира»

]]> By: Александр http://designformasters.info/posts/baseline-grid/#comment-5964 Александр Wed, 09 Dec 2009 20:44:26 +0000 http://wordpress/posts/baseline-grid/#comment-5964 есть одно маленькое отличие от использования полиграфических сеток: а именно текст не сидит на базовой линии. об этом отличии в статье сказано вскользь, но картинка выдаёт его с головой: изобразительная вставка (портрет с подрисуночной на плашке) привязана к сетке, но не выровнена относительно шрифта. а именно гармонизация текста и изобразительных элементов - функция полиграфических и вообще любых модульных сеток. есть одно маленькое отличие от использования полиграфических сеток: а именно текст не сидит на базовой линии. об этом отличии в статье сказано вскользь, но картинка выдаёт его с головой: изобразительная вставка (портрет с подрисуночной на плашке) привязана к сетке, но не выровнена относительно шрифта. а именно гармонизация текста и изобразительных элементов - функция полиграфических и вообще любых модульных сеток.

]]> By: Вертикальный ритм « life.rumake.ru http://designformasters.info/posts/baseline-grid/#comment-4728 Вертикальный ритм « life.rumake.ru Sun, 29 Mar 2009 18:22:50 +0000 http://wordpress/posts/baseline-grid/#comment-4728 [...] создания такой верстки читайте на 24 WAYS (англ) или на Design For Masters [...] [...] создания такой верстки читайте на 24 WAYS (англ) или на Design For Masters [...]

]]> By: Ikarushka http://designformasters.info/posts/baseline-grid/#comment-3345 Ikarushka Tue, 03 Jun 2008 05:55:34 +0000 http://wordpress/posts/baseline-grid/#comment-3345 Скажите мне пожалуйста, если я хочу следовать рекомендациям о вертикальной разметке: <blockquote> Mark дал нам lesson plan, Khoi case study и Cameron дал нам toolkit. </blockquote> и рекомендациям о горизонтальной разметке, которые описаны в этой статье, то по идее надо начинать еще на уровне дизайна. Правильно я понимаю, что в этом случае дизайнер прежде, чем начать делать макет, скажем в PhotoShop[e], должен сначала кинуть в отдельные слои горизонтальную и вертикальную сетку, а потом уже начинать оформление? И вопрос для тех то практикует использования сеток. Применение вертикальной сетки возможно только на страницах с фиксированной шириной или есть технологии с шириной заданной в процентах? Большое спасибо. Скажите мне пожалуйста, если я хочу следовать рекомендациям о вертикальной разметке:

Mark дал нам lesson plan, Khoi case study и Cameron дал нам toolkit.

и рекомендациям о горизонтальной разметке, которые описаны в этой статье, то по идее надо начинать еще на уровне дизайна.
Правильно я понимаю, что в этом случае дизайнер прежде, чем начать делать макет, скажем в PhotoShop[e], должен сначала кинуть в отдельные слои горизонтальную и вертикальную сетку, а потом уже начинать оформление?

И вопрос для тех то практикует использования сеток. Применение вертикальной сетки возможно только на страницах с фиксированной шириной или есть технологии с шириной заданной в процентах?

Большое спасибо.

]]> By: Seleckis.lv :: журнал Никиты Селецкого » » Reset CSS http://designformasters.info/posts/baseline-grid/#comment-3288 Seleckis.lv :: журнал Никиты Селецкого » » Reset CSS Mon, 26 May 2008 12:09:55 +0000 http://wordpress/posts/baseline-grid/#comment-3288 [...] статьи Setting Type on the Web to a Baseline Grid, а точнее её перевода Базовая сетка в веб дизайне. At some point as designers we have to strike a balance between creating pixel-perfect layouts and [...] [...] статьи Setting Type on the Web to a Baseline Grid, а точнее её перевода Базовая сетка в веб дизайне. At some point as designers we have to strike a balance between creating pixel-perfect layouts and [...]

]]> By: Rumake http://designformasters.info/posts/baseline-grid/#comment-3221 Rumake Tue, 06 May 2008 04:18:07 +0000 http://wordpress/posts/baseline-grid/#comment-3221 Великолепно! Спасибо большое журналу за ссылки и перевод. Мы сейчас для нашего клиента обновляем дизайн и решили делать так как описано здесь. Если интересно можете посмотреть <a href="http://www.notis.ru/new.html" rel="nofollow">наработки новой версии</a>. Там также для примера разлинован бэкграунд, чтоб насладиться в полной мере:) "Design For Masters" теперь у меня в закладках:) Великолепно! Спасибо большое журналу за ссылки и перевод. Мы сейчас для нашего клиента обновляем дизайн и решили делать так как описано здесь.

Если интересно можете посмотреть наработки новой версии. Там также для примера разлинован бэкграунд, чтоб насладиться в полной мере:)

"Design For Masters" теперь у меня в закладках:)

]]> By: Же http://designformasters.info/posts/baseline-grid/#comment-269 Же Mon, 02 Jul 2007 14:41:37 +0000 http://wordpress/posts/baseline-grid/#comment-269 <h3>ye</h3>по-моему <a href="http://www.google.ru/search?q=%D0%AF%D0%BD+%D1%87%D0%B8%D1%85%D0%BE%D0%BB%D1%8C%D0%B4" rel="nofollow">Ян Чихольд</a> все просто очень описывает. Правила легко перенести на веб. Просто вместо листа — монитор и расстояние до него. ye

по-моему Ян Чихольд все просто очень описывает.
Правила легко перенести на веб.
Просто вместо листа — монитор и расстояние до него.

]]> By: Евгений http://designformasters.info/posts/baseline-grid/#comment-111 Евгений Thu, 03 May 2007 15:50:21 +0000 http://wordpress/posts/baseline-grid/#comment-111 <p>Я тоже скачал книгу «Типографика» Эмиля Рудера, мне кажется, она написана для людей, у которых уже есть базовые знания по типографике, очень большое внимание деталям, и мало что подходит для веб.</p> <p>Посмотрите <a href="http://webtypography.net/sxsw2007/webtypography-sxsw2007-notes.pdf" rel="nofollow">Web Typography Sucks (PDF 4Mb)</a> Ричарда Руттера и Марка Боултона, это не книга, а слайды по веб типографике. Сайт авторов этого творения тоже стоит посетить <a href="http://webtypography.net" rel="nofollow">Web Typography<a>.</p> Я тоже скачал книгу «Типографика» Эмиля Рудера, мне кажется, она написана для людей, у которых уже есть базовые знания по типографике, очень большое внимание деталям, и мало что подходит для веб.

Посмотрите Web Typography Sucks (PDF 4Mb) Ричарда Руттера и Марка Боултона, это не книга, а слайды по веб типографике. Сайт авторов этого творения тоже стоит посетить Web Typography.

]]> By: sky http://designformasters.info/posts/baseline-grid/#comment-108 sky Thu, 03 May 2007 12:55:01 +0000 http://wordpress/posts/baseline-grid/#comment-108 <h3>Хочу так!</h3>Я скачал книгу Эмиля Рудера - Типографика. Хочу узнать основные принципы типографики для использования на страницах сайтов. Но книга большая, 290 страниц, и никак не ориентирована на веб. Читается сложно. Есть может быть более "популярные" издания или материал на эту тему, ориентированный как-то на веб? Например правила, касающиеся ширины абзацев, отступов, пространства и прочее? Хочу так!

Я скачал книгу Эмиля Рудера - Типографика. Хочу узнать основные принципы типографики для использования на страницах сайтов. Но книга большая, 290 страниц, и никак не ориентирована на веб. Читается сложно.

Есть может быть более "популярные" издания или материал на эту тему, ориентированный как-то на веб?
Например правила, касающиеся ширины абзацев, отступов, пространства и прочее?

]]>