Стоит ли учить html. Нужно ли знать HTML

Здравствуйте, уважаемые читатели блога сайт. Сегодня я хотел бы поговорить о том, зачем вам может понадобиться при вашей работе с сайтом знание языка HTML (читайте про то, что это такое ), основы работы с таблицами каскадных стилей CSS (вступительную статью по теме вы найдете ), а так же понимание хотя бы основ и принципов , построения программ на языке PHP и логики работы с базами данных MySQL.

позволяет делать сайты, не владея все упомянутыми выше премудростями, но при этом у вас по ходу работы, наверняка, будут возникать вопросы и проблемы, которые вы не сможете решить средствами даже самой навороченной CMS (Joomla, WordPress, Друпал и т.д.).

Зачем может понадобиться при работе над сайтом знание языков (разметки, стилей, серверного программирования)

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

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

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

Начну я, конечно, с оформления вебстраниц (собственно, на данный момент я уже это дело закончил и вы можете ознакомиться с результами и ). Как я уже упоминал в одном из предыдущих постов, до недавнего времени все ресурсы состояли из страничек в формате HTML. Причем, там задавалось и наполнение вебсайта (тексты, изображения, таблицы) и его оформление (цвета, фон, отступы).

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

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

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

C появлением таблиц стилей многие теги языка гипертекстовой разметки и их атрибуты стали считаться устаревшими и не рекомендованными для использования. Вместо них советуют использовать свойства CSS, выполняющие те же действия. Это отнюдь не означает, что HTML теперь уже изучать не надо, просто уменьшилось количество тегов и их атрибутов, которые надо знать и уметь использовать для создании и поддержания в должном состоянии сайта. Я постараюсь рассказать про те теги, которые я сам постоянно использую.

В каком редакторе лучше править или вносить изменения в код

Ничего сложного в этом нет, ведь по сути это даже не язык программирования, а гипертекстовая разметка, нечто похожее на синтаксис в русском языке. Что хотелось бы сразу посоветовать, опираясь на собственный опыт? Пробуйте писать теги самостоятельно в блокноте, типа Notepad++ (читайте мой ), а не в программах, типа Дримвьювер. Почему?

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

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

Хотя, это мое личное мнение (ИМХО) и вам решать, что удобнее. Например, Евгений Попов , по курсам которого я изучал все это дело, судя по всему, приверженец Дримвьевера. Важно в принципе одно – чтобы вы правили код в том редакторе, который способен сохранять все внесенные изменения и который может, при желании, вернуть все как было (взад).

В этом случае, как бы вы не напортачили, все будет поправимо. И, конечно же, очень удобна подсветка синтаксиса языка, на котором вы пишете или редактируете код. Notepad++ — это безусловно мой выбор! О его возможностях я рассказал в приведенной чуть выше статье.

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

В то время, как теги вебстраниц в современной CMS не записаны в каком-то одном или нескольких файлах, как было раньше, а генерируется (интерпретируется) из PHP. И именно уже сгенерированный таким образом Html код подсовывается браузеру для того, чтобы он в свою очередь интерпретировал его в удобоваримую для нас форму интернет-странички. Хитро, не правда ли?

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

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

Какие инструменты вы сможете использовать

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

Тут вам поможет великолепный плагин для не менее великолепного браузера , а так же упомянутый выше Notepad++, и не безызвестный многим . Эта связка программ поможет вам горы свернуть и позволит сэкономить массу времени.

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

Ну вот, цели намечены, задачи поставлены, осталось только их выполнять. За сим разрешите откланяться.

Удачи вам! До скорых встреч на страницах блога сайт

посмотреть еще ролики можно перейдя на

Вам может быть интересно

Как сделать горизонтальное или вертикальное выпадающее меню для сайта на основе CSS и Html в онлайн сервисе
Красивые русские шрифты для сайта и компьютера в онлайн сервисе Google Font - где скачать и как установить Адаптивный (отзывчивый) дизайн - оптимизация сайта для его просмотра на мобильных устройствах
Gif, Png или Jpg - форматы растровой графики для веба, их плюсы и минусы при использовании на сайте

Можно с уверенностью сказать, что 21 век – это век Интернета. В каждом доме есть источники этого замечательного изобретения человечества. Мы заходим в сеть, открываем страницы сайтов, получаем информацию, развлекаемся или совершаем покупки. Но ни кто из нас, пользователей, не задумывается, как построены, и кем созданы все эти ресурсы. По большому счёту, оно нам и не надо. Мы же детально не изучаем, как работает компьютер. Работает себе и хорошо. Пользуемся мы и ладно.

Но иногда бывают случаи, когда появляется потребность в каких-то дополнительных знаниях. И тут уже одними «хорошо» и «ладно» не отделаешься. К примеру, некоторая работа в Интернете сама по себе уже предполагает базовые знания HTML. К примеру, работа с текстами. Эти знания нужны хотя бы для того, чтобы просто отформатировать этот самый текст.

А что вообще такое HTML? Аббревиатура HTML означает HyperТext Markup Language. В переводе с английского – язык гипертекстовой разметки. Надо помнить, что HTML – это никакой не язык программирования, как некоторые ошибочно думают, а именно язык разметки. Его выучить довольно просто. Основное назначение HTML – предать странице с помощью различных тегов особый вид. На его базе можно построить несложный сайт. На таком сайте можно разместить информация о себе как об авторе, своё портфолио, контактную информацию и прочее. В общем, всё, что в голову придёт.

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

Конечно, сегодня можно и вовсе обойтись без HTML. При желании есть возможность создать сайт, используя лишь специальный конструктор. Подобные программы бывают версий офлайн и онлайн. Если работы по созданию собственного ресурса производятся с использованием конструктора в офлайне, то все действия можно проводить без подключения к Интернету. Лишь в самом конце, когда ресурс уже сформирован, при выгрузки его в Интернет, нужна связь. Ну, а онлайн – понятно, что в обязательном порядке требуется наличие сети.

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

Сегодняшняя заметка будет ответом на интересный вопрос, который я недавно получил от одного из подписчиков. Вот текст письма:

Здравствуйте, Евгений!

В последнее время, я всё чаще и чаще стал уделять внимание материалам по CMS и от того, что я читал, и слушал настроение у меня падало всё больше и больше)))).

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

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

Вот я и решил обратиться к тебе с вопросом как же всё таки обстоят дела на самом деле и какое место занимают готовые CMS в профессиональном сайтостроении?

На самом деле, сейчас есть тенденция к тому, что для создания сайтов всё чаще применяются различные готовые движки (CMS), такие как Joomla, Drupal, Wordpress, DLE и т.д.

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

Но с другой стороны, я думаю, что еще рано списывать со счетов HTML, CSS и PHP, т.к. без знания этих вещей трудно будет создать действительно стоящий и уникальный сайт. Ведь CMS - это не панацея, и очень часто приходится копаться в коде системы, чтобы добиться нужного результата. А код большинства CMS - это связка HTML+CSS+PHP.

Сейчас я работаю над курсом по одной популярной CMS-системе. И каждый день провожу в работе с этой системой много времени. И могу сказать, что не было такого дня, чтобы я не использовал знаний HTML, CSS и PHP.

Да, на CMS можно сделать сайт, прицепить к нему какой-то бесплатный дизайн, наполнить материалами и получить сайт, который как брат близнец похож на другие сайты, сделанные тем же путем.

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

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

Если мы знаем, что блоки можно так и так изменять, то мы можем использовать это в наших работах.

Frontend frameworks

Есть еще фрэймворки. Так называемые frontend frameworks. Самый популярный – это bootstrap. Я тоже покажу что это такое. В двух словах – это набор компонентов, которые уже можно использовать в вашем сайте. То есть они с разными размерами, они работают определенным образом. Этот набор компонентов можно давать верстальщику и он на основе этих компонентов уже все собирает. Это все упрощает, то есть вместо того, чтобы придумывать эти вещи самому, можно взять готовые и их использовать. Самые популярные getbootstrap, foundation, pure, semantic и т.д. (рис.3,4).

Рис.3 Frontend frameworks

Рис.4 Frontend frameworks

Есть анимационные фрэймворки (рис.5). Мы можем тоже брать готовые элементы и на их основе создавать какие-то вещи. Мы можем что-то крутить, что-то двигать, что-то заполнять цветом, двигать под углом, двигать с искажением, увеличивать. Все это дает нам новые возможности для выражения. Одно дело мы просто нажимаем кнопочку в интерфейсе, другое дело когда у нее есть какая-то дополнительная анимация. Конечно с этим стоит быть действительно аккуратным и внедрять только, когда это важно и нужно.

Рис. 5 Animation frameworks

Опять же есть все готовое и можно просто давать ссылку вашему верстальщику и наглядно показывать что вам нужно, чтобы он сделал.

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

Рис. 6 Схема с верстальщиком

Рис. 7 Люфт

Дизайн веб-сайта на html/css

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

Рис. 8 Схема с технологом

Технолог – это ваш рычаг (рис.9). Гаечный ключ, который вы можете подбирать в зависимости от задачи.

Рис.9 Рычаг

Если дизайнер-технолог. Это вообще прекрасно, когда вы сами знаете возможности в анимации (frontent) и вы сами их внедряете, пробуете, экспериментируете, может что-то новое создаете и т.д. И это в идеале. Потому что, чем точнее контрольза результатом, тем этот результат лучше.

Рис. 10 Схема дизайнер-технолог

Существует софт, который позволяет работать дизайном веб сайта на html/css без знания кода (рис.11): Adobe Muse, Adobe Edge Animate, Macaw, Webflow. Есть курсы по этим программам, соответственно изучайте и пробуйте.

Рис.11 Программы для работы дизайном сайта на html/css без знания кода

В итоге, нужно ли знать html в веб дизайне? Нет.

Дизайнер не должен верстать, но знать и понимать как страницы строятся (html/css), понимание framework – это да, потому что дизайнер должен разбираться в том материале, с которым работает.

Узнайте больше по профессии веб дизайнера в моем бесплатном мастер-классе.

Давайте рассмотрим каждый вариант в отдельности и попробуем выяснить его особенности.

1) HTML — это язык разметки гипертекста. Мы набираем текст определенными правилами и получаем красивую веб-страницу. Скажем так: это самый трудоемкий способ создания сайта. Чтобы убедиться в этом, достаточно открыть код даже маленькой html-страницы и увидеть, сколько всего там написано. Нелегко набрать столько кода, даже если будешь пользоваться html-редактором, не правда ли? А если в этом коде нужно что-нибудь изменить, представляете, сколько времени на это может уйти?

2) Конструктор сайта — эта программа, которая позволяет из готовых шаблонов создать ваш собственный сайт.

Прежде всего, программы такого рода можно разделить на две группы:
— Off-line конструкторы — могут работать и без подключения к Интернету. Единственное, когда это подключение вам понадобится — это когда нужно будет опубликовать сайт в сети или внести изменения в уже работающий сайт.
— On-line конструкторы — здесь же все наоборот. Весь процесс создания сайта происходит непосредственно в Сети.

Возможности таких программ тем больше, чем больше вы за них заплатите. Если будете пользоваться бесплатной версией, то рискуете сильно разочароваться. Обычно платные версии конструкторов сайтов дают возможность:
— быстро менять дизайн сайта;
— редактировать сайт в режиме on-line;
— подключать программные модули (сервисы поиска по сайту, голосование, обратная связь, новостная лента и др.);
— обращаться в службу поддержки.

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

3) CMS (Система управления контентом). Представляет собой программу, написанную на языке веб-программирования, которая устанавливается на ваш сайт и полностью управляет информацией на нем. Установив такую систему, не нужно заботиться о дизайне, достаточно просто вводить текст и содержание. Все остальное сделает программа. Мое мнение: это самое функциональное решение. Здесь есть все возможности для создания профессионального сайта. Управлять таким сайтом можно прямо в режиме on-line. Самое главное — здесь можно найти очень даже не плохие бесплатные решения.

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

Как известно, способами, которые я привел выше, сайт создается из готовых шаблонов. Вы зависите от них. Представьте, что вам нужно доработать какую-нибудь мелочь, а такого шаблона просто нет. Что делать? А установить данную доработку ну просто жизненно необходимо. Это хорошо если вы пользуетесь платной CMS или конструктором сайта со службой поддержки. В этом случае вы можете написать письмо, и для вас создадут свой персональный шаблон. А если возможности пользоваться платными сервисами нет? Тогда придется изучать HTML и делать все самому. На бесплатных системах помогать вам никто не будет.

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

Но существуют и исключения. Бывают люди, которым оформление не столь важно, да и возможности особые не нужны. Им просто нужен сайт, который хранит немного информации. Обычно это мини-сайты, которые состоят из нескольких страниц. К примеру, мини-сайты часто используют небольшие организации для публикации информации о себе. Это могут быть сайты различных увеселительных заведений, кружков, секций, пожарной части, маленького магазина и другое. Главная их цель — сообщить людям через Интернет, что есть такое место. Для такого случая конструктора сайта или CMS вполне достаточно.

Ну, вот и все, что я хотел рассказать вам в этой статье. Надеюсь, что хоть немного, но помог вам определиться.
Успехов вам!