Автор: Пользователь скрыл имя, 20 Февраля 2012 в 11:22, лабораторная работа
Основные правила Web-дизайна. Логическая и физическая структура сайта. Статическая и динамическая компоновка страниц. Элементы Web-страницы. Определение тега и атрибута. Escape-последовательности. Теги структуры страницы. Организация ссылок: на файлы (документы, архивы, графические объекты); на разделы; на адрес электронной почты. Теги создания таблиц и фреймов.
Изучаются также и запросы по смежным тематикам, пересечение целевых аудиторий по другим запросам, и даже статистика ошибок и опечаток в запросах пользователей по данной теме.
Индекс цитирования сайта.
И вот в результате всей этой кропотливой деятельности на свет рождается проект, разработанный с учетом всех возможных "положительных предпосылок" для раскрутки сайта в поисковых системах. Но это только предпосылки. Для того чтобы они заработали, необходимо наличие хороших показателей по так называемому "индексу цитируемости сайта".
Этот показатель отображает степень известности вашего сайта в Интернете. Чем больше ресурсов упоминают ваш сайт как "авторитетный" в своей области, тем выше индекс цитирования вашего сайта.
6. Определение тега и атрибута. Синтаксис тега. Escape-последовательности
Для того чтобы в будущем не возникло каких-либо затруднений, необходимо, прежде всего, разобраться в понятиях тегов и их атрибутов. Итак, тег — это некая команда HTML, указывающая интерпретатору браузера, каким образом он должен обрабатывать соответствующее каждой конкретной директиве значение. Это значение и называется атрибутом тега.
Тег может, иметь атрибут или не иметь его. Например, тег верхнего уровня<HTML> не имеет атрибутов, а в строке создания новой таблицы <TABLE BORDER="1"WIDTH="100"> выражение «BORDER="1" WIDTH="100"» является атрибутом тега <TABLE>.
В общем виде синтаксис записи тега HTML в совокупности с его атрибутами выглядит следующим образом:
<ТЕГ ИМЯ_АТРИБУТА-1="ЗНАЧЕНИЕ" ИМЯ_АТРИБУТА-2="ЗНАЧЕНИЕ" ...ИМЯ_АТРИБУТА-n="ЗНАЧЕНИЕ">
В данном примере первый атрибут тега <TABLE> — это параметр "BORDER", второй атрибут — параметр "WIDTH", а их значения составляют соответственно "1" и"100". Значения атрибутов заключаются в прямые кавычки, записываемые символом «"». Если внутри атрибута какого-либо тега встречается другое значение, заключенное в кавычки, то есть имеет место вложение одних кавычек в другие, в качестве «внутренних» кавычек рекомендуется использовать одинарные, записываемые символом «'». В общем случае такое выражение выглядит следующим образом:
<ТЕГ ИМЯ_АТРИБУТА-1="ЗНАЧЕНИЕ-1; 'ЗНАЧЕНИЕ-2'; ЗНАЧЕНИЕ-3">
Спецификация языка HTML позволяет опускать кавычки для следующих видов атрибутов:
Атрибуты, записываемые только строчными или заглавными символами латинского алфавита и не включающие иных символов, например, цифр.
Атрибуты, состоящие только из цифр от 0 до 9.
Атрибуты, обозначающие промежутки времени.
Например, запись атрибутов BORDER="1" или ALIGN="CENTER" допустимо представить как BORDER=1 и ALIGN=CENTER.
Панель атрибутов
Image title — наименование изображения;
How to remove — описание правил удаления из изображения лишних компонентов;
Global attribute change — смена общих атрибутов изображения;
Width — ширина изображения;
Height — высота изображения;
Interlace — чересстрочная развертка;
Transparent index — степень прозрачности изображения;
Local palette — применить местную (собственную) палитру;
Wait for user input — ожидать действий пользователя (с).
Escape-последовательности
Иногда у web-мастера возникает необходимость использовать в тексте своей web-странички символы, зарезервированные для обозначения элементов кодаHTML. Это могут быть угловые скобки (символы «<» и «>»), в которые обычно заключаются теги, прямые кавычки («"»), употребляемые при задании значений атрибутов, и т. д. Иными словами, web-мастеру необходимо, чтобы данные символы отображались в окне броузера «как есть», то есть как текст, интерпретатор же воспринимает их как часть команд разметки гипертекста. Для того чтобы избежать проблем при отображении подобных элементов, и были придуманы так называемые escape-последовательности, или, как их еще иногда называют, «нотации символьных объектов».
Запись escape-последовательности подразумевает замену служебных символов специальными командами, которые в процессе интерпретации документа замещаются выводимыми на экран искомыми знаками. Все escape-последовательности начинаются с символа амперсанд («&») и заканчиваются точкой с запятой, а между ними размещается сама команда, записываемая в строчном регистре. В табл. 4.1 приведен список наиболее часто используемых escape-последовательностей.
Символ | Значение | Команда |
< > " & © ® | Символ «меньше, чем»; левая угловая скобка Символ «больше, чем»; правая угловая скобка Прямые кавычки Амперсанд Неразрывный пробел (словосочетания, разделенные таким пробелом, не разрываются при переносе) Символ копирайта Символ зарегистрированной торговой марки | < > " &атр; &сору; ® |
Escape-последовательности записываются в тексте по тем же правилам, по которым употребляются обозначаемые ими символы, иными словами, нотация символьного объекта просто вставляется в тот участок текста, где по расчетам web-мастера должен следовать соответствующий служебный символ. Например, строка html-кода
На этой страничке изложены мои ":мысли вслух" по данному вопросу отобразится в окне броузера следующим образом:
На этой страничке изложены мои "мысли вслух" по данному вопросу
7. Теги структуры страницы
Теги для установки атрибутов документа
<body bgcolor="..."> | Используется для установки цвета фона документа, принимаемые значения в формате RRGGBB. |
<body background="file"> | Используется для установки фона документа, при этом используя тот графический фаил, который будет введен вместо параметра file. |
<body bgpropertes="fixed"> | Фиксирует движение фона документа. В случае, когда для фона используется рисунок смотрится очень эффектно. |
<body text="..."> | Используется для установки цвета текста в документе, принимает значения в формате RRGGBB. |
<body link="..."> | Используется для установки цвета гиперссылки в документе, принимает значения в формате RRGGBB. |
<body alink="..."> | Используется для установки цвета гиперссылки при нажатии на не╠, принимаемые значения в формате RRGGBB. |
<body vlink="..."> | Используется для установки цвета гиперссылки на которую вы уже ходили, принимаемые значения в формате RRGGBB. |
8. Запись комментариев
Код HTML может содержать комментарии, предназначенные как для самого web-мастера, создающего документ, так и для постороннего пользователя, читающего листинг чужой странички. И в том и в другом случае комментарии записывают с целью избежать возможной путаницы при изучении кода html-документа. Комментарии не обрабатываются интерпретаторами броузеров, но и не отображаются на экране, они остаются в составе кода web-страницы «как есть». Комментарий открывается символьной последовательностью, начинающейся с открывающей угловой скобки, восклицательного знака и двух знаков тире: <!--, закрывается же несколько иным сочетанием символов: -->. Другими словами, в общем случае синтаксис записи комментария будет выглядеть следующим образом:
<!-текст комментария -->
Иногда в комментарий включается информация о создателе документа, предупреждение об авторских правах или адрес электронной почты администратора сайта. Однако чаще всего данный элемент кода HTML используется по своему прямому назначению, для пояснения назначения тех или иных участков листинга html-документа.
9. Теги разметки абзацев
Теги для форматирования текста в документе
<pre> ... </pre> | Выводит текст на экран при этом его не форматируя. |
<b> ... </b> | Выводит жирный текст. |
<i> ... </i> | Выводит наклонный текст. |
<h1> ... </h1> | Выводит самый большой заголовок. |
<h6> ... </h6> | Выводит самый маленький заголовок. |
<em> ... </em> | Предназначен для выделения из текста фраз. |
<font color="..."> ... </font> | Используется для установки цвета текста, принимаемые значения в формате RRGGBB. |
<font size="..."> ... </font> | Используется для установки размера текста от 1 до 7. |
Форматиравание
<p> | Создает новый параграф. |
<br> | Пререход на новую строку. |
<blockquote> ... </blockquote> | Создает отступ с обеих сторон текста. |
<dl> ... </dl> | Создает список определений. |
<ol> ... </ol> | Создает нумерацию строк. |
<li> | Присваивает каждому элементу списка |