Начну с того, что фотошоп я раньше использовал в фотографиях. Рисовал аватарки для групп и подобное.
Однако макет целого сайта для меня это впервые.
Появилось желание сделать сайт с нуля, причем дальнейшая верстка и т.д. буду делать я. В общем учится и делать, малые знание HTML CSS есть, но их для полноценной верстки не хватает, поэтому все что мне не понятно я буду искать ответы в гугле.
Проблем с Логотипом нет, я его сделал без проблем:
Как могли догадаться это должно получится на подобия ЖЖ или Однако орг, может даже пикабу, в общем сообщества блогеров, где каждый желающий может ввести свой блог и т.д.
Следующий этап - конечно макет сайта и тут появились вопросы. На некоторые из них я нашел ответы в сети, но не на все. В общем поехали:
1. Какие правила соблюдать, для макета в дальнейшей адаптивной верстки?
2. Следует ли избегать каких-то градиентов, эффектов?
3. Не помешали бы общие правила рисовки макета.
4. Хотелось бы, что бы навигация сайта (меню, список тематик статьей) выдвигались с боку при нажатие на иконку, как на форуме скайфорг, стоит ли? В этом есть какие-то минусы, преимущества для поисковиков?
5. Если верстка адаптивная будет, в какой ширине тогда стоит рисовать макет сайта? 960, 1024? Наверное под минимум или я не прав?
Пока все. Всем спасибо) За ссылку - прошу не считать рекламой, это всего лишь форум ММО игры)
- 02.08.2015 22:14
- 02.08.2015 22:38
Спасибо сказали:
Mirovoy(02.08.2015), - 02.08.2015 22:39
Очень сложно читать если честно :) Пришлось очень сильно всматриваться и вчитываться
Спасибо сказали:
Mirovoy(02.08.2015), - 02.08.2015 22:41
1. Какие правила соблюдать, для макета в дальнейшей адаптивной верстки?
Общее правило: примерно одинаковое отображение во всех осоновных браузерах + сохранение самой существенной инфо в удобном виде
2. Следует ли избегать каких-то градиентов, эффектов?
Предусмотреть особенности различных браузеров, например:Код HTML:3. Не помешали бы общие правила рисовки макета.background-color: #ffe477; /* Konqueror */ background-image: -khtml-gradient(linear, left top, left bottom, from(#ffe477), to(#fbcc5d)); /* Safari4+, Chrome */ background-image: -webkit-gradient(linear, left top, left bottom, from(#ffe477), to(#fbcc5d)); /* Safari5.1+, Chrome10+ */ background-image: -webkit-linear-gradient(#ffe477, #fbcc5d); /* Firefox3.6 */ background-image: -moz-linear-gradient(#ffe477, #fbcc5d); /* Opera11.10+ */ background-image: -o-linear-gradient(#ffe477, #fbcc5d); /* CSS3 Compliant */ background-image: linear-gradient(#ffe477, #fbcc5d);
Рисуете, исходя из представления для мобильного, затем расширяете до больших размеров. Весьма полезно прототипирование, даже просто карандашом на листе бумаги.
4. Хотелось бы, что бы навигация сайта (меню, список тематик статьей) выдвигались с боку при нажатие на иконку, как на форуме скайфорг, стоит ли? В этом есть какие-то минусы, преимущества для поисковиков?
Преимуществ нет - лучше сделать, чтобы на мобильных меню убиралось с иконкой для открытия.
5. Если верстка адаптивная будет, в какой ширине тогда стоит рисовать макет сайта? 960, 1024? Наверное под минимум или я не прав?
Зависит от желаемого представления. Главное, чтобы элементы либо масштабировались соответственно экрану, либо размеры подходили бы.
Можно исходить из максимального размера для сайта - то есть , каков будет вид при размере от... и до упора.
На каждом разрешении выбирается желаемый вид сайта и размеры элементов - на этапе прототипирования. Расположение верстается для каждого разрешения из этого набора.
К сожалению, сейчас большинство адаптивно-резиновых сайтов похожи друг на друга (в общем), как куклы-барби - вроде ничего, но изюминки нет.
В общем, где-то так и имхо. Помотрите, может, пригодится: Как нужно верстать _http://coderhs.com/archive/how_layoutСпасибо сказали:
Mirovoy(02.08.2015), - 02.08.2015 23:10
Спасибо) Довольно оперативно ответили) Если кто-то, что-то может добавить, я только за)
---------- Сообщение добавлено 21:10 ---------- Предыдущее 21:07 ----------
Да к стать, мобильную версию делать не стану) Мне просто нужно, что бы выглядело комфортно под любой монитор ПК)
А мобильники, сейчас смартфоны грузят полноценные сайты без каких либо проблем. Если дай бог проект будет успешным, то для смартфонов будет приложение на андроид) На проклятые айфоны делать не стану - 02.08.2015 23:15
Пожалуйста) Собственно - на этапе прототипирования также определяете, будет ли использоваться какой фреймворк css - bootstrap, pure, flex и т.д. или ручное прописывание - потому как многое потом зависит от этого.
Также целесообразность использования фрейворков определяется из используемого функционала, либо конфигурируется (если возможно - bootstrap? например) по конкретные нужды - для исключения лишнего кода -> скорости загрузки и т.д.
PS Все можно спокойно прописать самостоятельно, через media запросы - и будет только то, что нужно и так, как нужно.
Долго и трудно - но оно стоит того - если не поточное производство сайтов, а ручная работа в полном смысле)Спасибо сказали:
Mirovoy(02.08.2015), - 02.08.2015 23:31
Тут вопрос еще один назрел, а какой CMS лучше может подойти для подобного сайта?
---------- Сообщение добавлено 21:31 ---------- Предыдущее 21:30 ----------
GOODPower,
Если вы про лого, то это форум) Что бы посмотреть его в оригинальном размере, просто нажмите на него)
Тэги топика:
Похожие темы
Темы | Раздел | Ответов | Последний пост |
---|---|---|---|
На мобильных устройствах первый переход по ссылке моего сайта редиректит на другой сайт | Безопасность в сети | 6 | 03.07.2014 14:09 |
Продаю два макета сайта | Готовые дизайны, шаблоны | 5 | 07.06.2014 20:33 |
Разработка макета сайта, шапки, логотипы, баннеры. Качественно. Недорого. | Дизайн сайтов, графика | 5 | 05.06.2013 21:31 |
Верстка PSD макета в html 2х страничного сайта | Создание сайтов | 3 | 01.11.2011 22:35 |
Facebook Вопросы и Ответы. Первый в рунете обзор бета-версии сервиса | Дайджест блогосферы | 1 | 30.01.2011 13:23 |