Помощь - Поиск - Пользователи - Календарь
Полная версия: Популярно о Web
Форум на все случаи жизни > Программирование, скрипты, графика, WEB-строительство > WEB дизайн и прикладное программирование
The Undertaker
Словарь по HTML для тех, кто собирается сделать свою первую страничку


HTML-документ (страничка) - документ, написанный на языке разметки гипертекста (HTML). Заключается между флагами <HTML> и </HTML>.

Web-сайт, Web-сервер - цепочка логически связанных документов, написанных на языке HTML.

Значения флагов разметки документа

Флаги разметки - специальные команды для расположения на экране текста, графики, видео и аудио фрагментов, а также команды, служащие для связи с другими HTML- документами и рессурсами Интернет.

Основные флаги разметки

<HEAD> и </HEAD>. Между этими флагами располагается информация о документе.
<TITLE> и </TITLE>. В эих флагах заключается название странички, которое будет выведено в рамке окна программы просмотра.
<BODY> и </BODY>. "Тело" документа (текст, графика и т.д.) располагается между этими двумя флагами.

Параметры флага <BODY>:
BGCOLOR - цвет фона (<BODY BGCOLOR ="#FFFFFF">)
BACKGROUND - "обои" или бэкграунд
TEXT - цвет текста
LINK - цвет гипертекстовой связи (ссылки)
VLINK - цвет ссылки, уже посещенной в прошлом
ALINK - цвет активной сылки Флаги, служащие для форматирования текста

<P> и </P> Флаги, служащие для выделения абзадцев. Новый абзац чсегда отделяется от предыдущего пустой строкой.
<BR> Флаг, служащий для переноса текста на другую строку. Может также служить для отделения графики от текста на интервал.
<HR> Флаг, служащий для логического разделения текста горизонтальной линией.
<PRE> и </PRE> Между этими флагами располагается предварительно отформатированный текст. На экран он выводится шрифтом типа "курьер".

Параметры выравнивания

Используются в <P> и <H*>
ALIGN=LEFT - выравнивание по левому полю
ALIGN=RIGHT - выравнивание по правому полю
ALIGN=CENTER - выравнивание по центру

Флаги выравнивания

<CENTER> и </CENTER> - выравнивание по центру

Заголовки, служащие для выделения логических частей текста

<H1> и </H1> Заголовок первого уровня.
<H2> и </H2> Заголовок второго уровня.
<H3> и </H3> Заголовок третьего уровня.
<H4> и </H4> Заголовок четвертого уровня.
<H5> и </H5> Заголовок пятого уровня.
<H6> и </H6> Заголовок шестого уровня.

Флаги для выделения текста и шрифта

<B> и </B> Флаги для выделения текста (слов, букв) жирным шрифтом.
<I> и </I> Флаги для выделения текста (слов, букв) курсивным шрифтом, типа Italic.
<U> и </U> Текст, расположенный между двумя этими флагами, будет подчеркнут.
<BLINK> и </BLINK> Текст, расположенный между двумя этими флагами, будет мигать.
<FONT SIZE=+n> и </FONT>
<FONT SIZE=-n> и </FONT> Флаги для изменения размера шрифта.
<FONT COLOR="#0000FF> и </FONT> Флаги для изменения цвета шрифта.

Флаги для формирования списков

<OL> и </OL> Флаги, показывающие начало и конец нумерованного списка
<UL> и </UL> Флаги, показывающие начало и конец маркированного списка.
<LI> Элемент списка

<DL> и </DL> Флаги, показывающие начало и конец глоссария.
<DT> Термин глоссария, располагается без отступа от левого поля страницы.
<DD> Описание термина, располагается с отступом от левого поля страницы.

Флаги-команды для вставки в текст объектов нетекстовой информации

<IMG SRC ="file.gif"> или <IMG SRC ="file.jpg"> - команда для вставки графического изображения
<IMG SRC ="file.wav"> - команда для вставки звукового фрагмента
<IMG SRC ="file.avi"> - команда для вставки видео фрагмента

Параметры графического изображения

WIDHT - ширина картинки в пикселях
HEIGHT- высота картинки в пикселях
ALIGN - выравнивание (ALIGN=LEFT - выравнивание по левому полю, ALIGN=RIGHT - по правому полю, ALIGN=TOP - по верхней границе, ALIGN=BOTTOM - по нижней границе, ALIGN=MIDDLE или CENTER - по центру)
HSPACE - горизонтальный отступ от графического изображения
VSPACE - вертикальный отступ
ALT - альтернативный текст, служит для обозначения изображения

Команды, служащие для гиперсвязи с другими HTML-документами и рессурсами Интернет

<A HREF="fail.htm"> и </A> или <A HREF="http://www.ru"> и </A> - гиперсвязи
<ADDRESS><A HREF=mailto:person@firm.ru>person@firm.ru</ADDRESS> - гиперсвязь с адресом электронной почты

Таблицы

Таблица - сетка для показа данных в строках и столбцах, а также средство для форматирования текста

<TABLE> и </TABLE> Флаги для вставки таблицы в HTML документ
Параметры флага <TABLE>
BGCOLOR - цвет фона
BORDER - ширина бордюра
WIDHT - ширина таблицы

Флаги разметки таблицы

<CAPTION> и </CAPTION> - название таблицы, имеет параметр ALIGN=TOP - выравнивание над таблицей и ALIGN=BOTTOM - под таблицей.
<TR> и </TR> Строчка таблицы. Может иметь параметры BGCOLOR - цвет фона внутри строки; ALIGN=LEFT, RIGHT, CENTER - выравнивание внутри строки; VALIGN=TOP, BOTTOM, MIDDLE - вертикальное выравнивание внутри строки таблицы.
<TD> и </TD> Столбец таблицы. Может иметь параметры BGCOLOR - цвет фона под столбцом; ALIGN=LEFT, RIGHT, CENTER - выравнивание внутри столбца; VALIGN=TOP, BOTTOM, MIDDLE - вертикальное выравнивание; COLSPAN растягивание клетки на несколько столбцов, ROWSPAN - растягивание клетки на несколько строк.
<TH> и </TH> Заголовок столбца. Может иметь параметры BGCOLOR - цвет фона под названием; ALIGN=LEFT, RIGHT, CENTER - выравнивание; VALIGN=TOP, BOTTOM, MIDDLE - вертикальное выравнивание; COLSPAN, ROWSPAN - растягивание клетки на несколько столбцов или строк; WIDHT - ширина названия.

Рамки-фреймы

Рамки-фреймы - средство для разделения экрана на несколько областей, в каждой из которых отображается содержимое отдельной Web-странички или даже целого Web-сайта.
<FRAMESET> и </FRAMESET> Флаги для создания рамки

Параметры флага <FRAMESET>

COLS - подразделяют экран на опредленное количество колонок (вертикальных)
ROWS - подразделяют экран на опредленное количество колонок (горизонтальных)
BORDCOLOR - цвет рамки
BORDER - ширина бордюра
FRAMEBORDER - граница рамки (FRAMEBORDER=YES - есть граница, FRAMEBORDER=NO - нет границы,
FRAMESPACING=n - ширина границы)

<FRAME> Флаг для описания рамки (<FRAME SRC="file.htm">).

Параметры флага <FRAME>

SCROLING - параметр для регулировки полосы прокрутки:
SCROLING=YES - полоса прокрутки будет всегда
SCROLING=NO - полосы прокрутки не будет
SCROLING=AUTO - полоса прокрутки появляется только в случае необходимости
MARGINWIDHT и MARGINHEIGHT - параметры, которые управляют отступом внутри рамок, служат для выравнивания графического изображения внутри рамки
NORESIZE - параметр, указвающий на то, что размер рамки-фрейма никогда не будет меняться.

A link to <A HREF="file.htm" TARGET="frame2"> file.htm</A> - Связь между фреймами
TARGET - атрибут связи между фреймами. Имеет несколько значений:

_BLANK загружает содержимое страницы, заданной ссылкой, в новое пустое окно.
_SELF содержимое страницы, заданной ссылкой, в окно, которое содержит ссылку.
_PARENT загружает содержимое страницы, заданной ссылкой, в окно, являющееся непосредственным владельцем набора фреймов.
_TOP содержимое страницы, заданной ссылкой, в окно, игнорируя используемые фреймы.

Обработка браузеров, не поддерживающих фреймы:
<FRAMESET>
...Здесь располагаются фреймы
</FRAMESET>
<NOFRAMES>
<BODY>
...Здесь располагается текст без фреймов
<BODY>
</NOFRAMES>

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

Бегущая строка

<MARQUEE>ТЕКСТ</MARQUEE> - Флаг, создающий бегущую строку
<MARQUEE DIRECTION=left>TEKCT</MARQUEE> - Если бегущую строку нужно направить справа налево
<MARQUEE DIRECTION=right>TEKCT</MARQUEE> - движение слева направо.
scroll - стандартное движение от правого края к левому
slide - надпись один раз пробегает от правого края к левому, где и остается.
alternate - движение от правого края страницы к левому и обратно. Бесконечный цикл.
<MARQUEE LOOP=n BEHAVIOR=scroll>TEKCT</MARQUEE> - Ограничение числа циклов. Значение n оператора LOOP указывает число повторений цикла.
<MARQUEE WIDHT=n>TEKCT</MARQUEE> - указать ширину участка, занимаемого бегущей строкой, где n - ширина той части страницы, на которой расположена бегущая строка. Значение n указывается как в пикселях, так и в процентах от общей ширины видимой части страницы.
<MARQUEE scrollamount=n>TEKCT</MARQUEE> - Регулировка движения надписи по экрану. Здесь n - число пикселей.
<MARQUEE scrolldelay=t>TEKCT</MARQUEE> В данном случае переменная величина - время t - измеряется в миллисекундах. Метод задания скорости состоит в указании времени, спустя которое текст будет перерисован на экране заново.
<FONTSIZE=n><MARQUEE> ТЕКСТ</MARQUEE></FONT> - возможность указывать величину шрифта текста в строке.
<MARQUEE BGCOLOR=n> ТЕКСТ </MARQUEE> - окрасить поверхность бегущей строки в какой-либо цвет, где n, как это бывало и раньше, можно указать в вид шестнадцатеричного числа либо написав его название
<MARQUEE HEIGHT=n>ТЕКСТ</MARQUEE> - указать высоту бегущей строки, задавая величину n в пикселях
Ann
У многих из нас рано или поздно возникает желание (или даже необходимость) создать свой вебсайт. Тут мы сталкиваемся с множеством новых знакомых и не очень знакомых терминов. Вот некоторые из них.

Web - часть интернет – набор определенных документов (веб-страниц), хранящийся на компьютерах (веб-серверах) по всему миру.
Web-страница - это отдельный документ Web, который содержит информацию различного вида - текст, рисунки, фотографии, фрагменты аудио- и видеозаписей. Ресурс объединяющий несколько страниц является веб-сайтом. Для того, чтобы сохраненный на диске Web-сервера, сайт стал доступным широкой аудитории, используются следующие механизмы:
Url - единая схема наименования для поиска ресурсов в web
Http - протоколы для доступа к ресурсам
Hhtml - универсальный язык (язык разметки гипертекста), который понимют все компьютеры

Url
Url – стандартный способ ссылки на документы в сети.

Некоторые url указывают на местоположение внутри ресурса. Этот тип url заканчивается символом "#", за которым следует имя фрагмента.

Url может быть относительным и указывать на ресурс на машине, на которой находится текущий документ.


Базовая структура url:
Протокол://адрес компьютера/имя каталога/имя файла

Протокол:
Протоколом называются правила, которым следуют компьютеры при обмене данными.
Http - протокол передачи гипертекста. После щелчка по гиперссылке в web-документе браузер, используя протокол http, связывается с web-сервером и получает у него указанный документ.
Ftp -позволяет с помощью ссылки загружать файлы с удаленной системы.
Mailto - вызывает протокол smtp, что позволяет с помощью гиперссылки отправлять сообщения по электронной почте.
И другие.

Адрес компьютера:
Каждый сервер, доступный в сети Интернет, имеет свой уникальный IP-адрес, по которому к нему можно подключиться. IP-адрес представляет собой последовательность из четырех чисел в диапазоне от 0 до 255, разделенных точками (например, 213.6.17.34).
Для облегчения запоминания адресов и задания ссылок на них используются символьные имена компьютеров (домены).
Для того, что бы подключиться к серверу, необходимо преобразовать доменное имя сервера в его IP-адрес. Данную операцию вьпюлняет служба, которая называется системой доменных имен -DNS.

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

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

Объекты
Объекты - это графические и мультимедийные вставки в html-документ, такие как картинки, Java-апплеты, звуки, музыка

Картинки
Картинки, как правило, представлены в виде файлов двух форматом gif или jpeg.
Gif - 256 цветов, обладает средствами эффектов анимации и прозрачности. Обычно используется для кнопок, баннеров, элементов дизайна, логотипов, четких изображений с малым количеством оттенков, чертежей
Jpeg - обычно используется для фотографий и иных "пестрых" картинок с большим количеством плавных переходов цветов
Выбор формата всегда направлен на то, чтобы добиться минимального объема получившегося файла.
Кроме того, существует технология по созданию для web веторной графики и анимации - flash (Macromedia Flash)
Еще про картинки

Скрипты и апплеты
Скрипты - это включения в html не-html кода, дополняющего его возможности. С помощью сприптов можно создавать анимированные кнопки меню, осуществлять автоматическое перенаправление на другие документы и т.д. Большинство скриптов пишется на языке JavaScript.
Не следует путать JavaScript и Java.
Программы JavaScript работают внутри браузера.
С помощью Java, например, создаются программы, хранящиеся на сервере как отдельные файлы – апплеты. Они работают под управлением других программ, обычно под управлением Web-броузеров. Помимо этого на апплеты налагаются некоторые ограничения, т.е. ограничивается доступ к ресурсам из апплета. Это делается из соображения безопасности. В документе задается ссылка на апплет. Используется для всевозможного украшения и оживления сайтов.

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

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

SSI
SSI - это директивы, вставляемые прямо в HTML-код и служащие для передачи указаний wев-серверу. Встречая SSI-вставки, web-сервер интерпретирует их и выполняет соответствующие действия. Например, вставляет фрагмент из другого файла. Это может быть главное меню, рекламные вставки, повторяющиеся элементы оформления страничек и т.д. Полная страничка формируется web-сервером на лету, собирая код странички из отдельных фрагментов.


Это, безусловно, далеко не полный список – скорее необходимый минимум, который надо знать, чтобы создавать сайты хотя бы с помощью шаблонов или визуальном редакторе.
Ann
Анатолий Юдов


Размножение хомячков в неволе, или Несколько советов начинающему веб-строителю


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

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

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

Определитесь с тем, где расположить заглавную часть — «шапку», меню, попробуйте схематично изобразить отдельные элементы дизайна. После того как вы сможете уверенно сказать себе: «Да, я понимаю, что будет здесь, и я сделаю это вот таким вот образом», можете приниматься за реализацию... далее http://www.hardnsoft.ru/magazine.php?issue=107&article=588&page=1

Copyright © Hard'n'Soft
Heaven
Коротко:
1) Страницы сайта должны быть максимально легкими
2) Навигация должна быть максимально удобной и понятной для пользователей.
3) Используйте оптимизированные изоражения и хорошего качества.
4) Не ставьте лишних баннеров
5) Будьте разумно оригинальны. Страница все стерпит, то посетитель Вашей страницы терпеть бред и лабуду не станет.
Ann
Актуальная аббревиатура CSS


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

Каскадные таблицы стилей были попыткой разделить визуальное отображение документа от его структуры, отделения дизайна от контента.
Удалось это или нет – можно спорить.
Но использование CSS дает следующие очень важные преимущества:
- при грамотном и разумном использовании CSS значительно уменьшается объем кода
- изменять код становится проще
- код становится более логичным.

Простой пример:

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

Для этого каждый заголовок будет описываться примерно таким образом:
<center><h1><font color=#ff0000><i>Заголовок</i></font></h1></center>

Описывать все заголовки документа довольно скучное занятие. А главное, если захочется, например, поменять цвет – придется менять его столько раз, сколько заголовков.

Эту проблему легко решает CSS. Мы однажды описываем тег <h1>
h1 {text-align: center; color: red; font-style: italic}
В тексте помещаем <h1>Заголовок</h1> и, при необходимости, меняем свойства только один раз сразу для всех заголовков.
Преимущество очевидно.

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


Еще пару слов о том, какие бывают листы стилей.

Внутренние (встроенные).

В область <head> включается конструкция, определяющая стили для данной страницы

<style type="text/css">
h1 {text-align: center; color: red; font-style: italic}
</style>



Внешние

Таблица стилей помещается в отдельный файл с расширением css, а на странице области <head> дается на нее ссылка
<link rel="stylesheet" type="text/css" href="style.css">

Есть еще и так называемое частное применение стилей, когда атрибут style включается прямо в тело конкретного тега.
<h1 style="text-align: center; color: red; font-style: italic">Заголовок</h1>

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

Удачи!
vju
Ann
_http://www.hardnsoft.ru/magazine.php?issue=107&article=588&page=1
The page cannot be displayed
huh.gif
Ann
vju Не грузится? У меня нормально все...
Но, обратите внимание на дату. Статья старая, кое в чем представляющая лишь исторический интерес.
Rodriggess
Если говорить о хостинге, как неотемлимой части веба - то на хостобзоре много полезной инфы www.hostobzor.ru
StarLey
А там глоссария по хостингу вроде нет.
..
Это текстовая версия — только основной контент. Для просмотра полной версии этой страницы, пожалуйста, нажмите сюда.

Русская версия Invision Power Board © 2001-2024 Invision Power Services, Inc.

Warning: require_once(/var/www/bestfil1/public_html/setlinks_0d98c/slsimple.php) [function.require-once]: failed to open stream: No such file or directory in /var/www/bestfil1/public_html/forums/lofiversion/index.php on line 355