Курс молодого бойца или как стать верстальщиком?

Тема в разделе "Вёрстка (HTML, CSS)", создана пользователем alex_storm, 1 май 2013.

  1. alex_storm

    alex_storm дизайн, CSS Команда форума

    Регистрация:
    11 дек 2012
    Сообщения:
    1.120
    Симпатии:
    560
    Решили заняться версткой? Класс! Давайте разберемся с чего нужно начинать обучение и как правильного его построить.

    Для начала разберем, что такое верстка. Верстка страниц – это процесс стилизации и оформления сайта средствами редакторов и каскадных таблиц стилей.

    Согласно стандартам W3C, верста делиться на: блочную(div) и табличную(table, tr, td). Большинство современных сайтов использует блочную верстку(div). Почему? Все просто. Блочная верстка гибче по отношению к табличной и легче для поисковой машины.
    Двигаемся дальше – курс обучения HTMLверстальщика…

    Вся ирония заключается в том: "чем больше практики, тем больше знаний!". Верстальщик не должен забывать учится, и следить за развитием технологий, помимо мониторинга и обучения он так же должен пробовать верстать эти новые технологии.

    Начнем с базового курса обучения. Рекомендую курс от “СПЕЦИАЛИСТА” – HTML и CSS, уровень 1 и уровень 2. Для молодого верстальщика вполне достаточно этого как базового курса. В дальнейшем верстаем больше сайтов и получаем больше знаний.

    Для работы рекомендую сразу установить себе из браузеров: Chrome, Opera 10, Mozilla 12, IE Tester, Яндекс.Браузер(Как ни странно написан на одном движке с хромом, но отображение в некоторых местах различное).
    Так же для быстроты работы мы пользуемся генераторами стилей, чтобы не прописывать в ручную вот сервис - css3gen.com. Удобно, быстро и кроссбраузерно. Так же просмотреть генераторы можно в теме - различные онлайн генераторы.

    База есть? Отлично! Идем дальше.. UPlevel.:frantic:
    Тенденция развития веб-технологий не стоит на месте. На сегодняшний день требования для верстальщиков возрастают сами собой. Все это связано с тем, что появилось больше интерфейсов для просмотра Ваших сайтов: планшеты, мобилки, смарт-ТВ и мини интернет холодильники (видел лично в супермаркете). Понятное дело, что каждый интерфейс имеет свое разрешения и свой браузер для просмотра Вашего сайта.

    В большинстве случаев на планшетах и смартфонах ядро браузера WebKit. Естественно задача упрощается, можно проверить отображение на обычном ноутбуке в хроме. Но что делать с разрешением?! На помощь приходят готовые framework, которые упрощают жизнь на 50%. Один из таких полезных HTML framework – это bootstrap. Чтобы разобраться с framework достаточно: базовых знаний + немного практики и примерно недельку времени для новенького.


    Если Вы изначально научитесь создавать сайты с отображением под все интерфейсы, низкий Вам поклон! Просто со временем заказчик покупает планшет и понимает, что его сайт выглядит, мягко говоря – :poop: . И естественно он обращается за доработками на фриланс. В этом случаи фрилансер(senior) просмотрев код, может ужаснуться и назвать цену, от который сам заказчик ужаснется:cold: . Поймите, проще сделать все с нуля, чем переделывать чужое…


    Для молодых верстальщиков рекомендую к просмотру тем: кто в чем верстает и какой сайт лучше: резиновый или фиксированный. И не забывайте смотреть Хаки для браузеров, потому что отображение может быть разным.

    P.S. Пишем проблемы на форуме не стесняемся! Поможем решить! Удачи!:biggrin:
     
    yoda4 и slawikjw нравится это.
  2. Mali

    Mali

    Регистрация:
    27 фев 2015
    Сообщения:
    1
    Симпатии:
    0
    Подскажите пожалуйста, я хочу на сайте поставить картинку фоном в файле css прописываю путь к папке в которой он находится:
    Код:
    *{
        padding:0; margin:0;
        }
    body{
         background-color: #2d012f;
         background-image: url(images/bg-body.jpg)
       }
    но в браузере она вообще не отображается, что я сделала не так?
     
    Lasted edited by : 27 фев 2015
  3. iwwk

    iwwk

    Регистрация:
    29 июл 2016
    Сообщения:
    1
    Симпатии:
    0
  4. rsbrdr

    rsbrdr

    Регистрация:
    13 авг 2016
    Сообщения:
    2
    Симпатии:
    0
    Проверьте путь к картинке, посмотрите размеры body, возможно он не растягивается на весь экарн.
     
  5. decast

    decast

    Регистрация:
    29 авг 2016
    Сообщения:
    7
    Симпатии:
    0
    Курс Специалист | HTML и CSS. Уровень 1-2 (Верстальщик Web) (2015)
    http://nnmclub.to/forum/viewtopic.php?t=978940
    Качайте и будет вам счастье!