Сменил дизайн сайта

Одиннадцатого ноября 2000 года я запустил свой сайт на бесплатном хостинге chat.ru, дизайн его не сохранился, но это к лучшему. В то время я занимался довольно прогрессивным движком чата (обновление без перезагрузки, оптимизация под узкий канал тогдашних dial-up), который стал использовать у себя на сайте Алекс Экслер.

Он предложил мне хостить сайт у себя. Под сайт потребовался более приличный дизайн и мне его сделала дизайнер Наталия Морозова. Сейчас тот дизайн не выглядит дизайном, но тогда большинство сайтов выглядело похоже.

Второй дизайн моего сайта (20.26КиБ)

В этом виде сайт просуществовал до октября 2003 года. В феврале того же года у меня появился блог на движке «Регистр», который мы писали втроём — Дима Смирнов, я и Кукуц. Его дизайн неоднократно менялся, один из первых вариантов перед вами.

Один из первых дизайнов моего блога (26.74КиБ)

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

Дизайн до недавнего времени (56.83КиБ)

Месяц назад моему сайту исполнилось 10 лет. Я планировал к этому времени выложить новый дизайн сайта (и кое-что поменять в юзабилити), а так же сконвертировать материалы старой версии. К сроку я ничего не успел — был целиком и полностью занят проектом перевода Вики в «Яндексе» на UTF-8. Какое-то время назад я этот проект закончил и каждый день посвящал по 15—30 минут в день на переделку сайта.

Теперь всё готово.

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

Возможно, что-то где-то я забыл подпилить, так бывает. Если найдёте ошибки, пишите комментарии.
12 декабря 2010 21:02

librarian (libc6.org)
12 декабря 2010, 21:35

"Ваше _своё_ имя или адрес блога:"
Здорово, но предыдущий дизайн как то лаконичнее...

Borz de G (borz.myopenid.com)
12 декабря 2010, 21:55

Поздравляю с обновкой...

ЗЫ: да вы, батенька, "извращенец" - сидел и думал, неужто он фреймами заделал скроллинг... а оказалось он float+position врубил :)

bolk (bolknote.ru)
12 декабря 2010, 22:13, ответ предназначен librarian (libc6.org):

Oops… Поправил :)

bolk (bolknote.ru)
12 декабря 2010, 22:14, ответ предназначен Borz de G (borz.myopenid.com):

Поздравляю с обновкой...
Спасибо! :)
ЗЫ: да вы, батенька, "извращенец" - сидел и думал, неужто он фреймами заделал скроллинг... а оказалось он float+position врубил :)
Ну уж нет :) Хотя ничего криминального фреймах не вижу :)

Seigiard (инкогнито)
12 декабря 2010, 23:18

*скупая слеза течет по небритой щеке*

я помню все версии дизайна, обожемой!

xd-ru (xd-ru.ya.ru)
12 декабря 2010, 23:44

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

http://blog.denyamsk.ru (инкогнито)
13 декабря 2010, 00:10

У Бирмана все-таки поаккуратнее :)
Какие-то мелочи типа полосочки сверху, отделяющей фото+хидер от основно текста, отступы между пунктами меню, шрифты покрупнее.
Пока что предыдущий нравился больше.

xd-ru (xd-ru.ya.ru)
13 декабря 2010, 00:41

Нашел баг, пишу:
в старых постах ссылки из камментов кривые:
http://http//anecarchive.ru/pro-rodstvennikov/kogda-uznala-mat/
дублируется http://

Vladimir Moskva (fulc.ru)
13 декабря 2010, 01:28

Заголовки постов в линуксе как-то стремно выглядят.

maxim-zotov (инкогнито)
13 декабря 2010, 04:59

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

bolk (bolknote.ru)
13 декабря 2010, 07:38

Спасибо всем! Поправлю в ближайшее время баги!

bolk (bolknote.ru)
13 декабря 2010, 07:57, ответ предназначен xd-ru (xd-ru.ya.ru):

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

bolk (bolknote.ru)
13 декабря 2010, 07:58, ответ предназначен http://blog.denyamsk.ru

У Бирмана все-таки поаккуратнее :)
Какие-то мелочи типа полосочки сверху, отделяющей фото+хидер от основно текста, отступы между пунктами меню, шрифты покрупнее.
Шрифты — может быть. А полосочки он просто боится убрать :) Не нужны они :)
Пока что предыдущий нравился больше.
Это пока :)

bolk (bolknote.ru)
13 декабря 2010, 07:59, ответ предназначен Seigiard

я помню все версии дизайна, обожемой!
Старожил детектед! :)

bolk (bolknote.ru)
13 декабря 2010, 08:00

Спасибо, ребята!

Поправил, что нашли (Линукс буду на работе смотреть). Сам нашёл один баг, но поправлю попозже, он неприятный, но не фатальный.

ойой (инкогнито)
13 декабря 2010, 08:19

Вас укусил Бирман?

bolk (bolknote.ru)
13 декабря 2010, 08:36, ответ предназначен ойой

Меня пёрло от функционального дизайна ещё до того, как я познакомился с Бирманом.

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

alexei (инкогнито)
13 декабря 2010, 11:09

а где дизайн? и shift + reload делал, и adlock выключил, но дизайн так и не появился..

bolk (bolknote.ru)
13 декабря 2010, 11:17, ответ предназначен alexei

Ну, т. е., 21 век, HTML5, а вы всё ещё считаете, что «дизайн» — это когда много картиночек, рюшечек, рамочек? Ну так это не так.

rodem (инкогнито)
13 декабря 2010, 14:47, ответ предназначен bolk (bolknote.ru):

Всё-таки у поиска надо кнопку добавить. Часто ищу драг-н-дропом из вкладки во вкладку, или по странице текст таскаю. То есть работаю только мышью. И на сайте Болка как раз приходится клаву доставать чтобы enter нажать. Благо редко этим поиском пользуюсь.
Вот сразу багрепорт: http://dl.dropbox.com/u/561956/bolk.png
Если драг-н-дропом перенести текст в окошко поиска, а потом фокус убрать, то просвечивает надпись "Поиск".

rodem (инкогнито)
13 декабря 2010, 14:49, ответ предназначен rodem

Win7, Chrome dev/Firefox 4 beta

bolk (bolknote.ru)
13 декабря 2010, 14:55, ответ предназначен rodem

Ага, спасибо! Про кнопку тоже что-нибудь придумаю.

Александр Фёдоров (spambaster.ya.ru)
13 декабря 2010, 17:09

Комменты как-то в бок съезжают, так что просвечивается меню.
https://photos-1.dropbox.com/i/xl/HrvVfiex4bkEkziEsFqiwDmHws7lYbn3ocsqK54uIfM/2194345/1292342400/cbfd570

gogis (инкогнито)
13 декабря 2010, 18:37

Все хорошо, но ШРИФТЫ... FAIL FAIL :/

bolk (bolknote.ru)
13 декабря 2010, 18:50, ответ предназначен Александр Фёдоров (spambaster.ya.ru):

Картинка не открылась.

bolk (bolknote.ru)
13 декабря 2010, 18:50, ответ предназначен gogis

Все хорошо, но ШРИФТЫ... FAIL FAIL :/
А подробнее?

hshhhhh.name (hshhhhh.name)
13 декабря 2010, 20:30, ответ предназначен bolk (bolknote.ru):

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

bolk (bolknote.ru)
13 декабря 2010, 22:09, ответ предназначен hshhhhh.name:

Спасибо :)

bolk (bolknote.ru)
14 декабря 2010, 09:48, ответ предназначен Александр Фёдоров (spambaster.ya.ru):

Комменты как-то в бок съезжают, так что просвечивается меню
Я разобрался в чём дело: я обновил стили, а на клиентах они закешировались. В общем, поправил.

alexei (инкогнито)
14 декабря 2010, 10:58, ответ предназначен bolk (bolknote.ru):

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

gogis (инкогнито)
14 декабря 2010, 11:51, ответ предназначен bolk (bolknote.ru):

По поводу шрифтов - убери Trebushet в стилях :) Просто реально сравни как красиво у того же бирмана смотрятся шрифты. А тут топорненько, глаз режет. Также италик в заголовках камментов тоже не очень. Хотя я не дизайнер и ни черта не разбираюсь, чисто по ощущениям.

hshhhhh.name (hshhhhh.name)
14 декабря 2010, 11:52, ответ предназначен alexei

Имхо, он очень удобный. Максимальная цель дизайна достигнута.

bolk (bolknote.ru)
14 декабря 2010, 18:28, ответ предназначен alexei

Про дизайн с рюшечками и картинками: я не за них - в старой их небыло совсем, но было видно дизайн.
Минималистичный дизайн требует не меньше усилий чем с картинками. Не хочу обижать, но текущий дизайн упорно выглядит как будто css файл не подгрузился.
У нас разные идеалы дизайна :)

monitoringe (инкогнито)
15 декабря 2010, 14:14

Цитаты в комментах сливаются с текстом комментария.

bolk (bolknote.ru)
15 декабря 2010, 22:15, ответ предназначен monitoringe

Разве кавычка и отступ не помогают?

http://trifler.ru/blog/ (инкогнито)
17 декабря 2010, 18:15

Таже ошибка при использовании position:fixed; :)
Описана мной в http://trifler.ru/blog/comment_1287912798.html

Еще один ресурс в коллекцию курьезов, где разметка выполнена на основе position:fixed; :)
 

T1 (tiamat.name)
17 декабря 2010, 19:47

Прочитал текст на экслеровской версии сайта. Написано: "в общем добро пожаловать". Запятая же пропущена!

bolk (bolknote.ru)
18 декабря 2010, 14:09, ответ предназначен T1 (tiamat.name):

Теперь исправить уже невозможно :)

bolk (bolknote.ru)
18 декабря 2010, 14:12, ответ предназначен http://trifler.ru/blog/

Таже ошибка при использовании position:fixed; :)
Можете рассказать что не так? А то я не вижу. Лучше со скриншотом.

http://trifler.ru/blog/ (инкогнито)
18 декабря 2010, 15:58, ответ предназначен bolk (bolknote.ru):

Можно и скриншот - http://trifler.ru/blog/i/image/web_06.png
Наглядно показывает проблемы использования position:fixed;
при изменении размеров рабочей области окна браузера по горизонтали,
с появлением горизонтальной прокрутки и попытками ею поиграться :)
Попытка скомпенсировать негативную составляющую подобного рода разметки,
а именно запас пустого пространства справа, чуть все скрашивает,
но если отодвинуть разметку от левой части окна браузера, то будет еще хуже :)

Вот и приходится выбирать или использовать разметку страницы с position:fixed
с описанной проблемой, или искать альтернативу, где есть свои нюансы, либо вообще
не использовать фиксированные блоки (колонки) на web-странице :)
В качестве примера разметка на абсолютном позиционировании http://trifler.ru/blog/i/layouts/fixed/fix_left.htm

bolk (bolknote.ru)
18 декабря 2010, 19:43, ответ предназначен http://trifler.ru/blog/

Это IE 6? Я не поддерживают IE до 8-го и поддерживать не собираюсь. Хватает того, что в этих браузерах сайт открывается и я постарался сделать, чтобы он выглядел неплохо.

bolk (bolknote.ru)
18 декабря 2010, 20:09, ответ предназначен http://trifler.ru/blog/

А вот с шириной комментариев какой-то баг. Буду смотреть. Они должны быть шире.

bolk (bolknote.ru)
18 декабря 2010, 20:10, ответ предназначен http://trifler.ru/blog/

Баг с шириной комментов поправил.

http://trifler.ru/blog/ (инкогнито)
18 декабря 2010, 21:13, ответ предназначен bolk (bolknote.ru):

Это IE 6?
Скриншот снят в IE8

Но посмотрим скриншоты снятые в:
Google Chrome - http://trifler.ru/blog/i/image/web_07.png
OPERA - http://trifler.ru/blog/i/image/web_08.png

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

А поддержка того или иного браузера - воля автора ресурса :)

bolk (bolknote.ru)
18 декабря 2010, 23:05, ответ предназначен http://trifler.ru/blog/

Скриншот снят в IE8
Я было не хотел его поддерживать, в связи со скорым выходом IE9, но вспомнил, что есть пользователи XP, где IE9 не будет. Надо что-то придумать.
Меню, которое по идее, всегда должно быть доступно отсутствует
Наверх промотайте.
Обратите внимание на положение горизонтальной прокрутки.
Горизонтальная прокрутка там, потому что у моего сайта есть минимальная ширина, обусловленная шириной картинок, которые я использую в материалах.

http://trifler.ru/blog/ (инкогнито)
18 декабря 2010, 23:30

Надо что-то придумать.
Думаю, при использовании position:fixed, проблемы останутся.
Наверх промотайте.
Меню из фиксированной колонки становится горизонтальным и уходит в шапку сайта
и, чтобы до него добраться, мотать страницу назад, какой в этом смысл,
если меню должно быть всегда доступно, ведь в этом и состоит главная идея вашей разметки,
не так ли?


 

bolk (bolknote.ru)
19 декабря 2010, 00:55, ответ предназначен http://trifler.ru/blog/

Думаю, при использовании position:fixed, проблемы останутся.
Проблемы возникают из-за того, что IE8 почти ничего не умеет из media queries. Возможно, придётся эмулировать скриптом.
Меню из фиксированной колонки становится горизонтальным и уходит в шапку сайта
и, чтобы до него добраться, мотать страницу назад, какой в этом смысл,
если меню должно быть всегда доступно, ведь в этом и состоит главная идея вашей разметки,
не так ли?
Нет, конечно. Просто есть два вида сайта: для небольшого окна и для широкого. Это нормальная практика, привыкайте.

bolk (bolknote.ru)
19 декабря 2010, 00:55

Ох, цитату неправильно оформил :(

http://trifler.ru/blog/ (инкогнито)
19 декабря 2010, 11:20

Когда посетитель открыл ресурс и обнаружил, что меню зафиксированно,
он вправе предположить, что при изменении размеров окна браузера,
оно останется на месте.
 
А кульбиты оного...
Является ли это хорошой практикой, вопрос спорный :)

bolk (bolknote.ru)
19 декабря 2010, 11:43, ответ предназначен http://trifler.ru/blog/

он вправе предположить, что при изменении размеров окна браузера, оно останется на месте.
Что ж, он ошибётся. Надеюсь, это будет самой сильной ошибкой в этой жизни.
А кульбиты оного…
Является ли это хорошой практикой, вопрос спорный :)
Совершенно нет. Мне очевидно, что сайты не обязаны смотреться одинаково при разных разрешениях экрана.

http://trifler.ru/blog/ (инкогнито)
19 декабря 2010, 12:42, ответ предназначен bolk (bolknote.ru):

Что ж, он ошибётся.
А может быть ошибается автор ресурса :)
Мне очевидно, что сайты не обязаны смотреться одинаково при разных разрешениях экрана.
С каких пор разрешение экрана монитора и простое уменьшение размеров окна
браузера по вертикали и горизонтали, при оценке визуала сайта, стало равнозначным? :)

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

Еще один пример - http://trifler.ru/blog/i/layouts/fixed/fixed_left_content.htm
Довести его до кондиции, а он дан в редакции двух годичной давности, собственно не проблема.
Работает во всех популярных брайзерах, включая и IE6(7,8)

bolk (bolknote.ru)
19 декабря 2010, 13:49, ответ предназначен http://trifler.ru/blog/

А может быть ошибается автор ресурса :)
Автор ресурса точно знает как всё работает :)
С каких пор разрешение экрана монитора и простое уменьшение размеров окна браузера по вертикали и горизонтали, при оценке визуала сайта, стало равнозначным? :)
Для сайта это одно и тоже. Какая разница сайту каковы размеры монитора? Что вообще это меняет? А вот размеры окна, конечно же, сказываются на том как сайт смотрится.
В любом случае, проблему просмотра страниц ресурса, при различных размерах окна браузера, хотя бы в IE8, если более ранние версии не поддерживаются принципиально, что, в общем-то, не проблема, речь идет только о корректной верстке, надо решать.
Посмотрите что я несколькими комментариями выше написал: «я было не хотел его (IE8) поддерживать, в связи со скорым выходом IE9, но вспомнил, что есть пользователи XP, где IE9 не будет. Надо что-то придумать».

Кстати, моя вёрстка полностью корректна.
Довести его до кондиции, а он дан в редакции двух годичной давности, собственно не проблема. Работает во всех популярных брайзерах, включая и IE6(7,8)
Не работает в моей «Опере» 11, не работает в моём «Хроме» 10. Появляется горизонтальная прокрутка.

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

http://trifler.ru/blog/ (инкогнито)
19 декабря 2010, 14:38, ответ предназначен bolk (bolknote.ru):

Автор ресурса точно знает как всё работает :)
Только вот пользователю об этом неведомо :)
Кстати, моя вёрстка полностью корректна.
...что можно сделать в IE8. Вероятно, это будет какой-то JavaScript.
А без него никак? :)
Думаю, в этом случае навлекете на себя гнев апологетов web-стандартов :)
Не работает в моей «Опере» 11...
Появляется горизонтальная прокрутка.
А она и должна появляться при уменьшении размеров окна браузера.
Разметка адаптирована под разрешение 1024*768, на разрешениях ниже, скажем - 800*600
горизонтальная прокрутка будет присуствовать сразу.

В предложенной по линку разметке, страница ведет себя вполне предсказуемо,
min/max-width имеется, и практически находится по центру рабочей области браузера, что плюс.
Все только на чистом html и css, за исключением эмуляции min/max-width для IE6.

Единственно, при нахождении курсора мыши над фиксированной колонкой,
страница не прокручивается по вертикали, это минус :)

bolk (bolknote.ru)
19 декабря 2010, 16:00, ответ предназначен http://trifler.ru/blog/

Только вот пользователю об этом неведомо :)
Стоит один раз попробовать.
А без него никак? :)
Думаю, в этом случае навлекете на себя гнев апологетов web-стандартов :)
Никак, конечно. IE8 не поддерживает всего необходимого. По нынешним временам это очень слабый браузер.

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

http://trifler.ru/blog/ (инкогнито)
19 декабря 2010, 16:13, ответ предназначен bolk (bolknote.ru):

Хозяин - барин :)

bolk (bolknote.ru)
19 декабря 2010, 16:38, ответ предназначен http://trifler.ru/blog/

Очень жаль, что IE9 не будет в XP. У пользователь XP есть другой выход — Google Chrome Frame.

chun lu (инкогнито)
13 января 2011, 21:34, ответ предназначен bolk (bolknote.ru):

>А кульбиты оного…
Является ли это хорошой практикой, вопрос спорный :)
Совершенно нет. Мне очевидно, что сайты не обязаны смотреться одинаково при разных разрешениях экрана.
Очень клевая идея убирать боковое меню при уменьшении ширины окна. Онотоле одобряе!

Ваше имя или адрес блога (можно OpenID):

Текст вашего комментария, не HTML:

Кому бы вы хотели ответить (или кликните на его аватару)