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

Создание собственного сайта от А до Я.

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

При закрытии подписчики были переданы в рассылку "Cекреты успешных идей для интернет-бизнеса" на которую и рекомендуем вам подписаться.

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

←   Ноябрь 2005   →
 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
15.11.2005
19:06:00
19:15:07
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
Автор
Студия Мастера Монтажа

Статистика

2.025 подписчиков
0 за неделю
←   Все выпуски   →

Создание собственного сайта от А до Я. Фреймы - за или против?


Информационный Канал Subscribe.Ru

Урок 5 - Фреймы - за или против?

Вся информация по рассылке доступна здесь. Вы можете скачать все выпуски рассылки.
Вот и подошло время очередного урока рассылки "HTML это просто". В этом уроке разберем построение таблиц в web-документах. Усвоить этот урок очень важно, тяжело найти ресурс, не использующий в своей структуре таблиц. Перед началом, не сколько новостей:
1. - начнем с плохого. На просьбу проголосовать за работы, заявленные на конкурс объявленный в "3 уроке", откликнулось только 31 человек (всего 1700). Поэтому пока подводить итоги конкурса сегодня не будем. Пока лидирует работа Админа сайта http://u4ilka2005.narod.ru. Поэтому еще раз обращаюсь ко всем читателям не поленитесь, загляните по этой ссылке, отдайте свой голос за лучшую, по вашему мнению, работу, или против всех. Если к следующему выпуску количество проголосовавших перевалит за 100, будут подведены итоги.
2. - и еще одно нововведение в рассылке " HTML это просто", теперь в каждом выпуске начиная с этого, будет голосования. Суть голосования, выбор темы, которая должна быть освещена в следующем уроке. Думаю, так рассылка будет шагать в ногу с вашими желаниями и запросами.
Web Coder, именно на нее ориентируясь, будут написаны уроки. Поэтому все кто желает понять и свободно владеть HTML , качаем по этой ссылке (600 кб).
Ну, все приступаем.

А что такое фрейм?

Одним из наиболее широко применяемых при создании web-страниц средств являются таблицы. Думаю вам не нужно объяснять о понятии табличного представления данных. В HTML таблицы используются не только традиционно, но и как метод средство форматирования web-страниц.
Взяв пример построения структуры сайта (из прошлого урока), можно разделить страницу на 3 фрейма:
1. - навигационное меню;
2. - наполнение страницы;
3. - дополнительная панель.
Теперь пользователь, зайдя на вашу страницу выбрав один из пунктов меню, не будет ждать полной перезагрузки страницы, а только наполнения страницы. То есть страницы как бы склеивается из нескольких. Допустим можно в одной странице прописать навигационное меню по сайту, и загружать ее во фрейме, вместо того чтобы прописывать код меню на каждой странице.

Все равно не понятно?

На части из страниц из раздела "Строим вместе" страницы построены с использованием фреймов. Думаю, они понимают, о чем идет речь. Для не посвященных приведу простейший пример:
Создайте страницу вот с этим исходным кодом:
<html>
<head>
<title>Строим с фреймами</title>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
<frameset rows="200,500,200">
<frame src="menu.html">
<frame src="box.html">
<frame src="menu2.html">
</frameset>
</head>
</html>
Сохраняем получившуюся страницу под любым именем (например, frame.html). Теперь создайте три произвольные страницы с именами - menu.html, box.html, menu2.html. Запустите frame.html. Думаю, после этого примера вы без проблем поймете, что же такое фрейм.

По эксперементируем?

Попробуйте теперь так:
<html>
<head>
<title>Строим с фреймами</title>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
<frameset rows="500,200,500">
<frame src="menu.html">
<frame src="box.html">
<frame src="menu2.html">
</frameset>
</head>
</html>
А так:
<html>
<head>
<title>Строим с фреймами</title>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
<frameset cols="200,800,100">
<frame src="menu.html">
<frame src="box.html">
<frame src="menu2.html">
</frameset>
</head>
</html>

Теперь разберем параметры тэга.

Как можете увидеть нет привычного тэга BODY, вместо него появился FRAMESET. Именно этот тэг указывает, что ваша страница построена на основе фреймов. Кстати страницы, которые загружаются во фреймы строятся обычными методами.
Теперь разберем параметры которые можно указать внутри тэга FRAMESET:
1. - тип разделения страницы:
  • cols - вертикально
  • rows - горизонтально

2. - размер в пикселях каждого фрейма (cols="200,800,100"): можно указать и так (cols="200,*,100"), то есть первая колонка будет 200 пикселей, третья 100, а вотрая все оставшейся пространство. Также можно указать и процентное отношение колонок (cols="20%,50%,30%"), сумма должна быть 100%.
3. - border - толщина перегородки между подфреймами

Теперь данные которые можно указать уже в тэге - <frame>:
1. - src - документ, который нужно загрузить в конкретном подфрейме.
2. - scrolling - scrolling="no" = полосы прокрутки не будет, scrolling="yes" = будет в любом случае.
3. - marginheight - ширина в пикселах верхнего и нижнего полей фрэйма.
4. - marginwidth - ширина левого и правого полей фрэйма.
5. - name - имя окна, будет нужно для привязки ссылок.
Чтобы было понятней попробуйте вставить каждое из дополнительных значений в контейнер тэга. Так вам буде легче понять работу каждого конкретного параметра, ад и для себя сможете решить, что в будущем будете использовать а что нет.

Некоторые хитрости Frame.

Теперь давайте разберемся, а как сделать так чтобы например посетитель нажимал на ссылку в первой колонке, получал изменение во второй колонке не затрагивая остальные.
Вот тут нам понадобится, как раз дополнительный параметр name. Прописываем следующее:
<html>
<head>
<title>Строим с фреймами</title>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
<frameset cols="200,*,100">
<frame src="menu.html">
<frame src="box.html" name="mycontent">
<frame src="menu2.html">
</frameset>
</head>
</html>
Теперь в этой же директории, страницу с именем menu.html:
<html>
<head>
<title>Строим с фреймами</title>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
</head>
<body>
<a href src="first.html" target="mycontent">Главная</a><br>
<a href src="gost.html" target="mycontent">Гостевая</a><br>
<a href src="foto.html" target="_Top">Мои фото</a><br>
<a href src="http://softsmm.h15.ru/" target="_blank">Софт портал SMM</a><br>
</body>
</html>
В первых двух случаях будут загружаться выбранные страницы во фрейме с именем mycontent, в третьем в этом же фрейме, в четвертом в новом окне.
К слову если ваш сайт будет построен на фреймах прописав главную страницу фреймов, не забудьте присвоить ей имя index.html.

Плавающий фрейм.

Допустим, вы не хотите строить весь сайт на основе фреймовой структуры. А только какую-нибудь часть, например, только последние новости сайта. То есть, так не придется переписывать нужный блок на каждой странице, достаточно будет прописать блок в одной странице, и он будет загружаться во всех страницах (где вставлен плавающий фрейм).
Пример плавающего фрейма можете посмотреть у меня на "Софт портале SMM", колонка "Друзья ресурса" (на всех кроме 4 страниц) выполнена с помощью плавающего фрейма. То есть при добавлении нового партнера мне не нужно переправлять более 150 страниц, а изменить всего одну.
<iframe src="http://mastermontaga.narod.ru/intro/partners.html" name="a" width=140 height=200 scorlling=yes align=right></iframe>
Объяснять подробнее о каждом параметре я не буду, причина банальна, если внимательно читаете все уроки и применяете свои знания на практике, вам и так все будет понятно.

На посошок.

Применять или нет, это ваше личное дело. Но не в зависимости от того будете ли вы строить свой ресурс на основе фреймов или нет, знать суть нужно каждому уважающему себя web-мастеру.
В данный момент сайты построенные на фреймах встретить можно довольно редко. А вот плавающие фреймы встретить можно гораздо чаще.
У фреймовой структуры есть свои плюсы, но не мало и очевидных минусов.
На этом завершаем этот урок, удачи всем в нашем не легком деле!!!
Вот собственно и нововведение рассылки "HTML это просто". Тему следующего урока будете выбирать вы, читатели рассылки. Теперь вы сами можете решать, о чем стоит рассказать, а о чем еще повременить.
Тема, которая наберет больше всего голосов и будет темой следующего урока.
Варианты темы 7 (следующего) урока?
Нас всех считают. Статистика.
ТИЦ? Просто о сложном
Раскрутка web-проекта
Динамический HTML
К сожалению, некоторые почтовики не понимают кнопок, например The Bat. Поэтому параллельно форма голосования размещена на странице рассылки.

Письма читателей.

А могли бы Вы в рассылке рассказать поподробнее
о TITLE - что это такое?
о ключевых словах и описании.
Прислала: irina175.
Этому будет посвящен отдельный урок. Потерпите скоро подойдет очередьи этой теме
Я являюсь подписчиком вашей рассылки, но не могу скачать Web Coder по приведенной ссылке.Прислал: tourbureau
Можно, даже нужно просто добавить ссылку в ваш Download менеджер. Если и так ни как не получается, вот ссылка на сайт Web Coder.
Видел на вашем портале, строку типа - сайт в сети ** дней. Не подскажите, как это осуществить Прислал: Serega
Очень просто: в нужное место страницы, вставь:
сайт в эфире <script language=JavaScript> <!-- site = new Date('September 29, 2005'); // d = new Date(); date = (d.getTime() - site.getTime()) / (1000*60*60*24); document.write(Math.round(date) + "-й день."); // --></script>Есно вместо September 29, 2005 вставь число с которого нужно вести отсчет.
Свои вопросы, пожелания, замечания можете задать:
Полезная рассылка
Обзор софта с прямыми ссылками; Hi-tech новости; Юмор и многое другое Вы можете получать каждую неделю.
Подписаться через:
Subscribe  или  Rambler
Создают с нами:

  http://yurasite.narod.ru

  http://brigadir25.narod.ru

  http://u4ilka2005.narod.ru

  http://inyi.narod.ru

  http://electro20.narod.ru

  http://all5mb.narod.ru

  http://tolyattinec.narod.ru

  http://xskernel.narod.ru

  http://comingin.narod.ru

  www.mobilepincod.narod.ru

  http://yur-pechnik.narod.ru

  http://timouru.narod.ru

  http://ra4uik.narod.ru

  http://polyna3.narod.ru

  vesmirvkarmane.narod.ru/


В этой колонке, будут ссылки на ваши проекты. Которые создаете по моим урокам. Достаточно выслать на softsmm@mail.ru адрес вашего ресурса. Внимание!!! Принимаются только ресурсы, которые создаются по моими урокам, содержание, наполнение значение не имеет.
Вся информация по рассылке доступна здесь. Вы можете скачать все выпуски рассылки.
Subscribe.Ru
Поддержка подписчиков
Другие рассылки этой тематики
Другие рассылки этого автора 		Подписан адрес:
Код этой рассылки: inet.webbuild.htmlsmm
Архив рассылки 		Отписаться
Вспомнить пароль
В избранное