Svetlana_P

Чтобы дочерние элементы не поворачивались, задавайте им ту же трансформацию, но со знаком минус. Вот, например А так, куча способов есть, в зависимости от макета и задач выбирают. Не у всех хорошо с адаптивностью и кроссбраузерностью. Некоторые тут можно подсмотреть: https://css-tricks.com/creating-non-rectangular-headers/ Вообще, много примеров есть. Вы ищите по запросу CSS Skewed Background

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

Понятно! В любом случае, спасибо за информацию А что за сервис?

Посмотрела, спасибо. А что не так с идеей? Почему сочли бесполезной? По-моему, хорошая штука. Как я поняла, попасть на страницу с конкретным блогом можно только человеку, у которого есть ссылка? Другое дело, в плане продвижения и т.п. не могу оценить, насколько будет успешно всё.

Обязательно выкладывайте Успехов

Здравствуйте! Вы уточните просто, чего именно хотите. Одно дело, если научиться верстать самому, и это Ваша проба пера. Тогда скажите, в чем должна заключаться помощь. Советы по дизайну или куда двигаться дальше или что? Или Вам нужен работающий, "современный" сайт-визитка. Это совсем другое дело. Тогда не вижу смысла самому верстать, если совсем нет опыта. Уйдет очень много времени. Гораздо проще и быстрее настроить сайт на движке Wordpress с готовой темой

Я бы иконки векторными сделала или использовала иконочный шрифт. Покажите сайт, где Вы видели изменение фото под разные экраны без потери качества? Можно воспользоваться той же техникой Но не думаю, что просто меняя свойства через css, этого можно добиться. Посмотрите еще в сторону JS плагинов. Я про этот слышала http://adaptive-images.com/ , но не пользовалась еще.

Привет! Вы только в скайпе? В любом случае, адрес — в студию

Здравствуйте! Показали бы пример, где и какие именно Не думаю, что есть универсальный ответ для всех картинок. Как вариант, через атрибут srset ставить разные изображения, каждое в нормальном качестве. Вместо того, чтобы менять размер свойствами css. Посмотрите статьи https://webformyself.com/adaptivnye-izobrazheniya-na-sajte-sozdanie-s-pomoshhyu-atributa-srcset/ , http://www.webmasters.by/articles/html-coding/3485-adaptivnye-izobrazheniya-attributy-srcset-i-sizes.html

Вы можете, пожалуйста, выложить пример в песочницу? Чтобы всем было проще

Например, тут можно найти. Смотрите, где в заголовке есть PSD http://www.bestpsdfreebies.com/freebies/ , https://stylemixthemes.com/freebies/ Еще в ежемесячной рассылке от HTML Academy приходит на почту по три шаблона. При чем не абы каких, а обычно красивых и, бывает, нестандартных. Подписаться можно здесь https://htmlacademy.ru/email Лучше, чтобы было и то, и другое. У label и placeholder разные функции. Ярлык, label — подпись к полю, чтобы было ясно, что вводить. А placeholder призван подсказать, в каком виде вводить данные. При использовании только placeholder неудобство в том, что когда поле в фокусе, не остается указателя, что туда вводить. По-моему, получилось хорошо. Раз сами сверстали и впервые натянули шаблон на WP, то всё выполнено, и Вы молодец

Привет! Если оценивать именно дизайн — то да, соглашусь с RealPeha, мне тоже не очень. Потому что: Общий стиль устаревший: много явно лишних деталей, слайдер в шапке неудобный. Размер заголовков на главной хромает: например, название секции "What I Can All Do" и подзаголовки этой секции набраны одним размером. В итоге на название вообще глаз внимание не обращает. Размер обычного текста мелковат: 13px, глазки жалко У формы контактов нет ярлыков к полям для ввода, это неудобно. В футере неожиданная ссылка на страницу прямо с абзаца текста. Красная строка у абзацев в статьях непривычна глазу. Понравилась цветовая схема. По верстке не знаю, к чему придраться, потому что нет исходного шаблона. Вроде порядок с виду. Кроме того, что не адаптивно А, ну и семантические теги main, nav не использованы. Если говорить о работе сайта, то заметила: Из футера не работают ссылки на страницы блога. На ленте блога маловато записей, всего три. А дальше надо листать. Я бы побольше сделала. Там же нет перехода на страницу статьи по клику на картинку, я бы добавила. В остальном, вроде обычный WP сайт. Вы его будете наполнять?

Создать PHP шаблон страницы > загрузить по FTP в папку текущей темы > в консоли WP создать новую страницу по этому новому шаблону. Так делали? Если да, то не совсем понятно, в чем сейчас сложность

Вы хотите эту страницу, не зависимую от остального сайта, править в той же консоли WP? В этом загвоздка?

Можете показать примеры удачного, на Ваш взгляд, дизайна в таком стиле? Почему Вы так думаете? Я серьезно спрашиваю, потому что такой подход встречаю впервые Хорошо бы примеры.

Жаль А ссылки на него не осталось? Так, из интереса посмотреть.

Спасибо большое, что поделились! И за подробные комментарии. Поможет настроить свой

Очень в тему! Благодарю

Добрый день! Вы бы выложили, что уже есть, и прислали ссылку. Попробую посмотреть. PS Не совсем поняла, зачем две одинаковые темы?.. Вот Вы еще создали, хотя вопрос тот же

Привет! Как бы вы сверстали, если в дизайне страницы для больших экранов не предусмотрен заголовок h1? Скажем, состояние пункта меню бросается в глаза и явно дает понять, где находится пользователь. И дублирование смысла не добавляет. А на мобильной версии наоборот, заголовок нужен, поскольку меню схлопывается. Вот пример http://borodin-art.ru/painting . Заголовки стоят пока. Тег h1 на странице всё же иметь хотелось бы, но без трюков типа display. Чтобы поисковые системы не ругались. Как вообще поступают в таких случаях? Если пришел такой дизайн.

Синтаксис не учли. Поменяйте местами свойства и добавьте запятую после Tahoma. Тут посмотрите раздел про синтаксис. Там свойства в нужном порядке перечислены https://www.w3schools.com/cssref/pr_font_font.asp

Какова судьба проекта? Так и остался в виде идеи?

Привет! В целом мне понравился) Хорошо: Цветовая схема белый-желтый-черный, приятна глазу В секциях размер шрифта на большом экране, удобно читать. Сами шрифты. Отсутствие явно лишних деталей. Я тоже люблю минимализм) Содержимое раздела "Прочее") Мысли по улучшению: На первом экране явно написать, что это. Сейчас там Ваше имя очень мелким шрифтом и где-то внизу. А вид деятельности вовсе не указан. Т.е. я с ходу не поняла, где я. Пока не понимаю, чем оправдан большой размер меню, его позиция справа и большой заголовок "Меню"? Я не дизайнер, но у меня первый экран вызвал замешательство. Попробуйте как-то объединить обе части. Я бы не ставила русский и английский язык на одну страницу без возможности выбора. В разделе "Портфолио" мне фон как-то не очень. Почему, потому что он влияет на восприятие картинок с работами. Посмотрите, тот же "Social marketing" вообще слился с фоном. По-моему, спокойный светлый был бы уместней. Но вообще это спорно... Если первый экран и портфолио доработать, то, может, и черный пойдет. Или, если очень нравится черный, сделать его в контактах. Там же надо как-то разделить работы между собой. Хотя, если замените фон, может, и не придется. Я бы переименовала "Прочее" на что-то более информативное. Например, "эксперименты". А иначе, пока не заглянешь, не поймешь, что это значит. В разделе "Прочее" более явно показать, что можно кликать на работы... Сейчас как-то непривычно и с ходу непонятно, что будет, если нажму на весь текст. Там же я бы заменила красный на другой. Красный обычно воспринимается как сообщение об ошибке, если это не вписано в общий дизайн. Хорошо бы в меню слева подчеркивать пункт, где я сейчас нахожусь. В контактах проставьте ссылки, чтобы можно было кликать. А из текста ссылок уберите лишнее, оставьте только домен. Предложение "Вы можете связаться со мной одним из следующих способов" я бы убрала, потому что говорит об очевидном.

Большая картинка с телефоном съехала влево. Для адаптивности, в первую очередь, должен быть мета-тег с вьюпортом https://developer.mozilla.org/ru/docs/Mozilla/Mobile/Viewport_meta_tag . Добавьте, и можно дальше смотреть. Отступы между элементами сильно отличаются от тех, что в макете. Это сразу видно при наложении скриншота верстки на макет. Порядок подключения css не очень. Сейчас первым идет файл main, а потом normalize. Но ведь normalize может переопределить какие-то свойства, зачем Вам это надо. Пусть идет сначала normalize. Если приходится иконки делать мелкими картинками, то лучше объединять эти картинки в спрайт. При увеличении количества текста в цитате едет верстка. Там же круглая фотка сверху обрезана. Тень вокруг записей в блоге сильно отличается по цвету и насыщенности. Текст в логотипе CompanyName имеет смысл текстом сделать, если шрифт есть. Насчет верстки нижнего меню — теги a внутри nav — не думаю, что это не правильно. Тег nav для навигации по сайту и нужен. Насколько и читала и видела, в последнее время многие верстают такой структурой <nav> <ul> <li><a href="">Ссылка 1</a></li> <li><a href="">Ссылка 2</a></li> <li><a href="">Ссылка 3</a></li> </ul> </nav> Семантически здесь нет ошибки, но для продвижения вроде лучше. Но на источник сослаться не могу, нет закладки.

Привет! Архива нет. Залейте на Яндекс.Диск, например, и пришлите ссылку. Заодно и на макет, по которому верстали, в png. Я не профи, но гляну и прокомментирую, что замечу, в том числе про адаптивность. Насчет БЭМ: тоже перешла на него пару месяцев назад и довольна. Немного бесит кол-во классов, но зато всё ясно. Я бы сосредоточилась на изучении и понимании основ HTML/CSS. Попозже обязательно фреймворк Bootstrap, особенно сетку. Много макетов по ней.