Добрый день. Совсем недавно начал заниматься версткой дизайнов и столкнулся с такой проблемой, что сайт выглядит по-разному при разных разрешениях экранах. Подскажите как с этим бороться? для каждого разрешения монитора писать свои стили, точнее размеры?
Не сильно силен в самой верстке, но почему бы Вам не делать "резиновый шаблон" ? В интернете очень много подробных описаний. Допустим ту же ширину сайта можно определять не в "px", а в "%", также можно добавить параметр max-width, который будет разрешать "растягиваться" сайту/колонке/контенту до определенного значения ширины.
самое популярное разрешение на текущий момент 1366*768. вот под него и верстайте :) + кроссбраузерность проверять надо дополнительно будет на всякий случай
Делайте фиксированный размер под минимальное разрешение, либо более универсальный резиновый. Можно и с разными стилями попробовать, конечно, но по-моему это излишняя морока.
А вот если использовать еще следующее решение: http://www.wellsait.ru/file_css.php Повлияет ли это как-то на время загрузки сайта и не изменится ли отношение поисковых систем к сайту?
Тут два варианта - делать фиксированный шаблон (под ширину 1024 (таблица 960px стандартный набор верстальщика для Фотошоп), увы, пока еще 17" мониторы рулят) либо резиновый с ограничением, как на нашем Вебмастерс.
PS. Держите полезный сервис http://viewlike.us/ . Показывает, как ваш сайт выглядит на различных разрешениях.
AlexDV,Спасибо за сервис, но использую для этих целей плагин для Mozilla - Web Developer Toolbar. И еще может кто подскажет литературу, где бы были собраны все функции, тэги CSS. Заранее спасибо.
CuxpecT, откуда такая информация про популярное разрешение? Помимо подмены стилей на лету жаваскриптом можно заморочиться, если знать например рнр, если в куках пользователя нет параметра с разрешением монитора, взять это разрешение, обновить страницы, попутно добавив в куки разрешение и уже соглсано кукам брать стили.