Советы Артёма Поликарпова и Коли Митина


ПН

Артём Горбунов
Решение задач


ВТ

Илья Бирман
Дизайн продуктов и их интерфейсов


СР

Михаил Нозик
Вёрстка и типографика в вебе


ЧТ

Николай Товеровский
Управление проектами, людьми и собой


ПТ

Илья Синельников
Переговоры и отношения с клиентом


СБ

Владимир Беляев
Юридическая сторона: договоры, права и товарные знаки


ВС

Максим Ильяхов
Текст, редактура и информационный стиль

На следующей неделе

Дизайн продуктов и услуг

На следующей неделе

Навигация в общественных местах

Николай Товеровский
4 июля 2013

За какими вещами нужно следить, чтобы при загрузке страница выглядела прилично и не разваливалась?

Мы всегда стараемся ответить на ваши вопросы. Кроме нашего совета, вы получите интеллигентные отзывы посетителей нашего сайта.

Открыты 5 апреля 2007 года.

Советы почтой каждую неделю
Пожалуйста, получите наше письмо, чтобы подтвердить свой адрес:
Вы подписаны на «Советы за неделю»:

В архиве

Евгений Мельчин
27 июня 2013

Здравствуйте, Артём. Подскажите, с чего начать изучение ЦСС? С чего начинали вы?

Игорь
20 июня 2013

Артём, как сделать, чтобы блок при прокрутке залипал у верхней границы окна браузера и отлипал, когда скролишь обратно?

Радомир Купфер
13 июня 2013

Артём, можно ли заверстать несколько разноширинных элементов через равные промежутки в резиновом контейнере, пользуясь лишь ЦСС?

Дмитрий Шишкин
6 июня 2013

Как правильно сверстать такое меню?

Марат
30 мая 2013

Расскажите, как правильно организовать взаимодействие разработчиков фронтенда и бэкенда?

Алексей Рогулин
23 мая 2013

Удачное ли решение на сайте в поле пароля указывать, что нажат капслок, как на Маке? Нигде не встречал.

Александр Иванов
16 мая 2013

Как сверстать точечки в таком меню?

Сергей Дроганов
9 мая 2013

Допустим, я делаю сайт с использованием медиавыражений. Есть основная версия и версии для устройств.

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

Как принудительно включать полную версию на мобильном устройстве?

Я использую Компас, поэтому медиавыражения содержатся в коде основного стиля. Вынести их во внешний файл для того, чтобы подключать и отключать, не получается, вернее, неудобно. Класс-маркер на <body> тоже лишает удобства подключать медиавыражения в любом месте каскада.

Сталкивались ли вы с подобной проблемой, как решали?

Константин Дубина
2 мая 2013

Поделитесь, как вы делаете кроссбраузерные кнопки?

Захар Кириллов
25 апреля 2013

Коля, Артём! Научите, пожалуйста, как сделать такой же клёвый таймлайн, как на главной бюро?

Артем Зайцев
18 апреля 2013

Расскажите, пожалуйста, как реализованы фотографии участников в Бюросфере.

Николай
11 апреля 2013

Артём!

Верстаю зубчатый край у резинового блока, смущает, как он не вовремя обрывается. Можно ли оставить только целое количество зубчиков? Или я слишком заморочился?

Олег Галайда
4 апреля 2013

Здравствуйте, советчики.

Есть такая интерактивная карта: http://rozma.com.ua/dealers.html

Информация показывается через :hover.

Можно ли реализовать вместо этого всплывание блочка через нажатие только на чистом ЦСС? И если нет, то как оптимальнее всего это сделать?

bolonia
28 марта 2013

Необходимо сделать text-align: justify, но чтобы последняя строка центрировалась, как с text-align: center. Текст может меняться.

Подскажите, как реализовать такое?

Евгений Воробьев
21 марта 2013

Вы уже отвечали на похожий вопрос. А как сверстать пример с рисунка? Текст в центре отталкивает двойные боковые линии в зависимости от своих размеров.

Спасибо.

Коля Коробочкин
14 марта 2013

Добрый день!

Заметил, что выделение текста иногда странно себя ведёт. Немного покопавшись в ХТМЛ и ЦСС, я понял, что это зависит от наличия position:relative у «родителя».

Стоит ли обращать внимание на такие мелочи при вёрстке?

Виктор Карпов
7 марта 2013

Меня интересует вопрос миграции базы данных между различными версиями проекта: для разработчиков, менеджерской, боевой.

Как это организовано у вас, какие инструменты используете?

Олег Истомин
28 февраля 2013

Конечно, к вёрстке вопрос относится косвенно, но всё же: как вы храните данные для многоязычных сайтов?

Существует масса подходов:

  • когда переводы выносятся в отдельную табличку с id, owner_key, lang_id, string, text, где owner_key — сгенерированный ключ (например, MD5) для связи основной таблицы с таблицей переводов;
  • когда для каждой таблицы делается отдельная таблица с переводами и owner_key — это id основной таблицы;
  • когда таблица переводов имеет вид id, ru, en, de, …;
  • или тупо все поля в основной таблице дополняются полями переводов.

Сам пользуюсь вариантом id, ru, en, de, потому что большинство многоязычных сайтов редко переводятся больше чем на 5 языков, а если и переводятся, то информации на них немного. Но даже в этом варианте неудобно писать запросы, например, для удаления строк, когда нужно удалять все зависимые переводы. Случаи со склонениями по падежам в интерфейсе настолько редки, что можно обрабатывать их отдельно. Подумываю перейти на вариант «тупо писать все переводы в основной таблице», но хотел бы спросить вашего совета.

Михаил Танский
21 февраля 2013

Как наиболее простым способом сверстать такую таблицу, с учётом того что данные приходят автоматически и нет возможности руками расставлять их?

Андрей Тонконогов
14 февраля 2013

Пытался сверстать вот такой элемент. Его размеры 380×55. Проблема в том, что в разных браузерах блок по-разному отображается — где-то ровно, где-то всё скачет.

Вопросы:

  1. Как сверстать этот блок, чтобы он корректно отображался в разных браузерах и системах? Помогите с кодом.
  2. Как правильно распределить пространство между блоками, учитывая, что дней может быть как 5, так и 15? Остальное особо не изменяется.

Спасибо большое!

Иван Титов
7 февраля 2013

Как правильно задавать и комбинировать верхние и нижние отступы у заголовков и абзацев?

Например, обычно у h2 желателен большой отступ сверху для отделения от предыдущего абзаца. Но когда h2 идёт сразу же после h1, получается слишком большой отступ между ними. Можно ли как-то через ЦСС отследить или предупредить подобные случаи?

Илья Харитонов
31 января 2013

Как реализовать вёрстку блоков с разной высотой, как на «Пинми»?

Илья Страйков
24 января 2013

Как реализована висячая пунктуация на сайте бюро, в частности — в «Советах»?

Артём
17 января 2013

Я не очень хорошо владею регулярными выражениями. Как на Яваскрипте распарсить произвольный УРЛ, определить протокол, домен, путь, гет-запрос, хеш?

Павел
10 января 2013

Подскажите, как правильно сделать подчёркивание многострочного текста, чтобы линия была, допустим, в три пикселя?

Николай Марченко
3 января 2013

Артём, как сделать клёвый вертикальный градиент на тексте?

Александр
27 декабря 2012

Артём, можно ли оценить уровень кандидата на вакансию верстальщика, попросив его на собеседовании написать несколько ЦСС3-конструкций ручкой на бумажке, без компьютера и Гугля?

Павел Вакуненко
20 декабря 2012

Здравствуйте, уважаемые советчики. Подскажите пожалуйста, как реализовать самым простым способом скрипт, превращающий ссылку в текстовое поле?

Никита Демидов
13 декабря 2012

Артём и Коля, раскажите, пожалуйста, как правильно сверстать таббар на ХТМЛ5 и ЦСС3 фиксированной высоты, прибитый к низу окна, и чтобы всегда оставался на экране, — в общем, как в мобильных приложениях. Собственно, это и нужно для отображения на мобильных устройствах.

Иван Курилко
6 декабря 2012

Дорогие советчики, возникла реальная потребность в вашем совете.

Имеется страница, на которой размещены блоки с картинками шириной 600 пикселей и произвольной высотой.

Но возникла проблема в том, что иногда нужно их быстро уменьшить до ширины в 300 пикселей. Есть ли возможность быстро решить этот вопрос с масштабированием? Может, есть какая-нибудь функция Яваскрипта для масштабирования картинок?

Олег Уласюк
29 ноября 2012

Вопрос Арёму Поликарпову. Каким способом можно сделать загрузку кастомных шрифтов приятной, без скачков и пустых блоков с текстом?

Рома Турбо
22 ноября 2012

Артём, объясните, пожалуйста, в чём преимущество div перед table. Кроме того, что это молодёжно и уменьшает размер кода.

Сергей Ревякин
15 ноября 2012

Здравствуйте, уважаемые советчики!

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

Алексей Земляков
8 ноября 2012

Привет, хочу спросить совета по вёрстке.

У меня есть многострочные ссылки. Из-за большого интерлиньяжа между строк образуется «дыра», в кототорой ссылки перестают ховериться, уменьшать интерлиньяж нельзя.

Какой выход?

Сергей Дроганов
1 ноября 2012

Как размыть объект? Допустим я открыл фенсибокс, он закрыл мне контент полупрозрачной пеленой. Я хочу, чтобы закрытый контент немного размылся.

Можно вообще такое сделать?

Артём Зайцев
25 октября 2012

Здравствуйте!

Прошу совета по вёрстке. Как выровнять картинку внутри дива по центру, если её ширина больше ширины дива? Свойство text-align для дива срабатывает, только если картинка меньше дива.

Максим Ильяхов
18 октября 2012

Артём!

Недавно меня спросили, как правильно разделять разряды чисел. Ответ однозначный — тонким пробелом.

В комментариях привели аргумент против: тонкий пробел создаёт трудности, если переносить число из веба в калькулятор или любую другую программу, которая работает с числами.

Но по сути ведь проблемы нет. Тонкий пробел — это ведь пустота, её можно сделать как-то по-другому, не мешая копипасту и не создавая проблем на вёрстке. Но вот как?

Саша Сергеев
11 октября 2012

Артём, советчики!

Как вы относитесь к инициативе Микрософта по выводу ИЕ 6 с рынка акцией «Интернет Эксплорер 6 Каунтдаун»?

Имеют ли подобные акции cмысл, особенно, учитывая, что эффект воздействия на оставшихся пользователей снижается?

Есть ли у вас мысли, как Микрософт должен был поступить глядя на «неубиваемость» шестого? Как вы лично относитесь к ИЕ 6 и как долго будете поддерживать его в своих проектах?

Станислав Биченко
4 октября 2012

Как пользоваться mod_rewrite, чтобы получались красивые урлы? (Дополнительный вопрос: как сделать так, чтобы при этом не ломались все относительные ссылки?)

Сергей Иванов
27 сентября 2012

Артём, как вы подключаете стили для ИЕ?

Коля Коробочкин
20 сентября 2012

Научите, пожалуйста, правильно верстать формы авторизации и т. п. Перерыл интернет и «Сафари Дев центр», но не нашёл каких-либо материалов о том, как сверстать форму так, чтобы Keychain Access на маке предложил сохранить логин и пароль.

Илья Бирман
13 сентября 2012

Кстати, Артём, а как верстать радиокнопки имени Плотникова? Чтобы всё ровно попадало куда надо.

Юрий Дунаев
6 сентября 2012

Как проработать верстальщиком всю жизнь?

Дмитрий Тонюк
30 августа 2012

Здравствуйте, подскажите, как лучше сверстать данные элементы без ЦСС 3?

Игорь
23 августа 2012

Как правильно делать синхронное подсвечивание одинаковых ссылок, например у картинки и текста? Обязательны ли скрипты?

Олег Истомин
16 августа 2012

Стоит ли наращивать вложенность тегов для структурированности кода?

Например, список комментариев (выделение отдельных комментариев не понадобится). Его можно оформить так:

<div>
    <h1>Комментарий 2</h1>
    <p>Текст комментария 2</p>
</div>
<div>
    <h1>Комментарий 1</h1>
    <p>Текст комментария 1</p>
</div>

А можно так (проще, но все в кучу):

<h1>Комментарий 2</h1>
<p>Текст комментария 2</p>
<h1>Комментарий 1</h1>
<p>Текст комментария 1</p>

Последний способ увеличивает скорость сайта, но не возникнут ли потом проблемы?

Салават Абдуллин
9 августа 2012

Здравствуйте, Артем.

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

Как можно с помощью ЦСС реализовать этот пример, используя в разметке только один тег? Полоска должна быть резиновой — меняться в зависимости от текста, также должен настраиваться отступ между текстом и линией.

Сергей Кузьмин
2 августа 2012

Хочу сделать смену языка на сайте без перезагрузки страницы (и без аякса). Как лучше поступить?

Евгений Грибодёрчев
26 июля 2012

Здравствуйте, Артём! Расскажите пожалуйста, как на сайте бюро реализована разрядка у прописных букв?

Илья Сальманов
19 июля 2012

В чём особенности стандарта XHTML, как его применяют при создании веб-страниц?

Евгения
12 июля 2012

У меня проблема — в одном из блоков, пока не подгрузился контент, нужно показывать прелоадер. Я поставила гифку, но у блока меняющийся фон и в большинстве случаев прелоадер выглядит ужасно.

Как сделать крутящийся прелоадер, независящий от фона?

Дарья Кружкова
5 июля 2012

Добрый день!

Вопрос касается ХТМЛ. Скажите пожалуйста, действительно ли необходимо цитаты внутри предложения заключать в тег <q> (с прописанными в ЦСС кавычками)? Или вполне уместно обойтись без него и вручную ставить &laquo;...&raquo;?

Спасибо.

Иван Титов
28 июня 2012

В ПХП, Яваскрипте и Джейквери одинарная и двойная кавычки, вроде бы, равнозначны. Плюс этого в том, что их комбинирование позволяет улучшить читабельность кода: не нужно экранировать кавычки внутри сложных команд. Минус — в лёгком беспорядке (заметил, что в одних и тех же ситуациях ставлю то ', то ").

Когда лучше использовать одинарные, а когда двойные кавычки в программировании? Есть ли какие-то правила хорошего тона, а может и функциональная разница?

Станислав Некрасов
21 июня 2012

Артём, приветствую! Подскажите, как гибко сверстать текст на подложке?
Эльмира
14 июня 2012

Здравствуйте, подскажите, как сделать, чтобы фотография для веба была лёгкой, но при этом не теряла сильно в качестве. Хочется, чтобы много красивых картинок на сайте быстро загружались.

Тёма
7 июня 2012

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

Не могли бы вы разжевать этот момент? В каких единицах стоит задавать размеры шрифта?

Алексей
31 мая 2012

В Сафари на Маке можно прокрутить страницу за её пределы. У меня Виндоус, а у дизайнера Мак, и он говорит, что мои скрипты, завязанные на значения скрола, странно ведут себя при таком оттягивании.

Есть какое-нибудь универсальное решение?

Юрий
24 мая 2012

Здравствуйте!

Используете ли вы готовые ЦМС?
И как вы к ним относитесь, например, к Вордпрессу, Друпалу, Джумле?
И то же по фреймворкам — «Симфони» или что-то в этом духе?
Пользуетесь ли вы работой, которая уже была сделана кем-то, чтобы упростить жизнь?

Спасибо :-)

Илья
17 мая 2012

Как победить кривой рендеринг трансформированного (skew) текста на Винде?

Лоран
10 мая 2012

Здравствуйте, товарищи.

Научите, пожалуйста, как правильно делать подчёркивание ссылок другим цветом. Чтоб линия не уходила далеко от слова. И чтобы у всего сайта сразу, т. е. для всех <a>.

Спасибо!

Александр Ратманский
3 мая 2012

Размеры картинки заранее неизвестны. Подпись располагается под картинкой. Возможно ли с помощью ЦСС сделать так, чтобы длинная подпись не вылезала за край картинки, а переносилась на следующую строку?

Примерная разметка:

<div>
 <img src="pic.jpg">
 <span>текст подписи</span>
</div>
Илья Григорьев
26 апреля 2012

Как выровнять два плавающих блока по базовой линии, если в одном из них кнопка?

Александр Ильинский
19 апреля 2012

Артём, здравствуйте.

Вопрос по вёрстке. Мне нужно особенно выровнять абзац, у которого внутри есть картинки. Как в ЦСС работать с родителями?

Николай Герасимов
12 апреля 2012

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

Артём Коротких
5 апреля 2012

Задался вопросом, в какой кодировке всё же лучше делать сайт?

Как выбор кодировки может повлиять на кроссбраузерность или что-нибудь ещё?

И, наконец, как правильно обращаться с кодировкой на страницах или при обращении к БД?

Рома Романов
29 марта 2012

Задаю популярный среди новичков вопрос Артёму Поликарпову.

Как верстать ссылки вида http://site.ru/#news, чтобы при нажатии на них сайт не загружался заново, а просто выскакивало новое содержание без перезагрузки. Как это работает, можно посмотреть на сайте chopapp.com, кликнув на «Would you like to know more?»

Сергей
22 марта 2012

Очевидно, что бюро против капчи. Но есть сайты, которые реально страдают от мусора, получаемого с форм. Как вы обходитесь без проверки на робота?

Павел Шумаков
15 марта 2012

Дизайнеры всё время изощряются с тенями и красивыми формами.

Вопрос такой — как проще всего сверстать нестандартный <select>?

Евгений Волков
8 марта 2012

Одной из особенностей таблиц является то, что их минимальная ширина далеко не всегда зависит от указанной в ЦСС. Проблема в том, что их ширина зависит от контента. То есть она не сжимается меньше суммы максимальных ширин всех ячеек.

Как решать такую задачу?

Антон Мельничук
1 марта 2012

Здравствуйте, сотрудники бюро.

Я верстальщик, который часто работает в Фотошопе для создания шаблонов. У меня следующий вопрос: для определения цвета я использую пипетку, а чтобы скопировать этот цвет, мне приходится тыкать в поле с цветом, выделять его и потом только копировать.

Как в этом случае поступают ваши верстальщики, и может вообще поделитесь советами какими-то для быстрого и удобного использования Фотошопа верстальщиком?

Спасибо.

Сергей Дроганов
23 февраля 2012

Привет!

Расскажите, пожалуйста, какую технику вы используете для работы со знаком рубля при вёрстке сайтов?



© 2007—2016

Запрещённые слова
Пишите: artgorbunov@artgorbunov.ru