Разработка сайтов для СРО

SEO-копирайтинг — текст для поисковой оптимизации. Продвижение сайта в поисковых системах. Оптимизация сайта для поисковых машин. Раскрутка сайта в ведущих поисковиках

Создание и раскрутка сайтов в Интернете

Что нужно для SEO?

Текст & Всемирная Паутина

Инструмент веб-строителя

HTML - язык гипертекста

CSS - каскадные таблицы стилей

Поисковая оптимизация

Что такое раскрутка сайта?

Контекстная реклама

Что такое обмен ссылками?

Почтовые рассылки

Соблюдайте правила

Что препятствует рейтингу?

Что такое CMS?

Краткий словарь терминов

Полезные книги

Карта сайта

Этапы создания сайта

Десять важных шагов

Разработка семантического ядра

Обновление информации

Заголовки

Проверка ссылок

Проверка ошибок в коде

Шрифтовое оформление

Навигация по сайту

Метаданные

Выбор кодировки

Ключевые слова

 
Разработка сайтов под ключ

Ссылки по теме

Blogger: Создайте блог БЕСПЛАТНО

WordPress: Платформа для ведения блога

Online-переводчик :: Компания ПРОМТ

Поисковая оптимизация – все дело в написании текстов

Стратегия продвижения сайтов

Новые исследования поискового поведения пользователей

Орфографические словари

Словарь русских синонимов Абрамова

Орфографический словарь Лопатина

Современный словарь иностранных слов

Толковый словарь русского языка Ожегова

Архивы форума "Говорим по-русски"

FAR — программа управления файлами и архивами

FCKEditor - текстовый редактор для браузера

NotPad++ - текстовый редактор

PSPad — текстовый редактор

UltraEdit-32 - текстовый редактор

Nvu - HTML редактор

CoffeeCup - HTML редактор

 

Создание CSS-меню, CSS-макеты, CSS-эффекты, CSS-методы

Главная « Уроки Web-мастерства
 
Уроки Web-мастерства Добавление Flash на Web-страницу…

Ролики Flash при экспорте авторскими инструментальными средствами Flash оформляются с помощью комбинации элементов object и embed, которые имеют параметры и атрибуты, управляющие выводом на экран и воспроизведением.

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

Урок № 20: | Дата: 14.10.2008 | Автор: Коровенков Юрий

Обсудить на форуме…

Уроки Web-мастерства Внедрение ролика Windows Media на Web-страницу…

Ролики Windows Media также можно внедрять на Web-страницу. Минимальная разметка для этого достаточно простая, однако она быстро усложняется, если использовать дополнительные возможности скриптов, пользовательские кнопки и тому подобное. В этой статье я опишу только основные возможности.

Урок № 19: | Дата: 07.10.2008 | Автор: Коровенков Юрий

Обсудить на форуме…

Уроки Web-мастерства Таблицы для верстки - это не обязательно зло…

Вы, конечно, уже слышали, что верстка на основе таблиц была заменена стилями CSS для позиционирования элементов страницы.

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

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

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

Урок № 18: | Дата: 02.09.2008 | Автор: Коровенков Юрий

Обсудить на форуме…

Уроки Web-мастерства Создание эффекта mouseover при помощи CSS…

Хотите создать эффект mouseover без использования JavaScript? Что ж, это возможно. Эксперт по CSS Эрик Мейер (Eric Meyer) показывает, как это сделать, на своем сайте CSS/Edge.

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

Урок № 17: | Дата: 11.05.2008 | Автор: Коровенков Юрий

Обсудить на форуме…

Уроки Web-мастерства Свободное размещение в CSS…

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

По-настоящему именно ради этой возможности и создано свойство float. Важнейшее различие между выравниванием в HTML и CSS состоит в том, что в CSS можно свободно расположить любой мыслимый элемент (абзац, список, элемент div и т. д.), а не только изображение.

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

Свободное размещение полезно не только, чтобы иногда «прижимать» к краю рисунки. На деле это один из основных инструментов современного Web-дизайна, основанного на технологии CSS.

Свободным размещением элементов пользуются для построения документов с несколькими колонками, панелей навигации из ненумерованных списков, выравнивания, напоминающего таблицу, но не являющуюся таковой, и т. д.

Урок № 16: | Дата: 17.04.2008 | Автор: Коровенков Юрий

Обсудить на форуме…

Уроки Web-мастерства Навигационные CSS-панели на основе списков…

Горизонтальные навигационные панели составляют основу дизайна Web-интерфейса. Традиционно они создаются из нескольких находящихся рядом текстовых ссылок или нескольких изображений. В любом случае в исходном коде документа их разметка не слишком семантическая.

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

Урок № 15: | Дата: 10.03.2008 | Автор: Коровенков Юрий

Обсудить на форуме…

Уроки Web-мастерства CSS-стили для шрифтов и текста…

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

Шрифт, больше чем любой другой фактор, свидетельствует о качестве сайта. Графика является лишь сахарной глазурью, покрывающей торт, хороший дизайн начинается с типографики.

Если, прочитав название статьи, вы задали себе вопрос: «А разве шрифт и текст не одно и то же?», отвечаю - нет.

Урок № 14: | Дата: 05.03.2008 | Автор: Коровенков Юрий

Обсудить на форуме…

Уроки Web-мастерства CSS-эффекты наведения указателя мыши…

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

Ранее для создания подобных эффектов было необходимо использовать JavaScript, но того же самого можно добиться и при помощи одного CSS, используя селектор псевдокласса :hover.

Нужно отметить, что браузер Internet Explorer 6 (и ниже) не поддерживает селектор :hover для элементов, отличных от гиперссылки, поэтому на этом уроке мы сконцентрируемся на эффектах наведения для текстовых и графических ссылок.

Урок № 13: | Дата: 06.02.2008 | Автор: Коровенков Юрий

Обсудить на форуме…

Уроки Web-мастерства CSS-методы центрирования web-страницы…

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

На этот уроке я Вас познакомлю с тремя CSS-метода центрирования страницы фиксированной ширины: официальный CSS-метод, альтернативный способ, работающий в Internet Explorer и эффективный «путь обхода».

Урок № 12: | Дата: 05.02.2008 | Автор: Коровенков Юрий

Обсудить на форуме…

Уроки Web-мастерства Прямоугольники с закругленными углами на основе CSS…

Закругленные углы весьма модны в современном Web-дизайне. Из-за того, что Web-дизайн в основе своей - прямоугольный, закругленные углы с помощью графики, которая имеется в составе структурной разметки получить нельзя.

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

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

Как и для большинства других проблем Web-дизайна, здесь существует много решений, самые простые из которых я представляю в этой статье.

Урок № 11: | Дата: 22.01.2008 | Автор: Коровенков Юрий

Обсудить на форуме…

Уроки Web-мастерства CSS-методы замены текста изображениями…

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

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

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

В этой статье я вас познакомлю с наиболее популярными CSS-методами замены текста изображениями.

Урок № 10: | Дата: 29.12.2007 | Автор: Коровенков Юрий

Обсудить на форуме…

Уроки Web-мастерства Создание многоуровневых раскрывающихся CSS-меню…

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

Мы уже имеем родительское горизонтальное меню, раскрывающееся меню и нам необходимо добавить вложенные в него меню третьего и четвертого уровня.

Для их добавления нам необходимо выполнить два простых действия. Изменить код разметки для добавления раскрывающихся элементов с помощью вложенных списков.

Урок № 9: | Дата: 25.11.2007 | Автор: Коровенков Юрий

Обсудить на форуме…

Уроки Web-мастерства Раскрывающиеся CSS-меню…

На предыдущем уроке мы создали горизонтальные меню навигации на базе списков. Теперь возведем наше горизонтальное меню на следующий уровень - добавим раскрывающиеся меню.

Раскрывающиеся меню на базе CSS не будут работать в браузере Internet Explorer для Mac. Тем не менее, я покажу, как использовать CSS и создать работающее меню и для этого браузера.

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

Урок № 8: | Дата: 01.11.2007 | Автор: Коровенков Юрий

Обсудить на форуме…

Уроки Web-мастерства Основные типы CSS-макетов…

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

Урок № 7: | Дата: 14.10.2007 | Автор: Коровенков Юрий

Обсудить на форуме…

Уроки Web-мастерства Создаем CSS-меню…

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

Все, что для этого требуется, - контекст, контейнер <div> с идентификатором, чтобы нужные CSS стили применялись к нужному списку. Фактически, создать такие меню с помощью CSS очень легко. Первым шагом на пути к созданию раскрывающихся меню станет создание горизонтального меню с основными пунктами.

Урок № 6: | Дата: 23.09.2007 | Автор: Коровенков Юрий

Обсудить на форуме…

Уроки Web-мастерства Создание компонентов интерфейса в XHTML…

В этой статье я покажу, как создавать XHTML-код для нескольких элементов интерфейса и применять к ним CSS-стили. По ходу дела мы создадим библиотеку CSS-компонентов, которую вы сможете использовать как точку отправки при создании собственных страниц…

Урок № 5: | Дата: 16.07.2007 | Автор: Коровенков Юрий

Обсудить на форуме…

Уроки Web-мастерства Особенности структуры текста на Web-сайте…

В данной статье я рассматриваю несколько факторов, которые необходимо учитывать при написании текста, отображаемого на экране персонального компьютера и размещаемого на Web-сайте…

Урок № 4: | Дата: 01.06.2007 | Автор: Коровенков Юрий

Обсудить на форуме…

Уроки Web-мастерства Как сделать сайт максимально удобным?

Для того чтобы сайт был максимально удобным, необходимо найти баланс между рекомендациями по простоте использования, практическим опытом и результатами тестирований…

Урок № 3: | Дата: 12.05.2007 | Автор: Коровенков Юрий

Обсудить на форуме…

Уроки Web-мастерства Как более эффективно писать для Сети?

В данной статье пойдет речь о том, как более эффективно писать для Сети, а также что требуется для принятия стратегических решений относительно долгосрочного управления контентом…

Урок № 2: | Дата: 03.05.2007 | Автор: Коровенков Юрий

Обсудить на форуме…

Уроки Web-мастерства Как эффективно организовать бизнес-проект?

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

Урок № 1: | Дата: 01.05.2007 | Автор: Коровенков Юрий

Обсудить на форуме…

 
Запомнить эту страницу в google.com Запомнить эту страницу в bobrdobr.ru Запомнить эту страницу в news2.ru Запомнить эту страницу в Memori.ru Добавить в МоёМесто.ru сохранить на RUmarkz Добавить страницу к Мистеру Вонгу Запомнить эту страницу в del.icio.us Запомнить эту страницу в technorati.com Запомнить эту страницу в linkstore.ru Добавить на Ваау!
Valid XHTML 1.0! Valid CSS!
Как устроены поисковые системы?

Облик поисковиков

Поисковые системы

Индекс поисковой системы

Полнотекстовый поиск

Учет морфологии

Релевантность

Методы регистрации

Индекс цитирования

 
Словари
 
Словарь терминов поисковой оптимизации
 
Справочники
 

Справочник по языку XHTML 1.0

 
Заголовки разделов текущей страницы…

Оглавление

Как эффективно организовать бизнес-проект?

Как более эффективно писать для Сети?

Как сделать сайт максимально удобным?

Особенности структуры текста на Web-сайте…

Создание компонентов интерфейса в XHTML…

Создаем CSS-меню…

Основные типы CSS-макетов…

Раскрывающиеся CSS-меню…

Создание многоуровневых раскрывающихся CSS-меню…

CSS-методы замены текста изображениями…

Прямоугольники с закругленными углами на основе CSS…

CSS-методы центрирования web-страницы…

CSS-эффекты наведения указателя мыши…

CSS-стили для шрифтов и текста…

Навигационные CSS-панели на основе списков…

Свободное размещение в CSS…

Создание эффекта mouseover при помощи CSS…

Таблицы для верстки - это не обязательно зло…

Внедрение ролика Windows Media на Web-страницу…

Добавление Flash на Web-страницу…

 

NotPad++ - текстовый редактор…

 

наверх

 
Контактная информация

Пишите:
Звоните: + 7 (916) 597-36-78

SEO-копирайтинг — текст для поисковой оптимизации. Продвижение сайта в поисковых системах. Оптимизация сайта для поисковых машин. Раскрутка сайта в ведущих поисковиках

Copyright (©) 2004— by Yuriy Korovenkov