WebReference.ru

[Vlad]

Друзья, представляю вам новый проект - webreference.ru, доступен также по короткому адресу http://webref.ru

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

webref.ru - это сайт, на котором будут справочники и руководства по темам, не обязательно связанным с вёрсткой, как сейчас на htmlbook. К тому же работать над ним будет не один человек, а несколько. С htmlbook же постепенно уберу справочники и переделаю сайт. Как, ещё не знаю, речь не об этом.

Итак, что хотелось бы услышать.

- найденные баги, ошибки в отображении материалов;

- общее впечатление;

- удобство использования;

- что убрать, что добавить.

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

[cyklop77]

жаль, что в html/css-справочниках нет возможности открывать примеры в живом виде(в новом окне то есть). иногда удобно посмотреть на результат при изменённом размере окна

 

и после нажатия на кнопку поиск с пустым запросом перебрасывает на страницу, у которой футер как-то некрасиво смотрится

Edited January 12, 2015 by cyklop77

[hypnocolor]

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

 

 

Ещё вот такую штуку заметил — в крошках лишнее слово, если открыть что-то из «Категорий» в CSS, например (то же самое для «Значений»):

 

 

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

Edited January 12, 2015 by hypnocolor

[nerv]

@Vlad, задумка не плохая. В качестве идеи могу предложить сделать справочник по es6 =)

[Vlad]

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

[psywalker]

Влад, а эту новость нельзя добавить на css-live пока?

[Vlad]

Макс, пока не надо, сайт официально не открыт. Находится в процессе тестирования, доработки и наполнения ещё.

[psywalker]

Макс, пока не надо, сайт официально не открыт. Находится в процессе тестирования, доработки и наполнения ещё.

Понял, согласен!

[Vlad]

Ряд вопросов возник организационного характера, хотел обсудить.

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

2. Какие комментарии ставить — DisqUs как на htmlbook или уже появилось что-то более продвинутое и интересное?

3. Что выводить на главной в заголовке? Там сейчас просто серая полоса. Её либо убрать, либо поставить какую-нибудь картинку. Тогда какую?

4. Что выводить в сайдбаре? Кроме содержания ничего нет, скучно. Хотелось бы какое-то разнообразие.

Отдельно вопросы по справочнику HTML.

5. Блок «Типы тегов» хотел сократить и убрать блочные и строчные элементы. Это уже вроде как неактуально, вон в HTML5 вообще от таких понятий отказались. Что думаете?

6. В том же блоке нужна ли ссылка «HTML5»? В самом справочнике все такие теги обозначены.

7. В справочнике есть поиск тегов, обозначен как «Тег HTML». Может как для идиотов написать: «Введите тег HTML» или что другое?

8. Стоит ли объединять этот поиск с CSS или оставить в каждом справочнике свой? Если объединять, тогда можно будет вводить и теги и свойства, перекидывать будет на нужную страницу.

9. В справочнике есть синтаксис XHTML, где он отличается от HTML, например, для <br>. Сохранить его или уже удалить?

И по CSS.

10. В CSS есть функции и их довольно много, вроде linear-gradient(). В какое меню их вставлять — в список свойств или в значения свойств? Если в последнее, тогда это меню начинает разрастаться по высоте и надо его как-то ограничивать, чтобы дизайн по высоте был компактнее.

11. Как нагляднее писать версии браузеров - 9 или 9.0?

[psywalker]

Ряд вопросов возник организационного характера, хотел обсудить.

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

2. Какие комментарии ставить — DisqUs как на htmlbook или уже появилось что-то более продвинутое и интересное?

3. Что выводить на главной в заголовке? Там сейчас просто серая полоса. Её либо убрать, либо поставить какую-нибудь картинку. Тогда какую?

4. Что выводить в сайдбаре? Кроме содержания ничего нет, скучно. Хотелось бы какое-то разнообразие.

Отдельно вопросы по справочнику HTML.

5. Блок «Типы тегов» хотел сократить и убрать блочные и строчные элементы. Это уже вроде как неактуально, вон в HTML5 вообще от таких понятий отказались. Что думаете?

6. В том же блоке нужна ли ссылка «HTML5»? В самом справочнике все такие теги обозначены.

7. В справочнике есть поиск тегов, обозначен как «Тег HTML». Может как для идиотов написать: «Введите тег HTML» или что другое?

8. Стоит ли объединять этот поиск с CSS или оставить в каждом справочнике свой? Если объединять, тогда можно будет вводить и теги и свойства, перекидывать будет на нужную страницу.

9. В справочнике есть синтаксис XHTML, где он отличается от HTML, например, для <br>. Сохранить его или уже удалить?

И по CSS.

10. В CSS есть функции и их довольно много, вроде linear-gradient(). В какое меню их вставлять — в список свойств или в значения свойств? Если в последнее, тогда это меню начинает разрастаться по высоте и надо его как-то ограничивать, чтобы дизайн по высоте был компактнее.

11. Как нагляднее писать версии браузеров - 9 или 9.0?

 

1. Думаю, что нужно. Автору будет приятно, не зря старался), да и дата публикации тоже важна, чтобы люди примерно понимали насколько, например, уже устарела инфа.

2. Я бы вначале поставил DisqUs, посмотрел бы как пойдёт это дело, если в будущем будет видно, что DisqUs маловато, то можно будет заморочиться над более крутыми.

3. Не понял, о какой полосе идёт речь.

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

5. Здесь я цитирую Илью (SelenIT'a):

я бы отталкивался от классификации HTML5

блочные и строчные — это седая история, а вот поточные и фразовые/текстовые вполне актуальны

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

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

пепелсбей дал ссылку на забавную наглядную демку: http://apps.workflower.fi/vocabs/html/en

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

сразу понятно, что вот это элемент, вот это теги, вот это имя тега и т.п. в живом примере)

 

 

 

7. Если быть честным, то "Тег" и "Элемент" -- это разные вещи. Поясню на примере: <b> -- открывающий тег, а </b> -- закрывающий, а в целом <b></b> -- называется "Элемент". В 2015-м называть элементы тегами дико несерьёзно. Поэтому я бы вообще на всём сайте заменил "теги" на "элементы", а в поиске написал бы  «Введите элемент».

8. Я бы сделал отдельные. Люди ищут либо одно, либо другое.

9. Удалить даже не думая. Все браузеры давно уже всё парсят в HTML5. Поэтому другие доктайпы и т.д. считается старьём и их смело можно выкидывать.

 

10. Вообще linear-gradient() -- значение background-image. Поэтому скорее всего их нужно упаковать в категорию "Значения". В меню можно сделать одну лесенку дополнительную для значений.

11. Думаю "9" будет вполне достаточно.

[Vlad]

Макс, спасибо за мнение. Сейчас локально внесу соответственные изменения, на сайте ближе к концу недели обновлю. Но уже заметно что стало лучше.

[xsladfs]

http://savepic.su/4653979.png

[Vlad]

http://savepic.su/4653979.png

Что за браузер? У меня нет такой ошибки.

[nerv]

https://yadi.sk/i/ft2y8ruYdyyLt

Chrome, страница css/display

[Vlad]

https://yadi.sk/i/ft2y8ruYdyyLt

Chrome, страница css/display

А что не так?

[xsladfs]

 

http://savepic.su/4653979.png

Что за браузер? У меня нет такой ошибки.

 

firefox last version, 1366x768

[Vlad]

Обновил сайт. Теперь есть поиск по CSS и он даже работает. css/display тоже подправил, но в Firefox не проверял.

Меню убрал наверх, хлебные крошки переместил чуть выше. Ну и так по мелочи кое-что исправил.

[Анна]

В "Вёрстка","Программирование","Мобильные приложения", может, подвал к низу укрепить? А то на большом экране прямо посредине черный подвал(у меня сразу внимание на нём акцентируется). Естественно, они будут пополняться, но пока, до поры до времени.

[Vlad]

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

[Vlad]

жаль, что в html/css-справочниках нет возможности открывать примеры в живом виде(в новом окне то есть). иногда удобно посмотреть на результат при изменённом размере окна

Great Rash предложил хорошую идею по этому поводу - перевести примеры на Codepen или JSFiddle. Код встраивается прямо на сайт, виден сразу результат примера, а главное - с кодом можно экспериментировать и смотреть что получится.

[psywalker]

 

жаль, что в html/css-справочниках нет возможности открывать примеры в живом виде(в новом окне то есть). иногда удобно посмотреть на результат при изменённом размере окна

Great Rash предложил хорошую идею по этому поводу - перевести примеры на Codepen или JSFiddle. Код встраивается прямо на сайт, виден сразу результат примера, а главное - с кодом можно экспериментировать и смотреть что получится.

 

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

 

Но в любом случае это всё не 100%, возможно у нас вордпресс и это связано с ним, поэтому ты попробуй у себя, если прокатит и тормозов не будет, то дерзай! Считай, что это просто предостерегающий знак

[Vlad]

Макс, а ты не сравнивал по производительности разные системы? Мне субъективно кажется, что Codepen чуть тормознее, чем, например, JSFiddle.

[psywalker]

Макс, а ты не сравнивал по производительности разные системы? Мне субъективно кажется, что Codepen чуть тормознее, чем, например, JSFiddle.

Кстати, да, согласен с этим. Тоже такое замечал. Я бы поступил так: проверил бы разные варианты и выбрал бы менее тормознутый. В случае, если эксперимент выявил бы дикие тормоза, вообще бы отказался от этой затеи.

[nerv]

А что не так?

мне показалось, что документ в документе - это перебор

[Vlad]

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