В мире разработки новые вопросы у программистов возникают каждый день. Ещё больше вопросов возникает если ты начинающий разработчик. Новые технологии первое время даются с трудом. Из-за споров опытных программистов непонятно за изучение чего взяться. Почему нужно делать так, а не так? Где найти информацию касательно того или того? Почему лучше делать так, чем так? И главный вопрос, у кого спросить?

Итак, под катом статья о самых частых ошибках и вопросах возникающих при изучении веб-разработки.

Viewport

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

<meta name="viewport" content="width=device-width, initial-scale=1">

Не когда вы сверстали десктопную версию сайта и собрались начать адаптировать. Ни, боже упаси, после того как сделали адаптивную верстку. Всегда перед началом верстки. Перед!

Шрифты

Шрифты всегда была и будет моя самая нелюбимая часть верстки. Их нужно правильно подключить, правильно настроить и это на первых этапах вызывает головную боль(хотя казалось бы, в чем могут быть проблемы). Дальше по пунктам.

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

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

Третье. Используйте Google Fonts (это не реклама, это реально удобно).

Четвертое. Используйте сервис Font2Web. Он практически полностью искореняет возможные проблемы с подключением шрифта.

Пиксель перфект верстка и динамичные сайты

Пожалуй всегда нужно помнить, что макет — это макет, а не точный вид сайта. И хотя, по возможности, нужно максимально придерживаться макета, все таки, стоит помнить, что браузеры разные и как бы мы ни добивались кроссбраузерности, некоторые вещи всегда будут отличаться. И кстати, заказчикам это тоже можно и нужно сообщать.

А еще следует помнить, что все элементы на сайте динамические. Например, если вы верстаете страницу с записями блога, а в дизайне на этой странице только 4 поста с короткими заголовками длиной в 10 символов, то нужно помнить, что страница должна хорошо отображаться и если постов будет и 10, и 30. И так же хорошо должен отображаться заголовок состоящий из 10, 20, 40 символов, а не только из 10. И из-за роста количества символов в заголовке не должна плыть верстка.

Используйте Stack Overflow

Странно звучит для некоторых, но все же. Когда начинаешь постигать веб-разработку ты ещё не знаешь о куче крутых штук и сервисов помогающих в работе. И одна из самых важных и первых вещей для разработчика, это научиться пользоваться сервисом stack overflow. Для тех кто не знает, это сервис для разработчиков, где можно задать свой вопрос и получить ответ от других программистов. Так же база вопросов и ответов хранится, поэтому прежде чем задавать вопрос всегда необходимо проверить, может кто-нибудь уже задавал его ранее. Для тех кто плохо дружит с английским есть русская версия сайта(база вопросов/ответов там по-меньше, но так же отлично развивается).

Учитесь постепенно!

Это действительно важно. Много начинающих разработчиков на первых порах обучения очень сильно метаются между технологиями. Сегодня хочу учить html, завтра попробую jquery, потом попробую boostrap, на следующий день php, а может react выучить попробовать?

Пожалуйста, успокойтесь. Даже если ваша цель в итоге стать офигенным back-end программистом на php в любом случае в начале выучите html и css. Когда он станет вам понятен попробуйте узнать азы javascipt. Даже если вы не планируете писать код на нем, javascript для веб-разработчика обязательный стандарт поэтому эти знания точно лишними не будут. И когда вы сможете быстро и без запинок на гугленье сделать так чтобы при клике на кнопочку «меню», меню появлялось и при повторном клике пропадало, смело можете переходить к php.

Ещё один совет касательно изучения javascript. Сейчас многие опытные программисты могут меня захейтить, но этот совет мне дал именно более опытный программист, когда я только начинал. Javascipt проще начинать учить с библиотек.

То есть совсем простые вещи необходимо уметь делать на нативном js, но если какие-то функции и методы типа JSON.stringify или Array.prototype даются с трудом, то можно повременить. Выучите jQuery, сделайте парочку самых простых сайтов с его использованием. Попробуйте Vue.js, попробуйте собрать на нем какое-нибудь веб-приложение. С каждой выученной библиотекой понимание js будет все лучше и лучше. А там вы и сами не заметите как вернетесь к более глубокому постижению нативного javacript.

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