Вам бонус- начислено 1 монета за дневную активность. Сейчас у вас 1 монета

1.7. Профессии для создания и обслуживания веб сайтов

Лекция



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

Что нужно знать и уметь современному программист у? чем профессиональный программист отличает от дилетанта? Узнать ответы на эти и многие другие вопросы можно прочитав эту статью. И так, начнем!

1.7. Профессии для создания и обслуживания веб сайтов

Информационная архитектура

Информационная архитектура (англ. Information architecture, часто сокращается до «ИА») — сочетание схем организации, предметизации и навигации, реализованных в информационной системе.

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

Louis Rosenfeld

Примеры

  • структурирование информации, которая будет представлена на сайте;
  • проектирование информационного пространства, способствующее выполнению задач и интуитивному доступу к содержимому.\

Веб-разработка — процесс создания веб-сайта или веб-приложения. Основными этапами процесса являются веб-дизайн, верстка страниц, программирование на стороне клиента и сервера, а также поддержка веб-сервера.

Веб-дизайн

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

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

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

Веб-дизайнер — сравнительно молодая профессия, и профессиональное образование в области веб-дизайна в России пока не распространено. В связи с увеличением спроса на представительство в Сети растет и спрос на дизайн сайтов, увеличивается количество веб-дизайнеров.

Веб-дизайн является одной из основных номинаций в конкурсной программе молодежных Дельфийских игр России.

Объяснение термина

В настоящее время под термином веб-дизайн понимают именно проектирование структуры веб-ресурса, обеспечение удобства пользования ресурсом для пользователей. Немаловажной частью проектирования ресурса в последнее время стало приведение ресурса в соответствие стандартам W3C, что обеспечивает доступность содержания для людей с ограниченными физическими возможностями и пользователей портативных устройств (см. юзабилити — «удобство использования»), а также кроссплатформенность (в данном случае — т. н. кросс-браузерность) верстки ресурса. Также непосредственно с дизайном сайтов смежнымаркетинг в Интернете (интернет-маркетинг), то есть, продвижение и реклама созданного ресурса, поисковая оптимизация.

Этапы разработки веб-сайта

  • Создание технического задания или спецификации

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

  • Дизайн основной и типовых страниц сайта

Начинается работа с создания дизайна, обычно в графическом редакторе. Дизайнер создает один или несколько вариантов дизайна, в соответствии с техническим заданием. При этом отдельно создается дизайн главной страницы, и дизайны типовых страниц (например: статьи, новости, каталог продукции). Собственно «дизайн страницы» представляет собой графический файл, слоеный рисунок, состоящий из наиболее мелких картинок-слоев элементов общего рисунка.

При этом дизайнер должен учитывать ограничения стандартов html (не создавать дизайн, который затем не сможет быть реализован стандартными средствами html). Исключение составляет Flash-дизайн.

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

  • HTML-верстка

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

  • Программирование

Далее готовые HTML-файлы передают программисту. Программирование сайта может осуществляться как «с нуля», так и на основе CMS — системы управления сайтом. Веб-разработчики часто называют CMS «движком».

В случае с CMS надо сказать, что сама «CMS» в некотором смысле это готовый сайт, состоящий из заменяемых частей. «Программист» — в данном случае правильно будет назвать его просто специалистом по CMS — должен заменить стандартный шаблон, поставлявшийся с CMS, на оригинальный шаблон. Этот оригинальный шаблон он и должен создать на основе исходного «веб-дизайна».

При программировании сайта специалисту назначаются контрольные точки сроков.

  • Завершающим этапом разработки сайта под ключ является, конечно же, тестирование.

Веб-дизайн сайта должен адекватно выглядеть в различных браузерах, особенно в браузерах Internet Explorer, Firefox, Safari, Chrome и Opera.

Internet Explorer (версии 6) по-своему трактовал HTML-стандарты (отголоски старой борьбы за лидерство с Netscape). Этот морально устаревший браузер создавал много проблем для веб-дизайнеров. Многие разработчики даже предлагали отказаться от верстки под IE 6, однако наличие этого браузера в стандартной поставке Windows XP, а значит и его присутствие на многих пользовательских компьютерах, вынуждало веб-дизайнеров тестировать свои проекты в нем. По состоянию на лето 2012 года IE 6 используется на 6 % пользователей, в основном за счет Китая, где его используют 21 % пользователей .

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

Сроки контролирует менеджер проекта. Также на этом этапе привлекают к работе дизайнера, чтобы он провел авторский надзор.

  • Размещение сайта в Интернет

Файлы сайта размещают на сервере провайдера и производят нужные настройки. На этом этапе сайт пока закрыт для посетителей.

  • Наполнение контентом и публикация

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

  • Внутренняя SEO-оптимизация.

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

  • Внешняя SEO-оптимизация.

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

  • Сдача проекта

Заказчик или его доверенное лицо просматривают готовый проект и в случае, если все устраивает, то подписывают документы о сдаче проекта.

Так же на этом этапе производится обучение представителя заказчика навыкам работы в администраторской зоне сайта.

Процесс и результат

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

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

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

Изображение первоначально может быть векторным или растровым, выполненным в Adobe Illustrator, Adobe Photoshop, GIMP или другом визуальном редакторе(например, Scribus или Inkscape), но для верстальщика изображение, как правило, переводится в растровый формат.

Для демонстрации клиенту изображение обычно переводится в простой однослойный и привычный формат изображений.

Юзабилити

1.7. Профессии для создания и обслуживания веб сайтов

Удобство использования, Юзабилити (англ. usability — дословно «возможность использования», «способность быть использованным», «полезность») — понятие в микроэргономике, эргономическая характеристика степени удобности предмета для применения пользователями при достижении определенных целей в некотором контексте . Термин имеет связь с понятием «эргономичность», но в отличие от последнего меньше ассоциируется с технической эстетикой, с внешним видом и более привязан к утилитарности используемого объекта .

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

Официальное определение

Международный стандарт ISO 9241-11 определяет юзабилити как

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

При этом относительная важность всех трех аспектов определяется этим самым контекстом.

Особенности при употреблении в русском языке

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

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

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

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

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

Верстка веб-страниц

Верстка веб-страниц — процесс формирования (верстка) веб-страниц в текстовом либо WYSIWYG-редакторе, следующий этап после веб-дизайна; а также результат этого процесса, то есть собственно веб-страницы.

1.7. Профессии для создания и обслуживания веб сайтов

Методы верстки

Табличная верстка

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

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

Блочная верстка

Верстка при помощи блоков (тег div ) и описывающих их таблиц стилей (CSS). Реализует концепцию семантичной верстки.

Фреймовая верстка

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


По принципам использования средств разметки HTML различают логическую разметку и презентационную (физическую).

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

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

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

Преимуществом второго подхода является независимость верстки от используемого типа устройств и дизайна веб-страниц.

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


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

  • жестко фиксированные (Rigid fixed),
  • адаптивные резиновые (Adaptable fluid)
  • расширяемые эластичные (Expandable elastic) макеты.

Фиксированный тип макета — дизайн (табличный либо блочный), в котором ширина столбца/рисунка заданы в пикселях, то есть оговорены точно.

Резиновый тип макета — дизайн, в котором ширина столбца/рисунка задана в процентах от текущего разрешения экрана.

Адаптивная верстка/тип макета — дизайн, который подстраивается (адаптируется) под размер экрана, в том числе может происходить перестройка блоков с одного места на другое, или их замена блоками отображаемыми только при определенном разрешении. Адаптивная верстка пришла на смену идеи создания специальных мобильных версий сайта, "живущих" на отдельных поддоменах (например, m.wikipedia.org).

Фиксированный дизайн

Преимущества:

  • Такой дизайн гораздо легче разрабатывать, можно заранее предугадать, как будет выглядеть сайт.
  • У дизайнера есть возможность следить за размером строки.

Недостатки:

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

Резиновый дизайн

Преимущества:

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

Недостатки:

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

Адаптивная верстка

Преимущества:

  • Сайт будет отображаться при разных размерах экрана так, как это наиболее удобно пользователю;

Недостатки:

  • Требует тщательной проработки нескольких макетов, для различных размеров экранов.

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

Табличная верстка

Преимущества и недостатки

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

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

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

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

«Распорки»

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

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

Слои представляют собой структурные элементы, которые можно размещать на веб-странице путем наложения их друг на друга с точностью до пикселя. В HTML 4 иXHTML слой — это элемент веб-страницы, созданный с помощью тега div , к которому применяется стилевое оформление.

Блочная верстка

При этом придерживаются следующих принципов.

  • Разделение содержимого и оформления;
  • Активное применение тега div;
  • Таблицы применяются только для представления табличных данных.

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

Скрипты позволяют изменять параметры слоя динамически. Это дает возможность создавать на странице разные эффекты, такие как выпадающие меню, игры, разворачивающиеся баннеры, плавающие окна и прочее.

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

Более современные версии браузеров стали строже придерживаться стандартов и содержать средства по работе со слоями.

Преимущества и недостатки

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

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

Слои по сравнению с таблицами отображаются быстрее. Более высокая скорость достигается за счет компактного кода и того, что отображение содержимого слоя происходит по мере его загрузки. Правда это может привести к «скачкам» элементов страницы по мере их подгрузки.

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

Основные профессии для создания сайта

  • Информационный архитектор
  • Веб-дизайнер
  • Юзабилити-инженер
  • Верстальщик веб-страниц
  • Программист
  • тестировщик
  • Поисковый оптимизатор
  • Копирайтер (писатель), контент-менеджер

Нередко веб-специалисты совмещают в себе сразу несколько специальностей.

Также веб разрабочиков услов разделяют на бекэнд фронтэнд и фулстек.


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


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


Во frontend и backend есть собственные технологии и собственные языки программирования, и для работы с ними необходимо владеть этими языками. И если программист прекрасно разбирается в обоих направлениях, если он легко выполняет задачи, связанные и с frontend, и с backend – тогда этого программиста и называют фулстек-разработчиком.

Так что fullstack программист – специалист-универсал, способный и сверстать дизайн сайта, и настраивать функционирование форм и кнопок, и писать серверную часть, плюс и собственно сервер настроить сможет. Такой программист в одиночку создает веб-сервис, заменяя собой 3-4 более узких специалистов.


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

Верстальщик

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

Версткой веб-страниц занимаются верстальщики. В общем случае в задачу верстальщика входят:

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

Инструменты верстальщика

Верстальщик использует следующее ПО:

  • текстовый редактор или редактор HTML для написания и редактирования кода
  • графическая программа для так называемой «нарезки» графического макета, полученного верстальщиком от веб-дизайнера

А также иногда прибегает к помощи:

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

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

Должностные обязанности html-верстальщика включают в себя:

  • Верстка шаблонов под стационарные мониторы и мобильные устройства (на основе готовых psd-макетов).
  • Верстка е-мейл рассылок и промо-страниц.
  • Интеграция шаблонов в CMS.
  • Программирование на JavaScript и AJAX.

Валидность HTML-верстки

Валидность HTML-верстки — это ее соответствие стандартам организации The World Wide Web Consortium (W3C). Отсутствие ошибок в верстке документа — один из основных показателей качества верстки. Автоматическая проверка верстки на ошибки может быть проведена как с помощью онлайн сервиса W3C, так и различными программами «валидаторами». Разные версии спецификации HTML предполагают различный синтаксис, поэтому тест верстки на валидность должен обязательно учитывать ее Document Type.

Программист

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

Место программирования в обществе

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

продолжение следует...

Продолжение:


Часть 1 1.7. Профессии для создания и обслуживания веб сайтов
Часть 2 Образование - 1.7. Профессии для создания и обслуживания веб сайтов
Часть 3 Составляющие профессионализма - 1.7. Профессии для создания и обслуживания веб
Часть 4 Вау!! 😲 Ты еще не читал? Это зря! - 1.7. Профессии для создания и обслуживания веб

См.также

Информационные
технологии

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

Ответы на вопросы для самопроверки пишите в комментариях, мы проверим, или же задавайте свой вопрос по данной теме.

создано: 2014-08-16
обновлено: 2023-08-02
132663



Рейтиг 9 of 10. count vote: 2
Вы довольны ?:


Найди готовое или заработай

С нашими удобными сервисами без комиссии*

Как это работает? | Узнать цену?

Найти исполнителя
$0 / весь год.
  • У вас есть задание, но нет времени его делать
  • Вы хотите найти профессионала для выплнения задания
  • Возможно примерение функции гаранта на сделку
  • Приорететная поддержка
  • идеально подходит для студентов, у которых нет времени для решения заданий
Готовое решение
$0 / весь год.
  • Вы можите продать(исполнителем) или купить(заказчиком) готовое решение
  • Вам предоставят готовое решение
  • Будет предоставлено в минимальные сроки т.к. задание уже готовое
  • Вы получите базовую гарантию 8 дней
  • Вы можете заработать на материалах
  • подходит как для студентов так и для преподавателей
Я исполнитель
$0 / весь год.
  • Вы профессионал своего дела
  • У вас есть опыт и желание зарабатывать
  • Вы хотите помочь в решении задач или написании работ
  • Возможно примерение функции гаранта на сделку
  • подходит для опытных студентов так и для преподавателей



Комментарии


Оставить комментарий
Если у вас есть какое-либо предложение, идея, благодарность или комментарий, не стесняйтесь писать. Мы очень ценим отзывы и рады услышать ваше мнение.
To reply

Основы интернет и веб технологий

Термины: Основы интернет и веб технологий