Рекомендованные сообщения

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

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

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

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

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

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

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

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

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

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах

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

 

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

Изменено пользователем cyklop77

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах

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

 

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

 

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

 

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

 

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

Изменено пользователем hypnocolor

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах

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

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах

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

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах

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

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах

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

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

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах

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

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

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах

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

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах

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

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

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах

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

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах

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

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах

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

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

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах

 

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

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

 

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

 

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

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах

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

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах

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

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

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах

А что не так?

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

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах

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

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах

Создайте аккаунт или войдите в него для комментирования

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

Создать аккаунт

Зарегистрируйтесь для получения аккаунта. Это просто!

Зарегистрировать аккаунт

Войти

Уже зарегистрированы? Войдите здесь.

Войти сейчас

The Beginner JavaScript Programming Course


  • Спрашивают сейчас

  • Пишут сейчас

    • Дорогие Друзья! Рад вам сообщить о выходе новой версии движка Flextype и обновленном плагине Admin (Flextype 0.7.3 + Admin 0.3.0) 🚀 Это серьезное обновление для Flextype! Множество новых возможностей и фиксов улучшающие стабильность и производительность системы!  За эти 19 дней было потрачено более 100 часов на разработку и тестирование, запушено более 300 коммитов в репозитории проекта 👽 Изменения в Flextype 0.7.3: 
      - Flextype Компонент I18n обновлен до 1.2.0
      - Flextype Компонент Filesystem обновлен до 1.1.3
      - Symfony YAML Компонент обновлен до 4.2.1
      - Настройки теперь хранятся в одном settings.yaml файле
      - Content: добавлена возможность создавать скрытые страницы. Изменения в Admin 0.3.0:
      - Новая красивая админка в темном стиле! 
      (светлая тема будет в след. релизах)
      - Information: Страница информации отображает версию ядра и версию плагина админки
      - Users: теперь будут создаваться более безопасные пароли используя php функции password_hash и password_verify
      - Files manager: заменен на новый Media manager.
      - Pages Manager: улучшен функционал клонирования страниц. Теперь клонируется вся папка со страницей.
      - Pages Manager: исправлена бага с переименованием страниц #26 
      - Pages Manager: поле ссылки удалено из таблицы с страницами
      - Pages Manager: в быстрые экшена добавлена возможность просмотра страниц, ссылка открывает страницу в новом окне браузера.
      - Pages Manager: улучшено отображение вложенных страниц! теперь более наглядно отображаются вложенные страницы.
      - Pages Manager: исправлена бага с ссылкой на страницу по умолчанию, которая далее ломала логику работы с клонированными странницами.
      - Pages Manager: исправлена бага с пустым полем template
      - Pages Manager: добавлена возможность выбирать тему страниц при ее создании.
      - Pages Manager: много улучшений и исправлений в функционале по работе с страницами.
      - Pages Manager: Новый редактор страниц, редактор схемы (индивидуальные поля), редактор шаблона, редактор исходника страницы!
      - Plugins Manager: для плагина админки выключатель отключен, но отображается.
      - General: используется новые I18n 1.2.0 компонент.
      - General: используется новые Filesystem 1.1.3 компонент.
      - General: добавлена библиотека Gajus Dindent HTML для форматирование HTML кода, это позволяет сохранять красивый HTML после редактора!
      - General: добавлен Assets Manager для Javascript 
      - General: добавлен Animate.css для анимаций.
      - General: Fontawesome обновлен до 5.6.0 
      - General: Twitter Bootstrap обновлен до 4.1.3
      - General: Codemirror добавлен для лучшей работы с кодом.
      - General: es6-promise обновлен до 4.2.5
      - General: popper.js обновлен до 1.14.6
      - General: gulp-autoprefixer обновлен до 6.0.0
      - General: добавлена система отображения оповещений #41 
      - General: добавлена валидация форм jquery.form-validator.js
      - General: добавлено форматирование YAML файлов при их сохранении.
      - General: много общих улучшений архитектуры и скорости!
      - General: обновленная и улучшенная навигация!
      - Translates: много исправлений и улучшений в переводах. 
      Спасибо: Hmelex, AndiLeni, diomed Скачать Flextype 0.7.3
      https://github.com/flextype/flextype/releases/download/v0.7.3/flextype-0.7.3.zip Скачать Flextype 0.7.3 + Admin 0.3.0
      https://github.com/flextype/flextype/releases/download/v0.7.3/flextype-0.7.3-admin-0.3.0.zip Если у вас есть предложения по улучшению Админки и Ядра системы, пишите в комментариях и на официальном DISCORD сервере: https://discord.gg/tjEHXWD  
    • Большое спасибо за помощь, добавил с помощью теней по бокам  белые отступы и все получилось как в примере.
  • Лучшие авторы

  • Текущие цели пожертвований