Jump to content

Новый дизайн css-live.ru 3


psywalker
 Share

Recommended Posts

Добрый день, сообщество :)

Ещё один добрый человечек решил помочь css-live с новым дизайном. Спасибо тебе, AnnaP, огромное, но несмотря на то, что ваше платье украсило бы самую прекрасную композицию Церетели, уйти безнаказанной не получится :D Обсуждаем и критикуем новый дизайн, друзья!

h_1347526104_4602286_3a02cbcd83.png

А здесь можно посмотреть дизайн в полный рост.

Link to comment
Share on other sites

Теперь банановый))

Я бы сказал, со вкусом песочных печенек)

Красиво. Единственное, я бы ликвидировал ту маленькую иконку "Статья полностью", то есть вообще, а переходить по заголовку

Link to comment
Share on other sites

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

  1. Может, со мной что-то не то, но стиль ссылки readmore мне не показался интуитивно понятным. Может, описание стоит перенести из тултипа в положение слева от иконки?
  2. Нужно ли в тизерах выравнивать в один ряд значения для "автор", "перевод" и др?
  3. Мне кажется, что для таких тизеров больше подходит резиновая верстка.
  4. Чего-то не хватает в заголовках правого сайдбара (Архив, Последние комментарии).
  5. Логотип: SS уже давно DEAD :)

PS: AnnaP рулит, записываюсь в фанаты.

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

Edited by hedgehog
Link to comment
Share on other sites

1. Нравятся общая концепция дизайна, цвета, но можно было чуть добавить контраста.

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

3. перейти на стр:, архив в виде календаря - удобно сделано.

Вот только по моему - шрифты в тегах в футере выбрать другой или более упорядочить этот блок.

А так очень понравился. Молодец, AnnaP. :)

Link to comment
Share on other sites

Цветовая гамма нравится

насчёт иконки "статья полностью" я бы её либо убрал как уже было сказано выше или поставил там ссылку "статья полностью"

ещё справа внизу белая стрелочка на мой взгляд лишняя

там где вход неплохо бы и кнопочку регистрация добавить

Link to comment
Share on other sites

А можно я повредничаю? :blush:

Вкусы у меня очень специфические, так что прошу прощения, если не в тему.

  1. Первое мнение после перехода по ссылке - мрачно. Сырые стены склепа, а не CSS-live.
  2. Логотип — SS - не наш путь. Как-то очень отстраненно, далеко и не в тему выглядит то ли одинокая, то ли двойная "C", окружающая SS-live.
  3. Шрифты заголовков для меня нечитаемы из-за своей вытянутости.
  4. Черный шрифт основного текста совсем не подходит к остальному мягкому дизайну, ему тогда тоже бы помягче цвет подобрать.
  5. Поиск по сайту не на самом видном месте, я бы этот блок поменяла, к примеру, местами с архивом.
  6. Архив не продуман - не видно, ни на какие даты есть материал, ни количества статей на конкретный день/месяц.
  7. Заголовки "архив", "поиск по сайту", "последние комментарии", "вести" имеют разные вертикальные отступы.
  8. "последние комментарии" — хочется видеть дату и время последнего комментария
  9. облако тегов, почему-то мне кажется, лучше бы смотрелся не в футере, а в сайдбаре
  10. Как будут располагаться кнопки социальных сетей, когда их станет больше/меньше?
  11. В каждой статье основного блока справа есть слайдер, мне не понятно его назначение :(
  12. Информация о статье (автор, раздел, кол-во комментариев) не очень красиво смотрится вертикально по центру высокого блока

Теперь о приятном :)

При детальном рассмотрении понравился подход к оформлению в целом. Красивый бэграунд, неплохие цвета, продуманные картинки и подход к деталям, хоть и хаотично. Возможно, на другом подобном тематическом ресурсе подобный дизайн при определенных доработках будет очень солидно смотреться, но само название ресурса, для которого делался этот диз - css-live — ресурса экспериментаторов, исследователей, копателей, и прочее, прочее, прочее... А жизнь в данном контексте у меня ассоциируется с чем-то ярким, чистым, светлым.

Макс, настоятельно рекомендую добавить слоган "CSS байки от дядюшки Psy и его старых друзей", тогда будет отличный сайт с красивым тёмным (в смысле в тему) дизом.

Link to comment
Share on other sites

Весьма.

Я бы сказал, со вкусом песочных печенек)

я бы ликвидировал ту маленькую иконку "Статья полностью", то есть вообще, а переходить по заголовку

Поиск по сайту не на самом видном месте, я бы этот блок поменяла, к примеру, местами с архивом.

Архив не продуман - не видно, ни на какие даты есть материал, ни количества статей на конкретный день/месяц.

Заголовки "архив", "поиск по сайту", "последние комментарии", "вести" имеют разные вертикальные отступы.

"последние комментарии" — хочется видеть дату и время последнего комментария

Плюсадин.

Облако тегов вы, кстати сказать, куда-то в странное место засунули. Оно же разрастётся, будет вам растягивать подвал, будет некрасиво. Да и вообще, облако тегов — это от лукавого.

Про архив: он точно так уж необходим? Т.е. кто-то правда будет искать статьи по дате публикации?

Edited by Helis
Link to comment
Share on other sites

Фигня полная... мешанина из непонятных элементов.

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

Стопицот рамок тоже не есть гуд.

Если в макете больше 3 разных шрифтов, то это отстойный макет. Шрифта должно быть 2 или 3 (Заголовки, Основной текст, Цитаты).

На логотипе написано SS-Live, хоть убейте меня, но это так.

Link to comment
Share on other sites

Ребята спасибо большое за замечания я их буду учитывать в дальнейших работах.

С логотипом на самом деле косяк с буквой "С".

Может что-то в этом роде бы подошло?

s_1347539533_9770157_5e18796dfc.png или более минималистично s_1347539389_5353738_186028658c.png

Цвет можно поменять, как и слоган.

я бы ликвидировал ту маленькую иконку "Статья полностью", то есть вообще, а переходить по заголовку

да, видимо нехорошая идея была с этой иконкой, там просто на ссылку далее надо переделать

ещё справа внизу белая стрелочка на мой взгляд лишняя

там где вход неплохо бы и кнопочку регистрация добавить

Сам макет сделан так, чтобы дать общее представление поэтому регистрация и сам архив недоделаны(точнее их варианты, как они будут выглядеть в случае активации).

Эта стрелочка не видна в обычном состоянии эта идея взята у хабра(у них слева, посмотрите как это действует), мне кажется очень удобно.

2 Catherine, неужели все так мрачно? Про "последние комментарии" я думала вставить дату, а потом подумала если они "последние", то в принципе значит недавно))(хотя я согласна). Слайдер для просмотра картинок и видео в статье, не заходя в саму статью.Облако тегов, как сказал Helis "от лукавого" поэтому я его вниз и поместила. Проблемы с кнопками соц. сетей вроде не должно быть, будет больше - расположатся следующим рядом под нынешними.

Облако тегов вы, кстати сказать, куда-то в странное место засунули. Оно же разрастётся, будет вам растягивать подвал, будет некрасиво...

Про архив: он точно так уж необходим? Т.е. кто-то правда будет искать статьи по дате публикации?

подвал вниз всегда можно расширить и для тегов и для соц.сетей. Я сама часто пользуюсь такими архивами, видимо поэтому и поместила, допустим, месяц назад я искала одну статью на css-live, названия не помнила, но помнила, что была она приблизительно две недели назад, честно говоря мне пришлось просмотреть там все страницы тогда, хорошо, что их было мало. Потом, вдруг, вы захотите просмотреть только вчерашние статьи...

Фигня полная... мешанина из непонятных элементов.

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

Стопицот рамок тоже не есть гуд.

Если в макете больше 3 разных шрифтов, то это отстойный макет. Шрифта должно быть 2 или 3 (Заголовки, Основной текст, Цитаты).

На логотипе написано SS-Live, хоть убейте меня, но это так.

Там всего два фонта. Да, логотип не то. Вы считаете рамок много? Сайт в принципе расчитан на опытного пользователя, поэтому разобраться зачем какая иконка дело секунд и всего при первом заходе. В принципе там непонятно может быть только "статья полностью", но об этом я уже выше написала, и комментарии(из значит надо доработать).

  • Like 4
Link to comment
Share on other sites

Там всего два фонта.

Хм, наверное показалось.

Вы считаете рамок много?

Считаю да. Половину пунктирных линий можно смело убирать, рамки, вложенные в рамки, тоже плохо.

Сайт в принципе расчитан на опытного пользователя, поэтому разобраться зачем какая иконка дело секунд и всего при первом заходе. В принципе там непонятно может быть только "статья полностью", но об этом я уже выше написала, и комментарии(из значит надо доработать).

А вот это вообще зря. Сайт должен быть максимально удобен. Когда вы говорите: "...рассчитан на опытного пользователя", вы, фактически, признаете, что навигация сложновата :) Непонятно там не только как посмотреть статью полностью, лично я бы очень долго искал как добавить комментарий, тыкать на цифру - совершенно не очевидно! Именно поэтому вы решили запилить там альт. Если область справа перекидывает нас наверх (привет Хабр), то так и напишите "наверх", тогда не понадобится городить дополнительные альты (а значит дополнительные скрипты).

UPD: И лично мне кажется совсем нечитабельным шрифт в заголовках и на кнопках. Ну это уже дело вкуса. Мне никогда не нравились "сплющенные" шрифты типа Arial Narrow. И лого лучше тот что слева.

UPD2: И мне вообще не нравятся, сливающиеся с фоном поля ввода. Чекбокс я сперва даже не заметил. Их надо делать намного заметней. А такой вариант подойдет для задизейбленных.

UPD3: И непонятно почему такой гигантский отступ от формы поиска, до блока "последние комментарии".

Link to comment
Share on other sites

Ребята спасибо большое за замечания я их буду учитывать в дальнейших работах.

С логотипом на самом деле косяк с буквой "С".

Может что-то в этом роде бы подошло?

s_1347539533_9770157_5e18796dfc.png или более минималистично s_1347539389_5353738_186028658c.png

Цвет можно поменять, как и слоган.

ИМХО первый - милитари стайл.

Link to comment
Share on other sites

Про "статья полностью" уже сказали. Переделать однозначно, так как по иконке можно подумать что идем на другой сайт или откроем что-то в новом окне.

Лого тоже переделать. Мне больше нравится первый вариант из

s_1347539533_9770157_5e18796dfc.pngs_1347539389_5353738_186028658c.png

Или доработать второй.

Дата публикации не на своем месте.

Она должна быть связанна с названием поста а не с картинками поста.

Или же ее перенести к "Автор", "Перевод" и т.д.

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

Доработать сайдбар, сейчас там как-то сыровато.

Облако тегов в сайдбар.

Кнопка "Вверх" хорошо сделана. Это удобно. Только я бы саму стрелку не вниз странички прибивал, а к низу окна браузера, но кликабельная область по всей высоте однозначно.

И если окно браузера узкое, то эту стрелку можно сделать уже, а при ховере расширять.

Это лучший дизайн из представленных для css-live.ru

Link to comment
Share on other sites

лично я бы очень долго искал как добавить комментарий, тыкать на цифру - совершенно не очевидно! Именно поэтому вы решили запилить там альт.

Вы абсолютно правы. Я тоже осталась недовольна этим решением, думала сделать кнопочку там, но она как-то слишком выделялась, возможно просто старый добрый вариант сделать слово "комментарии" ссылкой.

UPD2: И мне вообще не нравятся, сливающиеся с фоном поля ввода. Чекбокс я сперва даже не заметил. Их надо делать намного заметней. А такой вариант подойдет для задизейбленных.

да, тоже соглашусь, надо выделить

Link to comment
Share on other sites

Это лучший дизайн из представленных для css-live.ru

Я с точностью до наоборот думаю :)

Кстати, рекомендую потусоваться тут (нужна регистрация), среди дизигнеров так сказать.

Link to comment
Share on other sites

возможно просто старый добрый вариант сделать слово "комментарии" ссылкой.

Да, просто ссылка будет уместна.

s_1347539533_9770157_5e18796dfc.png или более минималистично s_1347539389_5353738_186028658c.png

ИМХО первый - милитари стайл.

Да, но он сейчас лучше второго.

Может второй сделать шрифтом пошире?

Это лучший дизайн из представленных для css-live.ru

Я с точностью до наоборот думаю :)

Да ладно. С этим дизайном можно работать. Его можно доработать. Предыдущие были не очень, их и дорабатывать не хотелось.

Кстати, рекомендую потусоваться тут (нужна регистрация), среди дизигнеров так сказать.

Я совершенно точно знаю что я не дизайнер, поэтому тусоваться мне там без толку.

Я могу посмотреть и по своему субъективному мнению оценить, не более.

Либо подсмотреть понравившиеся мне решения у мастеров.

Link to comment
Share on other sites

Я тоже осталась недовольна этим решением, думала сделать кнопочку там, но она как-то слишком выделялась, возможно просто старый добрый вариант сделать слово "комментарии" ссылкой.

Надо написать: "комментировать". Т.е. не абстрактная надпись "комментарии", а приказ юзеру действовать :) Юзера надо водить по сайту за ручку.

Я совершенно точно знаю что я не дизайнер, поэтому тусоваться мне там без толку.

Это я не тебе писал, а AnnaP :)

Link to comment
Share on other sites

Я совершенно точно знаю что я не дизайнер, поэтому тусоваться мне там без толку.

Это я не тебе писал, а AnnaP :)

:)

Я тоже осталась недовольна этим решением, думала сделать кнопочку там, но она как-то слишком выделялась, возможно просто старый добрый вариант сделать слово "комментарии" ссылкой.

Надо написать: "комментировать". Т.е. не абстрактная надпись "комментарии", а приказ юзеру действовать :) Юзера надо водить по сайту за ручку.

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

У второго логотипа хорошая задумка, но вот шрифт не очень :(

Link to comment
Share on other sites

Catherine, неужели все так мрачно?

Пишу как есть. Ассоциативный ряд: сыро, мрачно, блекло...

Про "последние комментарии" я думала вставить дату, а потом подумала если они "последние", то в принципе значит недавно))(хотя я согласна).

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

Слайдер для просмотра картинок и видео в статье, не заходя в саму статью.

Мне, как случайному посетителю — это лишнее, только запутывают. Мне бы примеры кода в слайдер, раз уж такое дело :blush: , картинки без содержания в данном контексте вообще неуместны, толку с них?

Кстати, а если картинок в статье не будет?

Проблемы с кнопками соц. сетей вроде не должно быть, будет больше - расположатся следующим рядом под нынешними.

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

подвал вниз всегда можно расширить и для тегов и для соц.сетей

А нужно ли? До какого состояния собираетесь расширять?

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

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

А вот это Вы очень зря. Я не собираюсь быть опытным пользователем по чьей-то прихоти, незнанию, или какой-либо великой дизайнерской идее. Я хочу удобства и интуитивно понятного интерфейса, приятных глазу цветов с не отвлекающим от основной цели дизайном. Для меня главное - удобство поиска, наглядность и читабельность, на все остальное мне, как опытному пользователю, все-равно) Разбираться зачем какая иконка стану разве только если очень приспичит быть на ресурсе, иногда с раздражением, недовольством, в особых случаях не побрезгую и крепкими выражениями в адрес умника, который считает, что простота и удобство — не кошерно.

Чем опытнее пользователь, тем больше он ценит простоту ;) Чем выше профессионализм разработчика, тем интуитивно понятнее интерфейс. Это не я должна разбираться, какая зачем иконка, это иконка должна всем своим видом и расположением мне об этом говорить.

  • Like 1
Link to comment
Share on other sites

А уместна ли ссылка "добавить комментарий" не заглядывая в статью? Может, логичнее будет в данном случае, если есть такая необходимость, "просмотреть комментарии" или "перейти к комментариям"?

  • Like 1
Link to comment
Share on other sites

1) Шрифт в заголовках слишком сжат.

2) Как то не очень хорошо "пришито":

UUW26O7c.jpg

3) Лучше выравнивать заголовки по левому краю.

4) Как сказано выше - "поиск" и "архив" нужно поменять местами. Так же, Я бы изменил для них шрифт.

5) "Статья полностью" - лучше так и написать.

6)

csOZK2g5.jpg

а) Кривой шов, везде в разных местах относительно заголовка и на половине "статья полностью".

б) Везде разное расстояние.

в) Лучше выровнять по левому краю.

7) Не переноси так "Читать далее":

VM5Q1tVd.jpg

8) Слишком однотонная, скучная цветовая гамма. Добавить бы цвета. Контраст.

9) Этот вариант дизайна хуже чем предыдущий, потому что он менее информативный.

Нет разделов, никакого разбиения на категории.

10) Не нравятся input - нужно сделать цветом, отличным от фона.

11) Кроме как title "наверх", для полоски справа можно сделать при hover другой цвет.

Edited by ar00
Link to comment
Share on other sites

Это шутка была из рекламы старой)

Шутку знаю, но я не о шутке. Я хотел сказать не разу не соответствует характеру и направленности сообщества. Насколько я понял, ccs-live - это сообщество молодых и энергичных людей, интересующихся версткой. Представленный дизайн, на мой взгляд, этого не отражает. IMHO

Link to comment
Share on other sites

ребята, конечно, молодцы, что делали, старались, но мне не нравится. Я не дизайнер, если что )

На логотипе написано SS-Live, хоть убейте меня, но это так.

аха

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

поскольку согласен с цитатой выше, остальное для меня не существенно

Edited by nerv
Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

 Share

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue. See more about our Guidelines and Privacy Policy