@oleg-s

Оцените верстку?

Сделал для себя учебную верстку по бесплатному макету. Вопросы на которые, возможно, мне смогут дать ответы более опытные верстальщики:
- Постарался соблюсти принцип БЭМ для именования классов. Верно ли я применяю?
- К сожалению, не удалось сделать, чтобы макет абсолютно соответсвовал PixelPerfect, особенно это заметно в тексте. Тестировал в Chrome 55.0.2883.87 (Windows 10). Подскажите на примере какого-нибудь блока в чем я делаю ошибки
- Так же хотелось бы прочесть любую конструктивную критику

Небольшое отступление, добавлю обязательно еще мобильный вариант и слайдеры, это в процессе. Хотелось бы узнать ошибки на том этапе, что выполнен.

Исходники https://github.com/oleg-tgn/html-template-beautifu...
Демо https://oleg-tgn.github.io/html-template-beautiful...
  • Вопрос задан
  • 432 просмотра
Пригласить эксперта
Ответы на вопрос 6
aliencash
@aliencash
Партизан
sh3mahan
@sh3mahan
что-то вроде веб-разработчика
Проверил через сервис Google:
Результат Mobile-Friendly Test
Проверил с телефона:
Chrome 55.0.2883.91/854x480px
Все элементы на своих местах, но текст неудобочитаемый
c7856a4e139a4dc68cd4132dd72611d0.png
Ответ написан
Uwe_Boll
@Uwe_Boll
Я Злой и Страшный Уве Болл в Разработке знаю Толк
единственное до чего можно докопаться это:
<div class="clear"></div>
и отсутствие тэгов figure и figcaption
и ТЫ недооценил силу списков

и за каким юхом ТЫ посылаешь форму Get' om
Ответ написан
Rsa97
@Rsa97
Для правильного вопроса надо знать половину ответа
Порезанные сверху и снизу буквы в полях ввода, отсутствие min-width:
3710c95fb2cb45dc94adfae5d094c046.png
Ответ написан
Добавлю еще несколько скринов:
1.https://yadi.sk/i/GF4lco0w37ofzk
На фф текст в инпуте выглядит обрезным и textarea не фиксированных размеров.

2. https://yadi.sk/i/bxlx7D7s37oh4p
Зачем использовать картинку, если можно залить обычным цветом

3. https://validator.w3.org/nu/?doc=https%3A%2F%2Fole...
Тег img обязательно должен иметь alt.

4. Класс .wrapper - бесполезный. Примените к body заливку и все.

5. ИМХО не стоит прописывать селлектору .gallery display: inline-block;

6. В textarea при проверке через хром и фф отличается шрифт. В одном с засечками, в другом без.
Аналогичная ситуация с outline.

7. Футер по умолчанию разве не блок? Если не прав - подправьте.

8. Такие вещи лучше делать списком
https://yadi.sk/i/LfSdmtb237ospk

9. К не закрытым тегам типа input,img, link - стоит прописывать в конце "/"

10. https://yadi.sk/i/_tQ2_Tw037ovTC
Это, конечно, мелочь, и не играет никакой серьезной роли, но с выходом хтмл5, уже можно не прописывать type при подключении css

11. Конкретно по цсс ничего сказать особого не могу т.к. дело каждого, какие стили прописывать какие нет, но, единственное, это надо уметь правильно форматировать. Про это почитайте в интернетах.
Ответ написан
Ankhena
@Ankhena Куратор тега CSS
Нежно люблю верстку
1. textarea растягивается и по вертикали и по горизонтали.

2. У body уже установлен color: #9b9b9b; зачем его еще несколько раз устанавливать для Welcome to my portfolio?

3. Есть классные теги section, article, figure, figcaption, main

4. У кнопки submit курсор должен быть "ладошкой" и хорошо бы какое-то изменение при наведении.

5. Не знаю, как точно надо в БЭМ, но лично меня бесят классы для h1 и h2 и т.д. если они всюду одинаковые.

6. Почему имя в форме пишется красным, а остальное серым?

7. Считаю, что placeholder должен исчезать при получении фокуса. (Тут 50 на 50, есть разные мнения)

8. .gallery-wrapper зачем фон картинкой?

хватит :)
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы