Создание веб сайта, дело не легкое, его продвижение, еще тяжелее, но, это отступление, а теперь пойдем дальше. В первой части RSS и Atom я рассказывал, как добавить к своему сайту Rss канал, который будет транслировать новости вашего сайта. Не сам по себе, конечно, а только тем,
кто на них подпишется. Ну это не большой отступление! Сегодня же, мы добавим (до кучи) себе на сайт ленту новостей в формате – Atom. Думаю, как и с RSS лентой, особых сложностей не будет. Как и в первой части нашей саги, за пример берем кусок готового кода:

<?xml version=”1.0″ encoding=”windows-1251″?>
<feed xmlns=”http://www.w3.org/2005/Atom” xml:lang=”ru-ru”
xml:base=”/feed.atom”>
<title>Новости портала AVATARAM.RU</title>
<subtitle>Новости портала AVATARAM.RU, Непознанное, Магия, Религия, Библиотека, Практики,
Паранормальное, Wiki Магия</subtitle>
<link rel=”self” type=”application/atom+xml” title=”feed.atom”/>
<updated>2009-03-14T18:30:02Z</updated>
<author>
<name>Avatara</name>
<email>Этот адрес электронной почты защищён от спам-ботов. У вас должен быть включен JavaScript для просмотра.</email>
</author>
<id>/</id>

<entry>
<title>Новости портала AVATARAM.RU</title>
<link rel=”alternate” type=”text/html” href=”/bloger/” />
<id>/ </id>
<content type=”html” >
Новое обновление сайта, Произошли обновления в разделе Магия, а так же появились новости в
разделе Блог
</content>
<updated>2009-03-17T01:35:52Z</updated>
<summary>Обновление в разделах: Блог и Магия</summary>
</entry>
</feed>

   В первой строчке содержится служебная, так сказать информация и трогать ее не нужно! Со второй строчки начинается непосредственно описание нашего Atom
канала. В ней нам необходимо заменить адрес нахождения Atom файла,
который будет за все отвечать, на свой (пример: xml:base=”/feed.atom”> –
здесь мой адрес изменить на свой). Теперь давайте разберемся с тегами. После заголовка файла,
первым идет тег – <title> – Заголовок нашего канала. Далее идет тег – <subtitle>
аналогичный тегу <description> в RSS. Он дает оаисание нашей будущей новостной
ленты. Следующий за ним тег – <link … > – указывает на адрес где будет находится файл
новостной ленты. <updated> – здесь уже по одному названию можно догадаться, что это время
последнего обновления ваших новостей новостей. Конечно, несколько грустно, но эта цифра сама не
меняется, после каких либо изменений на сайте, дату и время придется проставлять вручную.

   Между тегов <author> … </author> содержится краткая информации об
авторе Новостного канала, его имя, или ник и адрес электронной почты. А вот далее, идет
непосредственно описание наших новостей заключенное между тегами <entry> … <entry>
Смысл последнего описывать не буду, тут все так же как и в RSS файле. В нашем примере используется
новости на главный раздел сайта, На его примере создаем столько новостей, сколько нам нужно.
Меняя заголовок, адрес страницы или раздела сайта, и его описание, соответствующее разделу.
Единственно, что можно еще упомянуть, так это тег – <summary> – он отвечает за краткое
описание новости, проще говоря – Анонс! Заканчивается весь этот код тегом – </feed> –
закрывающим наш канал.

   Сохраняем наш файл с любым понравившимся именем, у меня это – feed, и с
расширением: .atom (у меня это feed.atom). Вот и готов наша Atom – Новостная лента.
Остается лишь добавить в заголовок нашей html страницы ссылочку на этот файл. Выглядит ссылка
следующим образом: <LINK rel=”alternate” type=”application/atom+xml” title=”Новости
AVATARAM.RU Atom” title=”feed.atom”> Меняем мои данные на свои и на этом
подключение новостного канала заканчивается.

   Установив в прошлый раз RSS, на вашем сайте, в правом углу появилась оранжевая
иконка RSS-канала, при нажатии на которую появляется окошко с предложением подписаться на
новостной канал. Теперь же, когда мы добавили еще и Atom-ленту новостей, при
нажатии на иконку, под ней появляется 2 строки, с возможностью выбора. Предлагается подписаться
на RSS и другая строчка – Подписаться на Atom. Вот вроде бы и все, каналы установлены, ссылки
прописаны, что еще? А дальше, как в старой притче: “Чем дальше в лес – тем толще партизаны!”. Раз
каналы установлены, а установлены они явно не для красоты, а для использования, то в третьей
части своей саги я и поделюсь своими мыслями – как же использовать эти RSS и Atom – во благо
сайта! Название третьей публикации – Я Feed-ею!

   Речь сегодня пойдет о бесплатных блог-сервисах предоставляющих свои услуги по созданию и ведению своих дневников. На просторах всемирной их, на сегодняшний момент, огромное количество. Зачем создавать собственный сайт или блог, покупать доменное имя и платить за хостинг, который далеко не резиновый, когда как проще зарегистрироваться на одном из предлагаемых сервисов и “жить спокойно”. Все верно. Но, это прежде всего касается пользователя-обывателя, цели которого при посещении интернет весьма тривиальны. Потрепаться в форуме, написать какой либо пост, полазить по фотогалереям, ну, в таком духе. Внутренняя же составляющая всего этого процесса ему глубоко по “барабану”. По другому обстоят дела для тех, кто хочет использовать возможности сервисов не только на благо самих сервисов, но и на свои тоже. Тут по порядку. Какие же блага имеет сервис от пользователей регистрирующих свои блоги, тем более безплатно. Прежде всего это контент, все то, что пишется в дневниках. Больше пользователей – больше блогов; Больше блогов – больше контента; Больше контента – шире тематика; Шире тематика – чаще попадание по поисковым запросам. Тут можно продолжать эту цепочку дальше. Опять же возможность заключения договоров с рекламодателями на установку их рекламных блоков и соответственно получение определенного дохода. Как небольшое отвлечение, 300 млн. пользователей на сервисе Facebook, каковы же будут доходы от рекламных объявлений крутящихся на страницах пользователей? Правильно! Я тоже хочу 🙂

   Итак, пользователи, пишут заметки, добавляют фотографии, обмениваются ссылками, стоп! Вот как раз это нас больше всего и будет интересовать. Чем больше ссылок ведет на ваш ресурс, тем больше вероятность выдачи его поисковыми системами. Не на какой нибудь 100 странице поиска, до которой не доходят даже самые стойкие, а на, хотя бы первых пяти страницах. Причем, это касается как самих блогов, созданных на бесплатных площадках, так и автономных ресурсов: сайтов, порталов, тех же блогов. Используя старую поговорку: “Если гора не идет к юзеру, то юзер идет к горе”, что то типа того и будем делать мы. Будем регистрироваться на сервисах предлагающих подобные услуги и публикуя на них материалы ссылаться на оригиналы, представленные на собственном ресурсе, тем самым увеличивая “ссылочную массу”, проще говоря вес своего ресурса. И тут мы наступаем на грабли! Блог-сервис на котором мы создаем дневник, ну ни как не намерен делиться с нами. Получая пользователя и соответственно контент, взамен он не дает ни чего. Да, мы пишем какую либо заметку, делаем ссылку на материал, но, ссылка эта блокируется для поисковых роботов, многим известным способом – rel="nofollow", что в простонародии, не индексировать. Упс! И, что же делать в таком случае? А правильней всего будет удаление аккаунта с такого горе сервиса, безовсякого сожаления. Хотя, было бы правильней сначала посмотреть на код какого либо, уже имеющегося на этом сервисе блога, чтобы понять, стоит ли на нем регистрировать блог который будет ссылкой на основной наш ресурс. Помимо прямой вставки rel="nofollow", существует еще практика вырезания “всего лишнего” из самой ссылки, а это: alt, title, rel, item, при чем из самого текста заметки так же убираются все лишние кодовые дополнения. Только, что перечисленное является не чем иным как – микроформатами. Что это? смотрите в публикации – Микроформаты.

   С ссылками вроде разобрались. Но тут нам помимо упомянутых граблей ставят в дополнение противотанковые ежи, выполненные в форме robots.txt присутствующие наверно на каждом ресурсе. Что сие диво представляет из себя, а тоже что и блокировка ссылок, только блокирует сразу целыми директориями, ну как пример, пользовательская директория в которой и создаются дневники в файле robots выглядит приблизительно так: Disallow /users – И ППЦ!!! Выходит следующая картина, блог-сервис имеет все, юзер, впринципе ничего. Очень грамотно придумано, местами даже мудро. Пусть юзеро-боты паряться, а мы будем в топах. Вот такой корпоративный интернет получается. По большому счету альтернативы продвижения своего ресурса – нет! хотя в многочисленных форумах по прежнему кричат о повышении ссылочной массы, да еще и с высокопиаристых сайтов, что вообще уже абсурд. Почему так произошло, тут тоже гадать не приходится. Количество стандалон-сайтов за последние годы резко упало, большая часть “новых пользователей” занимают приготовленные для них социальные сети, которых нынче в достатке. Частные же сайты, не ринувшиеся в общий “социальный котел”, так же потихоньку притягивают к себе новыми революционными средствами: “Создай свою социальную сеть”… Установив на свой сайт наш код. что то вроде спутника, получается. Еще один не маловажный момент, весь контент находящийся на таком портале, принадлежит кому? Юзеру? Нееет! – Порталу. Система опять же проста – портал мой?, Мой. Значит и все что на нем – тож моё! В конечном, пользователь не имеет даже собственного контента, ну может чисто номинально.

   Что же все таки можно извлечь из такой “болотной” ситуации? Если только часть трафика, при следующих условиях: Блог находится в верхних позициях, или поппулярен, по другому; У пользователя блога много читателей-друзей, ну и сам материал должен быть интересен, чтобы на него шли. Правда на тиц-пр это не повлияет. Пройдя по множеству блогов, частных блогов, построенных на “собственных” движках, утыкаемся в подобную же картину – rel="nofallow", это уже болезнь какая то пошла. Да, да! знаю, делается для того что бы PR не утекал с сайта. По своему опыту скажу, у меня нет в блоге внешних ссылок, был ПР2, стал ПР1, и куда он утек, если течь ему не куда? Очередной миф.

   Внедрение новых технологий, WEB 2.0 WEB 3.0 – ток не у нас. У нас все сразу рубят. Попытки отдельных мастеров – капля в море. Вот так обстоит ситуация с блог-сервисами, на сегодняшний день.

   После создания сайта (публикация – Веб Дзайн) и проверки его ликвидности, попробуем еще не сколько расширить его универсальность!   Браузерная совместимость, дело, хлопотное, в особенности когда не всё необходимое находится “под рукой”. Как не крути, всегда чего нибудь не хватает, а хочется, чтобы сайт нормально смотрелся на большинстве расширений и большем количестве различных браузеров. Был более универсален, что так же влияет на размер аудитории посещающей твой сайт. Переключение монитора на разные разрешения, конечно можно, но вряд ли ваш монитор поддерживает все их возможные варианты. Да и загружать десятки браузеров вряд ли кто будет.Браузеры Походив по сети наткнулся на ресурс, который, как раз и предоставляет такие услуги, тестирует вашу страницу в различных браузерах и под разные разрешения экрана. Называется Check Browser (имеется русский язык), который и тестирует в 81-ой версии различных браузеров. Есть дополнительный выбор параметров внизу страницы. На выходе получаем лист со скриншотами вашей страницы, которые можно увеличить. Выбор разрешений от 640 до 1680, самый оптимал! Правда за один заход показывает скрины только одного разрешения, да и это уже хорошо. Касаемо текстовых бродилок, работающих в основном в Unix среде, результаты скорей всего не порадуют, но это уже для особо дотошных.

    Решил поэкспериментировать с трафиком, на вопрос быстрого привлечения аудитории. Так как тематика сайта узконаправленная и мало интересная для большинства пользователей интернет, то можно себе представить, что и заходов на сайт так же не бывает много. Общепринятые постулаты о размещении сайта в каталогах, регистрация в поисковиках, оптимизация сайта, вещь конечно, хорошая и правильная, но! Не дающая моментальных результатов – Долгострой одним словом. Так, побродив, подумав, решил произвести эксперимент. Так как вкладывать какие либо средства в раскрутку и тем более в покупку трафика у нас не планировалось, будем выкручиваться бесплатно, или точнее, почти бесплатно. Стечение обстоятельств этому предшествовало в лучшем своем ключе. Конец месяца – время выхода серии новых номеров глянцевых журналов, таких как FHM, XXL, MAXIM. Затратив на все удовольствие чуть более 200 рублей, мы получаем своего рода – Эксклюзивный материал! Здесь, я должен сделать необходимое отступление! Не кидайтесь сразу делать то же самое, сначала проверьте по тематическим сайтам – А не сделал ли это уже кто нибудь за вас. Если нет, то тогда советую поторопиться.

   Так вот. Купив и, разодрав журнал мы его сканим, аккуратно, без всяких изгибов, после чего судорожно начинаем верстать новые страницы дабы донести до жаждущих масс наше творение, а точнее свежие сканы наших знаменитостей. Почему судорожно? А вдруг в это же самое время, такой же шустрый Вася Пупкин делает то же и опередив тебя получит то на, что ты нацелен – трафик. Но, не волнуйтесь, мы успели первыми! После чего на одном из ресурсов данной тематики выкладываем линк на наши страницы с кратким, но завораживающим и манящим постом – Ведущая Муз ТВ Лера в новом номере XXL. После всех этих манипуляций быстро отскакиваем от компа. Зачем это? спросит читатель, А затем, что ща ливанет! После небольшого промежутка времени, где то с час, пытаемся зайти на свой сайт и сразу же чувствуем, что загрузка главной страницы идет как то не так – тормозит. При стандартной посещаемости в 100 хостов, на счетчике видим цифру 300, и все это происходит в начале рабочего дня, спустя еще несколько часов, 3 или 4, сервак начинает терять почву под ногами, просто падать. А на счетчике уже цифра 600. Не поленился и проследил окончание этого дня. Сравниваем, стандартное посещение сайта: 100/500 (хосты/просмотры), здесь же 995/3580. Разница, что говорить – в разы!

   В завершении могу сказать трафик будет держаться в течении 3-4 дней, конечно с постепенным снижением, но не резким. Это удовольствие можно было бы продлить и на большее время, но, мир не без добрых людей! И сканы были в срочном порядке Спи…ы на сайт Показуха.ру

P.S Если же кто то не успел, хотя это вряд ли, оригиналы сканов лежат здесь – Лера, Ляйсан Утяшева

   Целью сегодняшней передачи, будет проверка нашего творения, то есть сайта на “крутость”, и, для сего действа у нас имеется инструмент – Проверка качества сайта, в простонародии – CYS. Занимается этот онлайн сервис как раз этим блогородным занятием, проверкой наших с вами творений. С первого взгляда, вроде все нормально, есть программа, которая прогоняет сайт по определенным параметрам или “меркам” и выносит свой вердикт. Предлагая на выходе свою кнопку с результатом тестирования. Существует 4 градации результатов:

1. Золотой сайт
2. Серебрянный сайт
3. Бронзовый сайт
4. Без категории

   Если результат тестирования вас удовлетворяет, можно привесить себе кнопку показывающую серьезность вашего ресурса. Но, так ли радужен этот сервис, если поковыряться чуть глубже. И насколько правилен результат выдаваемый сервисом проверки? На примере своего блога, могу сказать, что на деле, сервис, скорее игрушка, чем серьезный инструмент. И чем это обоснованно? А все очень просто. После проверки блога сервисом, был выдан результат – 1375 балов, что соответствует статусу – Золотой сайт. Нужно упомянуть, что проверка проводится раз в два месяца. В прмежуток этого срока, каких либо влияний нарезультат вы не получите, даже при условии полного редизайна. Раз в 2 месяца! (к этому мы еще вернемся чуть позже). По истечении этого срока была проведена повторная проверка, показавшая результат – 740 балов, соответствующих “Бронзовому” сайту. Вот здесь встает первый вопрос – Это как так? Структура сайта не менялась, код сайта оптимизирован и прошел валидацию W3C без единой ошибки, в своем функционале блог использует последние технологии: HTML5, CSS3, так же прошедшие через валидатор и не имеющие ошибок. Новостные каналы RSS и ATOM. Исользуются микроформаты и микродата, а так же ряд других технологий, так же прошедших проверку на корректность кода. С этой стороны каких либо огрехов быть не может. Давайте посмотрим дизайн, да, не Репин, но, учтены предпочтительные расположения элементов интерфейса: шапка, меню, подвал и т.п. Исходя из всего выше сказанного, блог мог потерять позиции в рейтинге, переползя на более низшее место, но ни как не в качестве.

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

1. Код
2. Функциональность
3. Дизайн
4. Совместимость

   Для того чтобы было с чем сравнивать и, делать анализ, “скармливаем” сервису двух подопытных, например Yandex и Google. После прохождения ими теста, можно сравнить показатели как 4 основных составляющих теста, так и соответствие сайта статусу. Тыкаем на картинку и смотрим.

   Показатели всех 4 тестов, у блога, выше чем у испытуемых, но вот результат соответствия, почему то обратный. Прогоним наших подопытных через W3C валидатор. Получаем сследующие результаты: Яндекс – 35 Errors, 8 warning(s), HTML 4.01 Transitional; Google – 38 Errors, 1 warning(s) HTML5. Что тут можно сказать? кодовая часть столпов Рунета “дала течь”. При условиях, что за этим следит не один человек. Как расчитывалась совместимость, тут трудно понять. Есть так же сервис занимающийся этим вопросом, о нем я писал в одной из своих статей, так вот, количество поддерживающих браузеров одинаково. Показатель функциональности, понятие сильно растяжимое, даже если визуально ставнить Яндекс и Google, совершенно разные интерфейсы, минимализм со стороны Google и попытка впихнуть максимум инфы в страницу – у Яндекс. Тоже можно сказать и о дизайне последних.

   Не остановившись на достигнутых результатах, посмотрим, а кто занимает первые места в каталоге “Качества” по рейтингу CYS. 1 место с рейтингом в 1681 балл, занимают юристы. Как и предыдущие испытуемые отправлен под “каток” W3C, и, О! ЧУДО! – 163 Errors, 68 warning(s) XHTML 1.0 Transitional. Дальнейшие рассуждения и “пытки” не имеют смысла. Упоминаемое мной тестирование 1 раз в 2 месяца можно обойти. Это прежде всего касается того, кто все же попытается поднять свой рейтинг в этой системе. Смысл очень прост, создаете на своем хосте папку, “сливаете” туда все, что необходимо, тестируемый файл переименовываете в index (если еще не сделали) и, перед каждым новым тестом переименовываете созданную папку, таким образом движок будет воспринимать этот файл, каждый раз, как новый. Успехов!!!

   Что может дать нам html5, В качестве инструмента для Веб дизайна, текущие возможности, итак. То, что блог построен на html5, это не новость, вот как продвигаются дела в этом направлении, об этом хочу рассказать на основе личного опыта. По обыкновению, перелопатив кучу сайтов и блогов, включая саму спецификацию W3C, приходим к неутешительным, на текущий момент выводам, дело движется с огромным скрипом. Да, не буду спорить, что до официального принятия стандарта HTML5 еще пройдет не мало времени, но не это сподвигло на написание этой заметки. Основным толчком стала информация о поддержке нового стандарта современными браузерами. По множественным заявлениям, как на наших сайтах, так и на забугорных, идут дискуссии о поддержки многих новых тегов, вводимых в пятом HTML. В особом фаворе оказалось обсуждение тегов <video>…</video> и <audio>…</audio>. “Многие современные браузеры имеют поддержку этих тегов, бла бла бла…”, на поверку же видео можно просматривать только в Firefox 3.2-3.6 версий, ну еще в Opera 10.5pre alfa (без звука). Вроде бы Opera уже ввела подержку в версии 9.6 но потом почему то эта поддержка исчезла? Новомодные Chrom, Chromium, Safari(win) не поддерживают видео.

   Во что же уперлись наши вилы? А уперлись они в форматы которые должны будут использовать видео и аудио. Часть форматов, из вроде бы “фришных”, вдруг, оказывается под какой то лицензией. К слову, их, этих лицензий расплодилось на сегодняшний день не меряно!. Кто то предлагает кодек H264, кто то радеет за ogg vorbis + ogg theora. К общему соглашению пока не пришли. На многих ресурсах “радостно” собщается, что примеры видео в HTML5 формате мы можем посмотреть перейдя по ссылке. Переходим и видим, что видео действительно есть и действительно показывает. И, народ радуется! УРА! Вопрос? В код кто нибудь заглядывал? Какой там HTML5 на самом деле. Ах, да, забыл. Для этого нужно быть специалистом. Так вот, код то там с тегами <video>…</video> присутствует, но окружен таким JAVA наворотом, что страшно смотреть. Не предусматривает HTML5 дополнительных ява примочек для проигрывания видео, нету такого. С таким кодом не стоит вообще замарачивать на пятом хтмл-е. Поставь себе flash-плеер и живи спокойно.

   По уже укоренившейся традиции разработчики тянут “одеяло”, каждый на себя. Им плевать глубоко на юзера и его амбиции, вместе взятые. По прежнему большую часть сегмента браузеров держит IE, с теми же криками о поддержке новых стандартов. Где?, Что где?. Где новые стандарты? Может достаточно лить в уши. Либо юзер окончательно отупел? Ну, да ладно. Вернемся к стандартам. Из новых возможностей можно отметить возможности:

1. скругления углов
2. отбрасывание блоками теней
3. линейный градиент заливки бекграунда
4. радиальный градиент заливки
5. многоколоночность (без использования div-ов и таблиц)
6. использование нескольких фоновых изображений (на мой взгляд, достаточно спорная возможность)
7. градиент текста и многое другое

   И все вышеперечисленное – пустые слова. Не, не, не! Не нужно утверждать, что все это прекрасно пашет, если добавить префикс. Для FF, скажем -moz-. Да. Сразу оживает фоновое изображение залитое градиентом, блоки приподнимаютя над основным фоном, за счет отбрасываемых теней, формы обнаруживают наличие новых возможностей. Красотища! Вот только Валидатор, такую щтуку не съест. Вернее съест, но только на половину. Он радостно сообщит об отсутствии ошибок в html-коде, и, выплюнет ваш CSS3 (а я уверен, что третий) с ошибками, в которых главным багом окажется тот самый префикс, делающий все так красиво. Так, что этот хак тут не прокатывает.

   Что же действительно проходит валидацию, а соответственно может быть использовано для перехода на HTML5? Могу только сказать, что использовал сам. Прежде всего – разметка. Верхняя часть (<header>…</header>), для основного меню используются теги – <nav>…</nav>, низ страницы, так называемый – “подвал”, теперь обозначаются как <footer>…</footer>, а так же, зарезервировал одну колонку на случай размещения какой либо дополнительной информации – <aside>…</aside> (кстати, для этих целей тег и предназначен). Для разметки контента используются, так же, новые элементы: <article>…</article> и <section>…</section>. Первый, как видно из названия, отвечает за контент (статья, заметка, публикация, etc…), вторая, за какую либо часть этого контента. Что интересно?! Порядок вложенности этих тегов проходит валидацию, т.е:

в статье может быть несколько секций, и, в секции несколько, скажем однотипных или тематических публикаций. Еще одним из новых тегов можно считать дату: <time datatime=”2010-02-02T22.56.40″>02.02.2010</time>. К чему это нужно?, не знаю, думаю, все же разработчики стандарта не самые тупые, раз ввели дату отдельным тегом. Возможно так же использование тега <figure>, целесообразно использовать который к какому либо блоку, ну, как пример:

Код: <figure> <img src=”/” width=”” height=”” alt=”” title=”” > Текст и соответствующая тексту картинка </figure>

Сам пример: Текст и соответствующая тексту картинка, расцениваются не как разные элементы, а как общий блок, несущий определенную информацию. СЕО – дружно хлопаем! И идем регится на CNN.COM! (Шутка). При использовании вместе с DIV-ами и правильным позицированием, из таких небольших блочков, можно собрать, очень даже неплохую страницу. Предварительно, присвоив дивам нужные размеры, посредством потрошения CSS.

   Еще одним из нововведений можно считать тег – <dialog>, выглядит это так:

Код:

<dialog>
<dt>
Вопрос
</dt>
<dd>
Ответ
</dd>
</dialog>

   Есть правда в этом не большой нюанс. Не стоит вкладывать тег <dialog> между тегами <p> и <section> – Не валидно выйдет. Почему так? Ну, не знаю. Вот те теги, которые прошли поверку валидацией, и на которых уже можно, что то строить. Вообще, суть новой спецификации HTML5 склоняется в сторону улучшения семантики кода. Прежде всего, для его лучшего распознования всевозможными роботами. Разметка отдельно, текста отдельно, картинки отдельно, ну и в таком ключе далее. Правда, как уже было где то упомянуто, СЕО-шникам дается флаг в руки, дабы появляются новые возможности, опирающиеся на эту самую семантику.

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

   Представленное видео имеет формат: ogg theora(видео) и ogg vorbis(аудио). На этом, конечно теги не заканчиваются,и полная информация по ним всегда доступна на W3C. Да и семантические “трюки” с появлением HTML5, так же не заканчиваются. А что еще то? А еще есть такое понятие как Микроформаты, о чем и будет поведано в следующей публикации.

   После очередных копаний с xhtml и некоторыми сложностями со вставками файлов, как по аналогии с обычным html – xhtml не хочет признавать SSI include-ов, а отсюда возникает и целая цепь неудобств.

   Да, разработчики позаботились, конечно о замене этого элемента на типа-аналог object, или, iframe – при фреймововом DOCTYPE-е. Но при той задаче они не удовлетворяют оба тем требованиям, которые планировались. А планировалось, автоматически растягивать страницы сайта на то разрешение под которым сидит пользователь.

   Новость о разработке и первых официальных спецификациях HTML5 попалась, как раз кстати. Хотя официальная спецификация планируется на 2010-12 года, тем не менее часть ново введений уже работает сейчас. Как написано в одном из блогов, что firefox поддерживает тэги из новой спецификации html5, такие как: video и audio, аж с версии 1.5 правда сам еще не добрался до этого, что бы самому проверить. Из различных источников выясняется, что xhtml и html5 – две отдельно развивающиеся ветки, обе спецификации имеют элементы не поддерживаемые друг другом, но на мой взгляд html5, все же более гибкая к запросам разработчиков чем xhtml. Плюсами html5 можно назвать обратную совместимость как с обычным html, так и с xhtml.

   На собственном опыте скажу, что перевести страницу из формата html в html5 намного легче, чем тоже самое в xhtml (да еще в Strict!). Есть мнение, что, мол сорвалась попытка научить веб мастера писать чистый (валидный код), это про спецификацию html5, но тут зависит все только от самого веб мастера. В качестве теста можно погонять в W3C Валидаторе сайты сделанные и выдаваемые как xhtml Strict. Большинство будет Strict-ом только по Доктайпу, с сотней ошибок и предупреждений, вот и все обучение чистоте кода.

   Возможно, в лучшую сторону, сработают новые теги, такие как: <nav>, <header>, <footer>, <article>, <aside> , <video> , <audio>… основываясь на новом анализе разбора страниц.

   Особенно порадовал Доктайп используемый в html5 – <!DOCTYPE html>, и это в сравнении с xhtml-ными doctype-ами! Насколько верно? Но так же с введением html5 планируется прикрутить к нему и CSS3, а в остальном как обычно: разметка страницы, отдельно вынесены все стили, ну, и сам контент. На некоторых сайтах и блоках при просмотре кода уже появляются доктайпы вида: <!DOCTYPE html>, опять же работает тестовая версия валидатора от W3C проверяющая валидность новоиспеченных html5 страниц. Ну вот, вроде все функционирует как и положено, что дальше? Дальше – сайт есть, а вот посетителей на нем практическое отсутствие! Будем привлекать посетителей на свой ресурс, следущая публикация покажет один из возможных способов привлечения трафика на свой сайт – Head and Shoulders – Два в Одном

   При создании сайта, не плохо было бы учесть такую технологию как Микроформаты. Как было обещано в предыдущей публикации Новости HTML5, сегодня речь пойдет о них самых. Прежде всего, для чего они нужны? Все для той же семантики. Помимо всего прочего, это еще и поможет нам в дальнейшем продвижении сайта. Не знаю, очередная ли это мода, как когда то была фреймовая структура. Фреймы использовали все, ну, или практически все. Или же действительно основные “киты” web-индустрии ставят на семантический анализ и разбор интернет ресурсов. Тут точно сказать нельзя. По крайней мере, это есть и обходить это мы не намерены, при том, что есть полезные возможности у этих микроформатов (microformats). Еще чуть отступлю, упомянув, что не так много на сегодняшний день, существует этих форматов. Итак. Чем могут пригодится нам уже имеющиеся микроформаты. Стоит начать, наверное, с самого излюбленного, это с ссылок. Обычная ссылка выглядит так –

<a href=”/bloger/http://www.sait.ru”>Ссылка на страницу</a>.

Использование микроформатов

   Это всем известно. Но, далеко не всем известно, что информация содержащаяся между тегами <a>…</a> поисковым роботам по “барабану”, они внесут, конечно в базу эту надпись, но строго отнести к чему то тематически вряд ли смогут. Другое дело если мы добавим к ссылке title, в этом случае ссылка будет выглядеть –

<a href=”/bloger/http://www.sait.ru” title=”микроформат”>Ссылка на страницу</a>.

   А, что дает нам этот title в ссылке? Могу задать встречный вопрос, а, что дает title в заголовке нашей страницы, думаю, тут вопросы отпадают. И при чем тут микроформаты, это же просто title. Вот, как раз title и является одним из микроформатов. Теперь тут все ясно. Что еще можно проделать с нашей сылкой? Можно. И думаю даже нужно. Добавим к нашей ссылке еще один известный, но не всеми познанный атрибут – rel. Встречается он часто и практически присутствует на каждой странице веб-документа. Помимо заголовка страницы, его с тем же успехом можно применять и к любой другой ссылке. Добавим его к нашей ссылке, и получим следующее –

<a rel=”tag” href=”/bloger/http://www.sait.ru” title=”микроформат”>Ссылка на страницу</a>.

   Значением же, в данном примере, является “tag”. Что это дает? А дает это целевую направленность или метку на метаинформацию содержащуюся в самой ссылке, тот же title. Таким образом, помимо метаданных, в заголовке страницы, мы можем добавлять метаданные используя ссылки. Плюс ко всему и ссылка уже может быть отнесена к какой либо теме. В качестве отступления скажу, что крупные поисковые системы, такие, как Yahoo и Google, заняты составлением словарей, ориентированных, как раз на распознавание этих метаданных. Теперь дальше. У атрибута rel, значением может быть не только – “tag”, но и ряд других. Как пример, можно привести документ размещенный на нескольких страницах.В обычном виде каждая страница будет рассмотрена как отдельный документ, но, если мы добавим значение “next” или “prev”, в зависимости от ситуации, то получим семантическую связь между страницами одного документа. Будет это выглядеть так –

<a rel=”prev” href=”/bloger/http://www.sait.ru” title=”микроформат”>Предыдущая страница</a>.
<a rel=”next” href=”/bloger/http://www.sait.ru” title=”микроформат”>Следующая страница</a>.

   Тут уже “на лицо” вся польза использования этих микроформатов. Но, этим параметр rel не ограничивается. Есть и другие значения. Опять же как пример, параметр “vote”, который может быть использован в 3-х вариантах: “vote-for” и “vote-abstain” и “vote-against”. Эти значения говорят об отношении к какой либо странице. Допустим вы ссылаетесь на материал стороннего сайта и хотите выразить свое отношение к этому ресурсу. Здесь и применимо эти 3 варианта: 1. За 2. Безразлично (нейтральное) 3. Отрицательное. Можно еще расценить это как своеобразное голосование. Как это может повлиять? Прежде всего влияние может быть оказано на вес страницы, на которою ведут подобные ссылки, причем как в плюс, так и в минус. И как пример такой ссылки –

<a rel=”vote-for” href=”/bloger/http://www.sait.ru” title=”микроформат”>Ссылка на страницу</a>.

   В примере я выразил положительное впечатление от посещения сайта (страницы). Предыдущие примеры не так часто используются, по крайней мере основной массой пользователей имеющих свои сайты, блоги и пр. Другой вариан, до боли знакомый многим, это – rel=”nofollow” и куча копий сломанных в обсуждении целесообразности использования. Основное же значение атрибута – запрет индексации поисковыми роботами. Так вот просто. Другой вариант как это записыватся, тут есть небольшая хитрость. Пример –

<a href=”/bloger/http://www.sait.ru” rel=”nofollow” title=”микроформат”>Ссылка на страницу</a>.

   То есть в данном примере, юзер использующий nofollow уверен, что защитил свою ссылку от индексации и, радостно пошел наливать себе чашечку кофе. Не тут то было. Робот, считывает код страницы не “рендомом”, а последовательно, линейно или плоско (кому как нравится). Так дойдя до вашей ссылке он ее спокойно “кушает” и то, что после – стоит nofollow, его это ни как не расстраивает. Другой вариант, когда добавляешь в “нужное время в нужное место”, тогда и робот дойдя до ссылки, первым делом “тыкается лбом” в rel=”nofollow” и дальше уже не идет, т.е сслка остается действительно закрыта. Пример –

<a rel=”nofollow” href=”/bloger/http://www.sait.ru” title=”микроформат”>Ссылка на страницу</a>.

   С этим вроде разобрались и можно идти дальше в Использовании микроформатов. Многие параметры атрибута говорят сами за себя, так приведу сразу несколько форматов говорящих о значении ссылки, ее отношении, если правильнее сказать:

• rel=”home”(домашняя страница);
• rel=”copyright”(авторство);
• rel=”license”(лицензия);
• rel=”start”(Главная);
• rel=”adr”(адрес);
• rel=”geo”(местоположение),

   Конечно я привел не полный перечень, но тот который можно использовать уже сейчас. К чему же склоняются микроформаты? По семантике близко к xml, но в варианте HTML. При условии исполнения сайта на HTML5 (4.01) этот вариант думаю предпочтительней, при использовании же XHTML есть спецификация RDF которая так же описывает использование микроформатов, только с более сложной структурой. В завершении “разбора полетов” со ссылками, хочу привести пример микроформата, уже к ссылкам не относящийся, но на мой взгляд достаточно полезный. Это дата. Выглядит это следующим образом –

<time datetime=”2010-02-11T01:15:10″>11.02.2010</time>

   Приведенный микроформат относится к новой спецификации HTML5, который не малую роль отдает использованию микроформатов. Объем который может достигнуть не одну сотню. Причем уже в совокупности с основной разметкой. Посвоему вешь, тоже полезная, показывает дату публикации в понятном для поисковых механизмов формате. Но и свои минусы тоже существуют. При копировании материала, ни чего не стоит скопировать вместе с датой и соответственно, первенство данной публикации рушится. Да и дату на более раннюю поменять, так же не составит ни какого труда, еще и в плагиаторы попадешь. Тут только один выход не выставлять между тегов саму дату, при этом оставив сами теги. Робот проходя по коду страницы, сможет видеть дату, а пользователь попадая на страницу не увидит этой строчки. Копаться же в коде, далеко не каждый станет.

   Эта публикация затронула лишь микроформаты применяемые к ссылкам, на деле же это не единственный элемент разметки который почтили своим вниманием микроформаты. В следующей статье, я расскажу о других элементах разметки, таких как: <img> hcard hcalendar hreview xfn, а также классах использующихся в микроформатах.

“Теперь вы можете нежиться под жарким солнцем на забытом богом острове или покорять вершины Гималаев и быть в курсе всех событий на работе. С новым Nokia Е75 вам больше не нужно дожидаться загрузки ПК, чтобы добраться до полноценной элек­тронной почты. В Nokia Е75 настроить личную и рабочую почту очень просто, достаточно ввести логин и пароль от своего ящика. А компактная QWЕRТУ-клавиатура поможет отвечать на элек­тронную почту максимально комфортно и быстро!”

   Такая вот рекламка, попалась, при просмотре майского номера журнала OK. На мой взгляд делать упор на возможность снятия почты не совсем правильно. Тем более, большинство моделей сотовых телефонов, даже классом ниже, могут делать тоже самое и с тем же успехом. Вот наличие QWЕRТУ-клавиатуры уже меняет дело и само отношение к модели. Давайте подробней рассмотрим возможности этой модели. Прежде всего это смартфон, а значит подразумевает под собой наличие операционной системы. Оснащен Nokia Е75 2,4-дюймовым QVGA-экраном (320 х 240 точек), как и было заявлено ранее – 3,2 мегпиксельной камерой, Wi-Fi, Bluetooth, 3,5-мм аудиоразъемом, слотом microSDHC. Ну тут вроде все стандартно. Позицируется модель как бизнес класса, для деловых людей. Но как кто то уже говорил, рамки давно размыты. Да и каких то преимуществ он не имеет, за исключением наверно – клавиатуры. Вес трубки достаточно тяжелый – 159 грамм, но тут нсть и свои плюсы. Многие части телефона стальные, включая заднюю крышку. Еще из плюсов можно назвать производительность аккумуляторной батареи телефона, стало быть работа без под зарядки увеличится. Стоимость телефона заявлена порядка 20 000 рублей. Тут конечно не кисло, это я про цену! Для желающих обновить свой старый телефон, на “бизнес вариант” могут уже сейчас, так как он начал появляться на прилавках магазинов.

Смартфон Асег F900

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

“Вот разбуди вас ночью в палатке по­ среди тундры и спроси: “А каковы про­гнозы по росту цен на свинину в гряду­щем квартале?” Так ведь ответите! И только потом вскрикнете: “Кто здесь?!” А все потому, что дотянуться при малейшем затруднении до смартфона Асег F900 и выйти через него в интернет, заодно проверив почту, быстро становится рефлексом. Столь же безусловным, как и функциональная напол­ненность этого устрой­ства из первой линейки смартфонов Асег. И ин­туитивно понятный интерфейс, 3,8-дюймо­вый WVGA дисплей, сен­сорная клавиатура, GРS-модуль, FМ-радио, диктофон, слот для карт памяти, 3,2-мега­ пиксельная камера ­ что еще нужно чело­веку чтобы достойно встретить…”

   Да, что все на почте то помешались! Как будто главным достоинством смартфонов является именно эта фича. Если же говорить о самом смартфоне, то первым подкупает размер экрана и его разрешение – 480 x 800 пикселей. В минус бы поставил сенсорную клавиатуру, хотя здесь скорей зависит от владельца и обращения со смартфоном. Тип корпуса аппарата классический, поддержка ставшего уже дефолтовым MIDP 2.0, тоесть ява-приложений. В стандартный “набор” входят mp3 плеер, FM-радио. Оснащен 3,15 Мп камерой с возможностью использовать вспышку и снимать видео, конечно же поддерживает HTML и WAP. Что порадовало, это уже установленный офисный пакет: Pocket Office (Word, Excel, PowerPoint, OneNote, PDF viewer). На чем работает эта машинка? А достаточно не плохой обвес – процессор: Samsung S3C 6410 mobile processor (533 МГц); карты памяти microSD (TransFlash). Поддержка кирилических шрифтов – присутствует. тоесть пишем по русски безо всяких проблем и патчей. Что еще может заинтерисовать? Может! Например встроенный GPS приемник ((SiRFstar III), 3G HSDPA 7.2 мбит/с, WLAN 802.11 b/g). Связь с ПК происходит 2-мя способами: Wi-Fi и USB, что вполне достаточно. Работает эта игрушка под управлением Microsoft Windows Mobile 6.1 Professional. Вес порядка 150 грамм. А вот цены на эту модель я не нашел, видимо еще нет. А следующим будет обзор моделей Samsung