Учимся делать ссылки в html

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

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

Для того чтобы обозначить ссылку существует тег "a" и его параметр htef, в котором указывается адрес страницы на которую ссылаются.





Запомните, тег "a" парный, требует обязательное закрытие.

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

У ссылке существует параметр target, с помощью которого можно изменить переход в другом окне.

Продолжение - Учимся делать ссылки в html

FAQ по HTML - Форматирование текста

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

Тег p - параграф.

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

Далее к тексту применим форматирование, то есть заставим наш текст выглядеть визуально красиво.

Для этого будем применять следующие теги:

strong - Жирное начертание текста. Пример: Применение тега strong. Данный тег является парным, то есть требует закрытия.

em - Курсивное начертание текста. Пример: Применение тега em. Данный тег тоже парный.

Важно знать что теги b и strong, также как i и em являются не совсем эквивалентными друг другу.

Первый тег b — это тег физической разметки и устанавливает жирный текст. Тег strong — это тегом логической разметки и определяет важность помеченного текста.

Такое разделение возникло не случайно и необходимо для универсальности вывода информации.



Для изменения размеров текста применяют заголовки h1...h6.

Заголовки предназначены для создания заголовков (названий) к разделам и показывают их относительную важность. Вы должны знать, что по умолчанию h1 отображается в жирном начертании и размером 24 пунктов, тег h2 уже имеет размер 18 пунктов, а h3 — 14 пунктов и т.д.





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

Продолжение в FAQ по HTML - Форматирование текста

Введение в HTML

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

Думаю для тех, кто только осваивает HTML, будет очень удобно и полезно, так как они конкретно получат ответ на все свои вопросы.

Начну с главного, что Вы должны знать.

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

Все теги заключаются символами <> и бывают двух видов одиночные и парные. Парные теги закрываются следующим образом .





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

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





Структура любого html документа должна состоять из следующих элементов:

DOCTYPE – указывает на тип документа;
HEAD – блок (раздел) заголовка документа;
BODY – тело документа;

Как вы видите в предыдущих примерах, сначала мы указываем тип документа (данный тег необходим браузеру), далее идет блок тегов, указывающий, что данный документ html, после идет раздел заголовка документа, и только потом идет тело документа.

Теперь поговорим о метатегах, которые необходимо размещать в разделе заголовка документа.

Продолжение читайте в FAQ по HTML - Введение

Эффективное ускорение своего сайта

Давайте заглянем чуть глубже, за экран монитора. Что мы там увидим? Бесконечное множество страниц сайта, которые, так или иначе, попадают к нам в компьютер и загружают нас потоком соей информации.

Единицы из таких сайтов являются качественными и используют всю технологию современного сайтостроения. Скорость загрузки таких сайтов достаточно велика, чтобы просматривать их даже на DIAL-UP соединении (модемном доступе).

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

Для чего вообще нужна такая быстрота?

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

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

Это сжатие данных посредством технологии GZip. Что это за технология? Это специальная утилита сжатия и восстановления (декомпрессии) файлов, которая работает в основном в UNIX-системах.

Основная функция данной утилиты – это сжатие и распаковка одного файла.

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

Применение GZip сжатия уменьшает объем страниц до 90%, весь процесс занимает всего лишь несколько миллисекунд. GZIP сжатие относится только к текстовой части информации. Графика, видео, архивы и прочие нетекстовые данные не сжимаются.

Я когда узнал о данной технологии попытался применить на своем сайте Библиотека Internet-бизнесмена и всех сайтов расположенные на домене www.infowind.ru. На основном сайте данная технология позволила ускорить его работу в 1.6 раза. На поддоменах вызвала ошибку в коде, что заставило меня задуматься об обновлении и доработке своей CMS.

Вообще если вы являетесь разработчиком или просто у вас есть сайт который вам хотелось бы улучшить подключайте технологию GZip. Разместите в самом начале документа код:

ob_start('ob_gzhandler');

Теперь смотрите, что дало подключение Gzip на данном сайте (включено в CMS AF 1.01)

Для тестирования можно воспользоваться специальным сайтом для проверки: www.port80software.com/support/p80tools.asp. Забьём в окошко "compression check" адрес этой страницы, и рассмотрим результаты теста.





При отключенном GZip оригинальный размер страницы 11.3 KB.

После включения сжатия я выиграл в скорости загрузки 0.608 секунд на DIAL-UP соединении.

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

PS: Можете делиться своим опытом применения технологии в комментариях.

FAQ по HTML - Введение

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

Думаю для тех, кто только осваивает HTML, будет очень удобно и полезно, так как они конкретно получат ответ на все свои вопросы.

Начну с главного, что Вы должны знать.

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

Все теги заключаются символами <> и бывают двух видов одиночные и парные. Парные теги закрываются следующим образом .




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

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





Структура любого html документа должна состоять из следующих элементов:

DOCTYPE – указывает на тип документа;
HEAD – блок (раздел) заголовка документа;
BODY – тело документа;

Как вы видите в предыдущих примерах, сначала мы указываем тип документа (данный тег необходим браузеру), далее идет блок тегов, указывающий, что данный документ html, после идет раздел заголовка документа, и только потом идет тело документа.

Теперь поговорим о метатегах, которые необходимо размещать в разделе заголовка документа.

Title – сообщает пользователю название сайта.





Description – описывает краткое содержание документа.





Keywords – в данном теги указывают ключевые слова, встречающихся на странице.





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





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



Содержание FAQ по HTML:

Введение.
Форматирование текста.
Учимся делать ссылки.
Работаем со списком.
Изучаем таблицы.
Форма, как средство взаимодействия с пользователем сайта.

Как увеличить скорость загрузки сайта путем кэширования сайта и буферизации вывода

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

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

Я предлагаю вам реально работающую систему кэширования страниц с буферизацией вывода. Данный скрипт прекрасно работает в рамках CMS AF. Что делает данная система:

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

Сразу скажу, что данные сохраняются в статическом виде. Это дает нам огромное преимущество: ускорение загрузки страниц и снижение нагрузки на сервер, и базу данных.

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

Хватит теории - переходим к действию - Увеличиваем скорость загрузки сайта

ТИЦ 10 или результат четырехмесячной работы

После очередного апдейта Яндекса, который случился 6.08.10г. ТИЦ Денежного сайта достиг минимального уровня в 10 единиц. С одной стороны можно радоваться тому, что так относительно быстро мой личный сайт вырос.

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

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

Подолжение на Денежном сайте

Резервное копирование данных

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

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

Вот тебе и праздники. Почти сутки выяснял что произошло. Пытался воскресить Windows? Но загрузочному диску не удается вообще загрузиться. При тестировании оказалось из за ошибки системная область основного диска "С" оказалась неактивной.

Пришлось форматировать диск и заново устанавливать операционную систему. Соответственно все данные которые хранились на диске "С" были потеряны.

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

Продолжение на странице - Резервное копирование данных.

Переход на сервис почтовых рассылок Smartresponder.Ru

Готовясь к обновлению своего обучающего курса "Построй Информационный Бизнес Своими Руками", я задумался над тем как доставить курс своим подписчикам. Уже давно я не думал об этом, так как более 3 лет использовал скрипт В.Ласто, который достаточно хорошо зарекомендовал себя в Runete.

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

Но как не хотелось, бы расхваливать данный скрипт, все же я принял решения уйти от него и перейти на сервис Макса Хигера Smartresponder.ru

Почему я принял такое решение. Да все достаточно просто.

Занимаясь уже давно созданием сайтов, я технически перестал успевать и отслеживать работу скрипта Почтовый Дятел. Хотя он продолжает работать отменно, все-таки на нем иногда случаются какие-то сбои, в которых мне просто некогда разбираться. Мало того я заметил что отклик от всех моих подписчиков стал снижаться.

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

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

Вот поэтому я перехожу на Smartresponder.ru

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

Чем все же сервис привлек меня ранее и что я нашел в нем нового сейчас читайте на Денежном сайте

Всплывающая подсказка на jQuery

Не так давно я узнал от Евгения Попова, в его очередном выпуске журнала, как сделать красивую всплывающую подсказку с помощью jQuery-плагина TipTip.

Я решил на практике убедиться, действительна ли она, так красива. Результат вы можете посмотреть, указав мышкой на любую ссылку сайта.

Особенности плагина в том, что подсказку можно выводить как на ссылку, так и на объект формы или на картинку. Мало того плагин обладает следующей особенностью. Он сам вычисляет геометрию страницу и края экрана, тем самым позволяет позиционировать подсказку.

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

Давайте рассмотрим, как практически я его внедрил в свою систему управления контентом.

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

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

Вы тоже можете скачать налаженный дистрибутив jQuery-плагина TipTip и применить у себя на сайте.

Открыв его, вы увидите, что он состоит из самого jQuery, плагина TipTip и таблиц стилей для оформления комментария.

Продолжение читайте на Денежном сайте