Отправляет email-рассылки с помощью сервиса Sendsay

Как стать программистом и избежать детских ошибок

Рассылка закрыта

При закрытии подписчики были переданы в рассылку "Работа в сети Интернет" на которую и рекомендуем вам подписаться.

Вы можете найти рассылки сходной тематики в Каталоге рассылок.

  Октябрь 2009   →
 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
Автор
Павел Корягин

Статистика

730 подписчиков
-1 за неделю
←   Все выпуски   →

Как стать программистом и избежать детских ошибок Семантика - вторая грамотность, часть 1


Приветствую вновь подписавшихся. Рекомендую прочитать в первом выпуске о формате рассылки. Меня зовут Павел Корягин, писать мне можно на pavel@koryagin.com

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

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

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

Почему это важно

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

Почему они говорят о смысле, а начинающий программист может себе позволить о нём не задумываться?

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

  • Если же Вы работаете в команде.
  • Или Ваш код будет дорабатываться кем-то.
  • Или клиент рассчитывает пользоваться Вашим продуктом ещё долго, а значит предложит его доработать, когда Вы уже забудете все внутренности этого проекта.
  • Или Вы делаете компонент на продажу.

Тогда Вы, кроме первых двух субъектов, общаетесь ещё и с третьим: с другим программистом. И этим программистом иногда оказываетесь сами — например, вернувшись к собственному коду через год.

Как Вы общаетесь с другим программистом? Очевидно, в первую очередь, через сам код. Во вторую — через комментарии.

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

Итак, цель корректного кода — компилятор, цель осмысленного кода — чужие глаза.

Что это значит

Термин «семантика» применяется к отдельным элементам языков, к их выразительным средствам (примеры того, что считать элементами будут ниже на HTML и PHP). Он указывает на значение этих элементов, их смысл.

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

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

HTML

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

1. Бурбулятор является <b>тециофичным</b> звеном цепи управления фигастера.

2. Бурбулятор является <strong>тециофичным</strong> звеном цепи управления фигастера.

3. Бурбулятор является <span style=""font-weight:bold"">тециофичным</span> звеном цепи управления фигастера.

4. Head: <style> span { font-weight: bold } </style>
   Body: Бурбулятор является <span>тециофичным</span> звеном цепи управления фигастера.

5. Head: <style> .accent { font-weight: bold } </style>
   Body: Бурбулятор является <span class="accent">тециофичным</span> звеном цепи управления фигастера.

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

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

Итак, во-первых, это оказалось нужно для программ, которые работают непосредственно с контентом. Что в наших примерах программа сможет распознать?

  • Тег strong (можно перевести название, как «усиленный») — как раз создан для того, чтобы выделять текст интонацией при чтении, вне зависимости от того, читаете Вы вслух или про себя. Идеально подходит в данном случае для выделения такого важного термина, как «тециофичность».
  • Тег b (сокращение от bold, жирный) — по смыслу это явное указание на оформление текста, шрифт. То есть к выделению смысла прямого отношения не имеет. Возможно, в силу исторических причин, должен распознаваться программами, как синоним тега strong, но на самом деле распознаётся с пониженным весом, например, некоторыми поисковыми системами. Оп! Обращаем внимание, первое отличие: более осмысленный тег «усиленный» работает лучше визуального «жирный».
  • В остальных случаях программам нет никаких оснований полагать, что эти теги относятся к смыслу написанного, поскольку тег span — нейтральный в этом плане, а CSS предназначен для оформления.

Во-вторых, давайте посмотрим на эти примеры, не как на сообщение компьютеру, а как на сообщение другим программистам, которые будут дорабатывать этот код.

Важно: Предположим, что записано не первое, пришедшее на ум, а то, что соответствует однажды выбранным принципам программиста.

  • Если человек использовал вариант 1, это значит, что ему нужен был просто жирный шрифт без заморочек. Он не думал о его смысле и тем более не пытался указать его нам.
  • Если человек использовал тег strong — тут тоже понятно. Название тега говорит обо всём.
  • Если человек использовал вариант 3, то логика та же, что и в случае 1, только он почему-то считает, что оформлять можно только через CSS. (Либо пытался перекрыть какие-то противоречия в других CSS-правилах, забив на семантику)
  • Вариант 4 говорит о том, что человек попытался уйти от стандартного тега. Зачем ему это было нужно? Значит ему нужно было универсальное выделение, смысл которого он сам не понял, но предположил, что оно изменится при доработке дизайна. Такие трюки хорошо отрабатывают, например, в меню сайта и других массивах мелких элементов, но в текстах — вызывают вопросы.
  • И, наконец, вариант 5 по смыслу соответствует варианту strong. Тег span не несёт собственного смысла, поэтому роль играет его класс. Класс же является понятным английским словом.

Резюме: варианты «strong» и «class="accent"» являются самыми осмысленными. При их использовании можно понять, что хотел сказать верстальщик, не спрашивая его об этом.

Чем же они отличаются? Дело в том, что стандарт HTML поддерживает лишь ограниченный набор тегов. И если Вам нужно такое понятие, которого нет в стандартном наборе, то Вы можете использовать, либо XML вместо HTML, либо свой класс CSS. Ну и, разумеется, стандартный тег strong распознаётся всевозможными полезными программами.

Кстати, Вы знаете все теги HTML? Какова была задумка таких тегов, как code, var, address, abbr? По крайней мере теперь Вы знаете, зачем весь этот зоопарк.

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

Этот выпуск Вы можете прокомментировать в Живом Журнале.
В избранное