HtmlGuide.ru
Учебник по HTML, CSS и Web-дизайну
Сайт поможет начинающему web-мастеру в создании вашей первой html-страницы. А более опытному мастеру, возможно, напомнит о каких то деталях. Основная тематика сайта - создание сайтов, HTML, web-программирование.
Создание выпадающего списка ссылок
Автор: admin | Дата: 06.06.2008
Навигация один из важнейших вопросов, на который нужно ответить при создании сайта. Сейчас уже настолько все реализуемо, что выбрать тип навигации не так-то просто. Кто-то предпочитает flash навигацию, из-за ее красивости и других факторов. Кто-то исключительно строит навигацию при помощи изображений. Но вопрос не в том, как будет выглядеть навигация сайта, а в том, как реализовать ее таким образом, чтобы посетитель легко в ней разобрался.
В последнее время часто веб мастера реализуют ее с применением выпадающих списков. Применяются теги UL и LI для создания ссылок и язык сценариев JavaScript для того, чтобы наша навигация работала.
Я не стал создавать то, что уже реализовано и создано. Более того, работает и применяется на многих сайтах в Интернет. В этой статье вы сможете скачать замечательную работу, отличного программиста и дизайнера. Речь идет об уже готовом наборе списков.
Для тестирования работы, создан раздел в Тестовом разделе:
Горизонтальное меню, выпадение сверху вниз
Горизонтальное меню, выпадение снизу вверх
Вертикальное меню, выпадение слева направо
Вертикальное меню, выпадение справа налево
Создание ссылок в HTML. Как сделать ссылку на архив?
Автор: admin | Дата: 06.06.2008
Часто задают вопросы по поводу ссылок, а темы с описаниями атрибутов тега на сайте нет. Рассмотрим подробнее тег для создания ссылок в HTML и его наиболее популярные параметры.
Для создания ссылки в HTML применяется тег <A>. Тег парный, а конструкция выглядит следующим образом:
<a href=”url”>text</a>
Это стандартная конструкция, где вместо url нужно прописать путь, куда ведет ссылка, а в поле text, текст ссылки. Ссылаться можно как на внутренние документы сайта, так и на внешние ресурсы, а также в html есть возможность ссылаться внутри одного документа. Последний способ представляет интерес, когда на одной странице содержится текст большого объема. Тогда проставив ссылки в начало документа, вы облегчите доступ посетителю к наиболее интересным оглавлениям большой статьи.
Ссылка внутри документа выглядит следующим образом.
<a name=”top”></a> - ставите в место, на которое будете ссылаться.
<a href=”#top”></a> - ссылка, которое указывает на место, для которого вы указали имя. В нашем случае, в место, куда вы поставите <a name=”top”>
Похожие записиИзображения. Атрибуты тега <IMG>
Автор: admin | Дата: 15.05.2008
Для того чтобы вставить изображения на ваши страницы вы должны воспользоваться тегом <IMG>. Идея вставки изображений заключается в том, что вы просто указываете путь, где лежит ваше изображение и дополнительные параметры, например, ширину и высоту рисунка. Вот об этих параметрах и пойдет речь в этой статье.
Итак, как уже говорилось в статье Оптимизация графики для веб, указание размеров рисунка может существенно повлиять на тип загрузки страницы. Посетитель в первую очередь увидит текст на странице, а во время чтения будет грузиться графика. Иначе, если вы проигнорируете эти атрибуты, посетитель должен будет дождаться загрузки графики и только после загрузки всей страницы. Также зачастую изображения являются ссылками на другие документы сайта. В таком случае, по умолчанию, браузер добавит рамку к изображению, тем самым, указав на то, что изображение является ссылкой.
Если у вашей картинки есть всплывающая подсказка, а также название, то страницу можно будет найти в поисковой системе в рубрике Изображения. А это посетители на сайт, которые возможно станут вашими постоянными читателями. К тому же, если у пользователя медленное подключение к Интернет, возможно, он отключит отображение графики на сайте, тогда альтернативный текст, станет пояснением к рисунку. Ну и не менее полезным параметром может стать указание отступа от текста слева и справа, а также сверху и снизу.
Похожие записиВоспроизводим видео на сайте с помощью своего плеера
Автор: admin | Дата: 08.05.2008
Для того чтобы воспроизвести видео на вашем сайте, вы можете воспользоваться тегом <EMBED>, но в таком случае, у пользователя должно быть установлено соответствующее ПО на компьютере. В этой статье мы рассмотрим универсальный плеер, который сможет воспроизвести музыку, картинки, а главное видео файлы независимо от типа ОС, браузера и других параметров системы, т.к. сам плеер и видео будут расположены на хостинге.
Плеер носит гордое имя JW FLV MEDIA PLAYER. Последняя версия, которая доступна на сайте разработчика - 3.16, весит 854КБ. Преимуществ достаточно, для того, чтобы обратить на него внимание. Но, зачем мне ставить плеер для воспроизведения видео на сайте, когда я могу воспользоваться бесплатными сервисами, например Youtube, Rutube и другие? У всех них есть один существенный для меня недостаток, видео файлы находятся на их серверах, сам плеер тоже, т.е. вы автоматически зависите от этих площадок. А случиться, даже с такими крупными сервисами может все что угодно. От технических работ, переезда, до банального удаления вашего файла.
Плееру уже 4 года, как написано на сайте разработчика. За это время он претерпел серьезные изменения, но что радует, загрузить вы можете даже самую первую версию, правда воспроизводит она только mp3-файлы. В более поздних версиях плеера появлялись дополнительные возможности, среди которых, поддержка плейлистов, скринов для видео, настроек цвета для кнопок, меню, бара поиска видео на Yuotube и многие другие.
Похожие записиТеги: flash, flv, инструменты, плееры, программы
Как сделать чтобы при наведении на ссылку она выделялась?
Автор: admin | Дата: 07.05.2008
как сделать чтобы при наведении на ссылку она выделялась?
Сегодня общаясь в ICQ, мне задали такой вопрос. Я считаю его интересным, т.к. ссылки на странице, да и в интернете играют значительную роль, если не сказать самую важную. Ведь всемирная паутина построена на принципе создания ссылок с одного сайта на другой, одной страницы на другую. Поэтому ссылка должна быть заметной, а адрес, если вы хотите оставить хорошее впечатление о сайте, более-менее понятен пользователю.
Для сравнения на сайте магазина, посетителю предлагается такой адрес директории:
http://www.site.com/?h=76byrtr5&p=675gvth&c=45
а на сайте другого магазина, директории получили имена
http://www.site1.ru/shop/auto/new.shtml
Второй адрес намного понятнее, его легче запомнить, да и технологии сейчас позволяют легко создавать такие адреса. Как же сделать так, чтобы при наведении на ссылку она выделялась? Приступим к примерам. Мы можем выделить ее, добавив параметр font-weight в описании стиля для ссылки.
Похожие записи<html>
<head>
<title>Выделение ссылки при наведении курсора</title>
<style type=”text/css”>
<!–
a {color: red; font-size: 14px}
a:hover {color: red; font-size: 14px; font-weight: bold}
–>
</style>
</head>
<body>
Рассмотрим пример, при котором <a href=”page.html”>ссылка</a> выделяется при наведении на нее
</body>
</html>
Рубрики
Самое читаемое
- Рассмотрим тег <META> (190)
- Теги <H1>…<H6> для создания заголовка (178)
- Поговорим о HTML? (177)
- Горизонтальная линия, тег <HR> (176)
- Браузеры (174)
- Оптимизация графики для Web (163)
- Тройка тегов: выделение, подчеркивание, курсив (162)
- Аббревиатуры (154)
- Параметр ALIGN в HTML (150)
- Тег <FONT> - часть I (143)
- Тег <FONT> - часть II. Изменяем гарнитуру текста (140)
- купить доменное имя на UkrDomen
- dedicated server
- автосалон хонда