Шапка сайта - Страница 2

Дата: Понедельник, 13.05.2013, 17:38 | Сообщение № 21

Группа: Админы

Ранг: Местный житель

Сообщений: 16475

Репутация: 2749 ±

Замечаний: ±

Excel 2016

Цитата (nerv)

сравниваешь не корректно ты

Блин, Саш, я ничего не сравниваю вообще! Я просто написал что в макете

Цитата (Serge_007)

Почти 40 000 знаков

, а ты начал 40 000 знаков ВСЕГО макета приравнивать к 200 знаков табов:

Цитата (nerv)

обычные табы заняли у тебя 40 000 знаков

Цитата (nerv)

я бы рекомендовал тебе

Спасибо, обязательно воспользуюсь этим советом

ЮMoney:41001419691823 | WMR:126292472390

Дата: Понедельник, 13.05.2013, 19:24 | Сообщение № 22

Группа: Админы

Ранг: Старожил

Сообщений: 2004

Репутация: 752 ±

Замечаний: ±

Сергей, я нверно соглашусь с Александром, если хочешь сделать ленточный интерфейс, то сделать нужно качественно:
1. Нужно чтобы было похоже на оригинал. ~~У тебя табы квадратные, а нужно с закруглением~~ Проверил в Опере - закругленные, в IE8 - квадратные
2. Нужно тщательно подготавливать картинки, без черных полос, правильное выравнвание и т.п.
Даже если сам делаешь картинку то сделай ее правильно, например кнопка "Вход", сравни оригинал, твоего производства, и то что я набрасал за пару минут:

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

К сообщению приложен файл: 4347447.png (4.3 Kb) · 0349775.png (7.2 Kb)

Сообщение отредактировал MCH - Понедельник, 13.05.2013, 20:27

Дата: Понедельник, 13.05.2013, 21:40 | Сообщение № 23

Группа: Редакторы

Ранг: Обитатель

Сообщений: 431

Репутация: 193 ±

Замечаний: 0% ±

Цитата (MCH)

Даже если сам делаешь картинку

в современном интернете, для подобного картинки уже не применяют. Есть специальные свойства css, кот. позволяют наложить любой градиент.
Статья http://htmlbook.ru/css3-na-primerakh/lineinyi-gradient
Песочница 1 http://ie.microsoft.com/testdrive/graphics/cssgradientbackgroundmaker/
Песочница 2 http://gradients.glrzad.com/
Песочница 3 http://css3.mikeplate.com/

Цитата (MCH)

Проверил в Опере - закругленные, в IE8 - квадратные

пользователи старых ие либо:
- меняют браузеры на не ие
- обновляют браузеры
- идут лесом

Чебурашка стал символом олимпийских игр. А чего достиг ты?
Тишина - самый громкий звук

YM 41001156540584 / WM WMR R21924176233

https://github.com/nervgh/vba

Дата: Понедельник, 13.05.2013, 22:56 | Сообщение № 24

Группа: Админы

Ранг: Местный житель

Сообщений: 16475

Репутация: 2749 ±

Замечаний: ±

Excel 2016

Цитата (MCH)

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

Я тоже согласен с Сашей и уж точно хочу сделать как можно качественней. Только это мой первый подобный опыт и естественно я ещё много чего не знаю как делать

Цитата (MCH)

Нужно чтобы было похоже на оригинал

Да, я это неоднократно упоминал

Цитата (MCH)

Проверил в Опере - закругленные, в IE8 - квадратные

Во всех браузерах, кроме ишака табы закруглённые. Ишак не понимает свойство border-radius. Замены этому свойству, насколько я знаю нет. Как вариант - вместо табов использовать картинки вкладок. Но не думаю что это хорошее решение

Цитата (MCH)

если сам делаешь картинку то сделай ее правильно

Делал по твоему "рецепту", но видимо не сильно получается sad

Надеюсь на твою помощь

Цитата (MCH)

Кода не должно быть очень много

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

Цитата (MCH)

нужно обеспечить совместимость с различными браузерами

Проверял во всех основных браузерах, на мониторах с разными разрешениями. "Косяков" не обнаружил

Цитата (nerv)

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

Да, но я так и не смог понять алгоритм градиента верха окна Excel. Складывается впечатление что заливка производится рандомно (см. скрин)

Цитата (MCH)

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

Цитата (MCH)

Нужно чтобы было похоже на оригинал

Да, я это неоднократно упоминал

Цитата (MCH)

Проверил в Опере - закругленные, в IE8 - квадратные

Цитата (MCH)

если сам делаешь картинку то сделай ее правильно

Делал по твоему "рецепту", но видимо не сильно получается sad

Надеюсь на твою помощь

Цитата (MCH)

Кода не должно быть очень много

Цитата (MCH)

нужно обеспечить совместимость с различными браузерами

Проверял во всех основных браузерах, на мониторах с разными разрешениями. "Косяков" не обнаружил

Цитата (nerv)

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

К сообщению приложен файл: 6546290.gif (89.6 Kb)

ЮMoney:41001419691823 | WMR:126292472390

Сообщение

Цитата (MCH)

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

Цитата (MCH)

Нужно чтобы было похоже на оригинал

Да, я это неоднократно упоминал

Цитата (MCH)

Проверил в Опере - закругленные, в IE8 - квадратные

Цитата (MCH)

если сам делаешь картинку то сделай ее правильно

Делал по твоему "рецепту", но видимо не сильно получается sad

Надеюсь на твою помощь

Цитата (MCH)

Кода не должно быть очень много

Цитата (MCH)

нужно обеспечить совместимость с различными браузерами

Проверял во всех основных браузерах, на мониторах с разными разрешениями. "Косяков" не обнаружил

Цитата (nerv)

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

Автор - Serge_007
Дата добавления - 13.05.2013 в 22:56

Дата: Вторник, 14.05.2013, 00:26 | Сообщение № 25

Группа: Редакторы

Ранг: Обитатель

Сообщений: 431

Репутация: 193 ±

Замечаний: 0% ±

Цитата (Serge_007)

точно не скажу, т.к. не специалист, но похоже на радиальный градиент http://htmlbook.ru/css3-na-primerakh/radialnyi-gradient По этой же ссылке, слева, есть список тем, можешь глянуть.

Дата: Вторник, 14.05.2013, 00:33 | Сообщение № 26

Группа: Админы

Ранг: Местный житель

Сообщений: 16475

Репутация: 2749 ±

Замечаний: ±

Excel 2016

Цитата (nerv)

похоже на радиальный градиент

Ничего общего :)

Цитата (nerv)

По этой же ссылке...

Саш, http://htmlbook.ru - это моя настольная книга последние полгода biggrin

ЮMoney:41001419691823 | WMR:126292472390

Дата: Вторник, 14.05.2013, 07:36 | Сообщение № 27

Группа: Админы

Ранг: Старожил

Сообщений: 2004

Репутация: 752 ±

Замечаний: ±

Цитата (Serge_007)

http://htmlbook.ru - это моя настольная книга последние полгода

Кстати, у htmlbook очень симпотичное меню сверху в виде ленты, иконки качественно прорисовны

Дата: Вторник, 14.05.2013, 09:25 | Сообщение № 28

Группа: Админы

Ранг: Старожил

Сообщений: 2004

Репутация: 752 ±

Замечаний: ±

Вот так выглядит шапка, если ее открыть в IE8 под XP в неполное окно

Нужно переверстывать
С картинками я могу помочь, а вот с CSS или JS - сложновато

К сообщению приложен файл: 6100839.png (63.4 Kb)

Дата: Вторник, 14.05.2013, 09:50 | Сообщение № 29

Группа: Админы

Ранг: Местный житель

Сообщений: 16475

Репутация: 2749 ±

Замечаний: ±

Excel 2016

Цитата (MCH)

Нужно переверстывать

Там стиль div'ов стоит с фиксированной шириной, это я поменяю, хотя при уменьшении экрана по ширине любые табы будут выстраиваться горизонтально...

Цитата (MCH)

С картинками я могу помочь

Спасибо! Остальное, естественно я сделаю

ЗЫ Интересно, на скрине у тебя все картинки в рамке почему-то. Такое только в ишаке наблюдается...

ЮMoney:41001419691823 | WMR:126292472390

Дата: Вторник, 14.05.2013, 16:09 | Сообщение № 30

Группа: Редакторы

Ранг: Обитатель

Сообщений: 431

Репутация: 193 ±

Замечаний: 0% ±

Цитата (Serge_007)

Ничего общего smile

на основании чего ты сделал такой вывод? Я, например, вижу "точку света" в нижней области кнопки (судя по всему за ее пределами) http://yadi.sk/d/5Fdmrp7i4pHeP

http://css-live.ru/article....ka.html
http://cssdeck.com/labs/christmas-button/0

Дата: Вторник, 14.05.2013, 16:34 | Сообщение № 31

Группа: Админы

Ранг: Местный житель

Сообщений: 16475

Репутация: 2749 ±

Замечаний: ±

Excel 2016

Цитата (nerv)

на основании чего ты сделал такой вывод?

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

ЮMoney:41001419691823 | WMR:126292472390

M73568

Дата: Вторник, 14.05.2013, 16:59 | Сообщение № 32

Группа: Проверенные

Ранг: Форумчанин

Сообщений: 197

Репутация: 46 ±

Замечаний: 0% ±

2007-2013

Цитата (Serge_007)

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

Мне кажется это из-за сжатия в JPEG, вернее в GIF. В bmp всё ровно.

К сообщению приложен файл: 5674137.jpg (28.0 Kb)

Сообщение отредактировал M73568 - Вторник, 14.05.2013, 17:03

Дата: Вторник, 14.05.2013, 17:03 | Сообщение № 33

Группа: Админы

Ранг: Местный житель

Сообщений: 16475

Репутация: 2749 ±

Замечаний: ±

Excel 2016

Спасибо, попробую другие форматы, хотя и без графического редактора видно что в Excel строка заголовка и строка названий вкладок залита неравномерно

ЮMoney:41001419691823 | WMR:126292472390

Дата: Вторник, 14.05.2013, 17:28 | Сообщение № 34

Группа: Редакторы

Ранг: Обитатель

Сообщений: 431

Репутация: 193 ±

Замечаний: 0% ±

Цитата (M73568)

Мне кажется это из-за сжатия в JPEG, вернее в GIF

именно

ikki

Дата: Вторник, 14.05.2013, 18:57 | Сообщение № 35

Группа: Друзья

Ранг: Старожил

Сообщений: 1906

Репутация: 504 ±

Замечаний: 0% ±

Excel 2003, 2010

Цитата (Serge_007)

я так и не смог понять алгоритм градиента верха окна Excel

http://www.gamedev.ru/code/forum/?id=155475
?

помощь по Excel и VBA
ikki@fxmail.ru, icq 592842413, skype alex.ikki

Дата: Вторник, 14.05.2013, 19:30 | Сообщение № 36

Группа: Админы

Ранг: Старожил

Сообщений: 2004

Репутация: 752 ±

Замечаний: ±

Цитата (ikki)

http://www.gamedev.ru/code/forum/?id=155475 ?

Мне понравилась там фраза

Цитата

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

Может нужно позаботится о лицензии? а то прикроют сайт smile

Дата: Суббота, 18.05.2013, 08:10 | Сообщение № 37

Группа: Админы

Ранг: Местный житель

Сообщений: 16475

Репутация: 2749 ±

Замечаний: ±

Excel 2016

Цитата (nerv)

именно

Вот в чём дело - градиент сложный и МНОГОСЛОЙНЫЙ

К сообщению приложен файл: 8009964.gif (25.5 Kb)

ЮMoney:41001419691823 | WMR:126292472390

Дата: Суббота, 18.05.2013, 21:27 | Сообщение № 38

Группа: Админы

Ранг: Старожил

Сообщений: 2004

Репутация: 752 ±

Замечаний: ±

Цитата (Serge_007)

я обложился учебниками по HTML, CSS и JavaScript и за последние полгода соорудил (с посторонней помощью) такой макет шапки сайта и форума. Почти 40 000 знаков, и куча бессонных ночей

Сергей, если честно, то мне дизайн ленты в твоем исполнении не понравился
Решил сделать свою редакцию:
http://www.excelworld.ru/Ribbon

Цитата (Serge_007)

Первую часть макета делал профессиональный web-дизайнер...

Я не профессиональный Web-дизайнер, но чтобы сделать подобное понадобилось пару дней.
Это как вариант, у меня много времени ушло на то чтобы разобратся с CSS, т.к. я его почти не знаю, хорошо что есть сайт http://htmlbook.ru

Проверял сайт только в Опере, поэтому возможны глюки в других браузерах

Сообщение отредактировал MCH - Воскресенье, 19.05.2013, 13:39

Дата: Суббота, 18.05.2013, 21:48 | Сообщение № 39

Группа: Админы

Ранг: Местный житель

Сообщений: 16475

Репутация: 2749 ±

Замечаний: ±

Excel 2016

Цитата (MCH)

мне дизайн ленты в твоем исполнении не понравился

Мне тоже

Но он всё же лучше чем текущий smile

Цитата (MCH)

Решил сделать свою редакцию

Абалдеть! Миш, просто супер!

Цитата (MCH)

Я не профессиональный Web-дизайнер, но чтобы сделать подобное понадобилось пару дней.

Видимо сказывается твой опыт верстания smile

Мне понадобилось гораздо больше времени, потому что уровень моих знаний на момент начала разработки составлял полный и абсолютный НОЛЬ.
Я не знал НИ ОДНОГО тега smile

ЮMoney:41001419691823 | WMR:126292472390

AndreTM

Дата: Суббота, 18.05.2013, 22:11 | Сообщение № 40

Группа: Друзья

Ранг: Старожил

Сообщений: 1762

Репутация: 501 ±

Замечаний: 0% ±

2003 & 2010

Цитата (Serge_007)

Я не знал НИ ОДНОГО тега

И не краснеешь smile

<b> <i> и <u> ты точно знал... cool

Кстати, по теме:
1. Предполагается ли отдельная версия сайта для мобильных устройств (не wap, конечно, - но для малых планшетов и нетов дизайн будет убивать всё место). Или хотя бы возможность натянуть "простой" скин с минимумом функционала (через насройки в профиле).
2. Не сделать ли настроечку в профиле - "отключить риббон-меню", и показывать тогда вместо интерактивной шапки просто аналогичную картинку. Менюшки в левом фрейме ведь всё равно останутся? Это для низкоскоростных соединений.

Skype: andre.tm.007
Donate: Qiwi: 9517375010