|
0 Всего найдено: 15
TaurosRMK
Сообщение
28/02/2013 18:20
Копия темы
Дизайн резинового сайта В общем дело такое, как правильно сделать дизайн резинового сайта? Дизайн в стиле "Grid" (dribbble.com, behance.net и др.). Как всегда сначала делаю под 960 (1024) пх, три колонки с расстоянием 20 пх. получается макет занимает 940 пх. Но вот при разрешении в 1280 пх, учитывая что скролл бар занимает 20 пх, остается 1260 пх свободного места, что в итоге позволяет поместить ещё одну колонку, но по ширине 4 колонки как раз таки занимают 1260 пх, в итоге упираются в края, что не очень хорошо. Такая же ситуация и с 1600 пх, и 1920 пх. Вариант делать расстояние 10 пх, с такой же шириной колонок, но тогда три колонки будут занимать 920 пх, что вроде не по феншую, так как привык под 940 делать :) Как правильно поступить? Посоветуйте, а то вроде дизайн готов, но как сделать его резиновым. Я тут интересуюсь чисто в плане дизайна, то есть размеров блоков и расстояния между ними, но что бы потом не было проблем при программировании :) Спасибо за советы.
TaurosRMK
Сообщение
28/02/2013 18:33
Копия темы
Не силен в таких сложных терминах. но догадиваюсь о чем вы )) Размеры колонок фиксированные, просто если появляется достаточное место для ещё одной колонки, то он помещается. Как-то так... В общем буду раз любым советам %)
turbolizard
Сообщение
28/02/2013 18:46
Копия темы
Ну резиновый сайт, в моем понимании, просто растягивается или сжимается в заданных диапазонах. Зачастую достаточно просто объяснить что и при каких условиях должно появлятся в макете (я о колонках). В основном же контент просто растягивается. Реализация зависит от верстальщика, с вашей стороны нужно сделать макет который можно было бы без свисто.....к тянуть задуманным образом. Придерживаение хотя бы колоночной сетки заметно облегчит жизнь верстальщику. А если делать адаптивный тут уже требуется продумать изменения размера шрифта, может даже самого шрифта при разных разрешениях экрана. Продумать какой контент убирать, какой дополнительно показывать, как должно вести себя меню и прочая инфа. В дополнение к ссылкам ниже – А еще можно почитать Отзывчивый дизайн Маркотта, там немного.
vadimfl
Сообщение
28/02/2013 19:02
Копия темы
У меня щас навернется слеза, серьезно, без подколок. Чтобы дизайнер интересовался да и еще дизайнил учитывая верстку – ловите +. По теме вопроса – все части которые планируются растягивать должны иметь структуру паттерна -поведение такое же как при заливке области. Т.е. если у вас причудливый градиент на тулбаре с цветочками от праведного луча поноса, как мимнимум, вам не укрыться. Отступы могут быть разные в зависимости от типа верстки – фикс, резиновая, адаптивная, но в любом случае имеет смысл принять за единицу какое-то расстояние – например 10px или 3% от общего размера экрана, и далее уже располагать элементы кратно выбранной единице отсчета – 3%б 6% 9% и тп, тоже самое и для вертикали. До кучи – группировать все слои и подписывать группы, слои также именовать, стараться не плодить тыщу psd файлов с одинаковым футером и хидером, а использовать все в одном файле, типовые эелементы преобразовывать в smart obj. Использовать безопасные шрифты или гугловские, не мержить прозрачные элементы с фоном.
001
Сообщение
28/02/2013 19:05
Копия темы
Вы сами загоняете себя в угол. Можно делать как угодно. Вот несколько примеров: Ознакомьтесь с заметкой Бирмана И забудьте про сетки
vadimfl
Сообщение
28/02/2013 20:21
Копия темы
– column-1, column-2 – 6 – все по 16% отступ – 3% везде, от того что их обозвали разными классами суть не меняется css-tricks.com – адаптивная верстка, размеры блоков 50% и по 25% отсальные, т.е. сохраняется отношение последний вообще тупо под модернизр сделан, т.е. сначало код потом дизайн. "Ознакомьтесь с заметкой Бирмана ilyabirman.ru/meanwhile/a... " – противоречит вашему же примеру css-tricks никто не говорит что надо как попугайчик делать все 12 ил и 24 колонки у коммерческих сайтов должна присутсвовать четкая струкутра, если пользователь действительно будет активно использовать ресурс у промо – креатив ------------------------------------------------------------------------------- ------------------- Про загонять в угол – вы когда-нибудь пробовали верстать проект где сначала фотка с одной рамкой, потом на другой странице уже с другой и с тенью? Когда сначала шрифт под заголовки тахома 16 пикс, потом тот же заголовок, но в другом разделе с той же функциональностью уже какой нить ариал на 20 пикселей. Когда кнопки были внизу на тулбаре, потом они перекочевали наверх. Когда тени сначала направлены вниз, потом вверх, потом их вообще нет в элементах управления. Когда в охреннено супеп пупер навороченном дизайне фриланса фиг войдешь с айфона? Знаете, при таком раскладе, лучше пусть будет загнанным в угол. И конечно же Бирману виднее, но знаете в твиттере тоже не идиоты сидят. И опять же про статью – фиксированный дизайн раньше проще было поддерживать, на 6-м ишаке сложный дизайн реализовать на резине – это было поистине искусство.
001
Сообщение
28/02/2013 20:53
Копия темы
Я просто сумничал. К сожалению, как верстаются макеты, не имею представления. Примеры были взяты с потолка.
001
Сообщение
28/02/2013 21:07
Копия темы
Я хотел сказать, что выход из вашей ситуации, скорее всего, прост. Ну, и, возможно, зря вы упираетесь в эти значения 1280, 1600. Я вот люблю разворачивать браузер на ~1350, при разрешении 1680.
TaurosRMK
Сообщение
28/02/2013 21:14
Копия темы
Да я походу я что-то заработался, вся гораздо проще )) А что за разрешение такое 1680? О_о
001
Сообщение
28/02/2013 21:52
Копия темы
0
Комментарием хотел помочь автору взглянуть на проблему иначе. |
|
Выразить восторг, поругаться или предложить что-нибудь можно на форуме |
Для обсуждения этого сервиса так же есть темы на фрилансе по поиску , флудотопу ,и по удалённым сообщениям ,и по Актуальным/популярным темам , и по топу "кто кому больше наотвечал" |