Адаптивная страница — получилось?

Question

[Дмитрий]

Добрый день всем!

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

Вот ссылка на результат: dmitribogachev.pe.hu/portfolio - хостинг бесплатный, браузер может ругаться на безопасность (:

Буду рад услышать конструктивную критику и обратную связь.

Comments

[IceJOKER]

С хрома появляется горизонтальный скролл, что не есть хорошо И ЭТО НЕ САЙТ ОЦЕНКИ!

Answer 1

[Денис Инешин]

Не получилось. Я сходу получил горизонтальную прокрутку. А её не должно быть вообще на адаптивных сайтах.

Comments

[Дмитрий]

Спасибо, исправил.

[Aleksandr]

Дмитрий: Только вот overflow-x: hidden не красивое решение)

[Aleksandr]

Дмитрий: от того, что как-то блок вылезает за пределы

[Дмитрий]

Александр Котов: я как понимаю это из-за того, что у меня max-width в body? Необходимо обернуть все в обертку и там задавать ширину?

[Aleksandr]

Дмитрий: могу вам подсказать, проблема в меню

[Дмитрий]

Александр Котов: все, я понял в чем проблема) Спасибо, буду решать.

[Дмитрий]

Александр Котов: исправил)

Answer 2

[GreatRash]

При размере в районе 840-880 пикселей у меня горизонтальный скролл. Зачем меню снизу на мобилах? Ожидаешь его сверху увидеть. Разве это по канонам UX?

Comments

[Дмитрий]

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

[Aleksandr]

Дмитрий: Если пользователь нажимает "Меню", он хочет его увидеть сразу там, где он находится. Выпадающее меню делается легко при помощи css

[Дмитрий]

Александр Котов: Спасибо. Тогда на днях переделаю меню.

[GreatRash]

Дмитрий: Именно для этого человечество придумало offcanvas-меню. Как по мне удобней нет ничего.

[Дмитрий]

GreatRash: да, это удобно. Одно только но, он же с помощью JavaScript работает?

[GreatRash]

Дмитрий: Ну смотря какие браузеры должны его поддерживать. Если новые, то всё ок: www.sitepoint.com/pure-css-off-screen-navigation-menu

[Дмитрий]

GreatRash: я пытался делать все по методике Mobile First. Весь шаблон был начат с мобильной версии и потом разрастался. А мобильная версия должна быть самая легкая, то есть в идеале без JavaScript и тд. А за ссылку спасибо)