Kodomo

Пользователь

Учебная страница курса биоинформатики,
год поступления 2017

Практикум 4. Подсказки

Полезные учебные ресурсы

  1. Учебник HTML для начинающих на русском языке.

  2. Tutorial по HTML на английском языке (есть интересная функция "Try it", для интерактивного обучения).

  3. Список тэгов HTML в алфавитном порядке с описанием и примерами для каждого.

Вам понадобятся тэги <HTML>, <HEAD>, <TITLE>, <BODY> с атрибутами bgcolor и text, <H1>, <H2>, <H3>, <P>, <A> с атрибутом href, <IMG /> с атрибутами src и width, <HR />, возможно также <BR />, <B>, <I> и <U>. Изучите (и попробуйте!) их все.

На следующем занятии пройдём <OL>, <UL>, <LI>, <TABLE>, <TR>, <TD>.

Резервные копии

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

Орфография

Советую ознакомиться с сервисом для проверки орфографии. Он позволяет проверить орфографию на произвольной странице в интернете. Пунктуацию он НЕ проверяет, поэтому проверяйте ее другим способом.

Если скопировать теrст со страницы в MS Word, то можно проверить орфографию, пунктуацию и расстановку пробелов!

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

Добавление от С.А.С. Программы могут выявить не все орфографические ошибки! Повторите, пожалуйста, в каких случаях надо писать "также", а в каких "так же", в каких "несмотря", а в каких "не смотря" и т.п.

Кодировка кириллицы

Чтобы страница отображалась во всех браузерах правильно, нужно, чтобы в теле тэга HEAD присутсвовал тэг: 

<META http-equiv="Content-Type" content="text/html; charset=windows-1251"/>

(если кодировка файла – cp1251; другие популярные кодировки обозначаются koi8-r, utf-8).

Цвета

На этом ресурсе можно легко подобрать нужный цвет и сразу увидеть его RGB-код в шестнадцатиричном формате (hex-код): Color Wheel. Ещё один инструмент: Flexi color picker.

В языке HTML много где (в цвете фона странички или ячейки таблицы, тэга шрифта, тэга горизонтальной черты <hr> и т.п.) можно менять цвет, и задавать его нужно именно hex-кодом. Первый символ в нем — #, а дальше три пары символов задают интенсивности цветов в порядке RGB, то есть red (красный) – green (зеленый) – blue (синий).

Например, вот такой тэг: 

<HR color="#FF0000"/>

сделает горизонтальную черту чистого красного цвета (интенсивность красного 255, зеленого и синего – по 0)

На этом сайте можно посмотреть разные интересные цвета и их возможные удачные сочетания: http://www.color-hex.com/

А здесь можно подобрать основные и дополнительные цвета в интересующей Вас цветовой гамме, и посмотреть, как может выглядеть страница в таких цветах (вкладка Examples внизу страницы) palleton.com.

Интересные символы

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

Например: если нужно вставить букву α, то введите в поиск слово "альфа" и получите массу разных вариантов написания буквы. HTML-код символа указан в розовой рамке; например, для стандартной буквы α он такой:

&#945;

Можно использовать и такое написание:

&alpha;

Любой код символа начинается с амперсанда & и заканчивается точкой с запятой. Если используется цифровой вариант кода, то сразу после & должна стоять решётка #. Стоит запомнить коды для знака копирайта © &copy;, минуса/короткого тире – &ndash; и длинного тире — &mdash;.

Замечание о гиперссылке

Обратите внимание: неправильно вставлять гиперссылку так: 

<A href="www.google.com">Неправильно, работать не будет</A>

А вот так правильно: 

<A href="https://www.google.com">Правильно!</A>