Jump to content

WebReference.ru


Vlad
 Share

Recommended Posts

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

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

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

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

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

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

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

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

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

  • Like 9
Link to comment
Share on other sites

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

 

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

Edited by cyklop77
Link to comment
Share on other sites

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

 

Image%202015-01-12%20at%203.28.31%20pm.p

 

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

 

Image%202015-01-12%20at%203.36.28%20pm.p

 

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

Edited by hypnocolor
  • Like 1
Link to comment
Share on other sites

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

Link to comment
Share on other sites

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

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?

Link to comment
Share on other sites

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

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" будет вполне достаточно.

Link to comment
Share on other sites

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

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

Link to comment
Share on other sites

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

Link to comment
Share on other sites

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

Link to comment
Share on other sites

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

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

  • Like 2
Link to comment
Share on other sites

 

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

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

 

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

 

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

Link to comment
Share on other sites

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

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

Link to comment
Share on other sites

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

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