Атрибуты next и prev от Google

8 комментариев

Директивы next и prev от GoogleНе так давно специалисты компании Google выдали вебмастерам инструмент для обеспечения более правильной индексации их сайтов своей поисковой системой — атрибут rel="canonical", указывающий на дублирующийся контент.

Теперь они добавили ещё пару атрибутов, которые должны обеспечить более правильное понимание поисковой системой материалов, разделённых на страницы — это атрибуты rel="prev" и rel="next" .

Работает это следующим образом: в head-блоке страницы прописывается тег link с атрибутами rel и href. Первый атрибут принимает значение prev или next, а второй содержит ссылку на предыдущую или следующую страницу соответственно.

Например, записи в этом блоге выводятся на главной странице и их вывод разделяется постранично. Первая страница — zhilinsky.ru, вторая — zhilinsky.ru/page/2/, и так далее. Для первой страницы конструкция будет выглядеть следующим образом:

<link rel="next" href="https://zhilinsky.ru/page/2/" />

Поскольку страница первая в списке, предыдущая страница не указывается (а у последней страницы не будет указана следующая). У второй страницы будут присутствовать уже оба атрибута:

<link rel="prev" href="https://zhilinsky.ru/" />
<link rel="next" href="https://zhilinsky.ru/page/3/" />

  • Значения атрибута href могут представлять из себя как относительные, так и абсолютные пути.
  • Если на странице объявлен тег base, то адреса можно указывать относительно его атрибута href.
  • Разрешено использование значения rel="previous" как альтернативы rel="prev".

Если вы в чём-то ошибётесь при верстке этих атрибутов, то катастрофы не случится — Google просто проиндексирует ваши страницы, используя свои обычные алгоритмы.



HTML5 Camp: завтра

7 комментариев

Завтра с утра и до вечера в Москве будет проходить довольно интересное мероприятие — HTML5 Camp под эгидой Microsoft. Регистрация на мероприятие, конечно, давно закрыта, но организаторы обещают онлайн-трансляцию, которая начнётся завтра (17 февраля) в 10:00. Регистрация для просмотра трансляции не требуется.

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

HTML5 Сamp

«Make Web Not War» — призывает Microsoft, хотя и не упускает ни малейшей возможности порекламировать очередную версию своего недобраузера. Теперь в него добавили бесполезную, но «принципиально новую» функцию.

Программа мероприятия:

  • 10:00 — Открытие: A More Beautiful web (Microsoft)
  • 11:00 — Современный подход к веб-стандартам (К. Кичинский, Microsoft)
  • 12:00 — Погружение в HTML5 (Г. Магдануров, Microsoft)
  • 14:00 — Динамическая графика: Canvas и SVG (В. Макеев, Opera Software)
  • 14:35 — Карты и SVG (Ф. Голубев, Яндекс)
  • 15:15 — Разработка игр в HTML5 (Н. Котляров, JoyBits Ltd)
  • 15:50 — Как стать ближе к пользователям с IE9 (Б. Бринза, Microsoft)
  • 16:50 — Эволюция JavaScript: ES5.0 (И. Кантор, JavaScript.ru)
  • 17:40 — Как померить скорость веба (Н. Мациевский, WEBO Software)
  • 18:20 — Кружок вышивания HTML5 JavaScript`ом (Р. Рождественский, Яндекс; В. Баум, Microsoft)

Посмотрим, послушаем, интересно же.



Таблицы: красиво и удобно.

15 комментариев

Что-то давно я не писал ничего, исправляюсь. Эта запись будет скорее в стиле «чтобы самому не забыть». Когда-то давно один читатель меня просил сделать произвольную сортировку в таблице, которая рисуется средствами PHP. Бегло просмотрев функции работы с массивами, я понял, что определённо должен быть способ проще. Так и вышло ©.

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

Поиск такого скрипта (а зачем писать если можно найти?) показал, что их десятки, и многие по навороченности напоминают центр управления космическими полётами, например – соответствующие плагины Tablesorter для JQuery, Phatfusion sortable и Mootable sorting для mootools, Datatables для YUI и TableKit для Prototype.

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

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

Unobtrusive Table Sort Standartista
Unobtrusive Table Sort Standartista


1. Unobtrusive table sort — это мой выбор, я использовал его в выводе результатов работы скрипта для проверки тИЦ и PR.

Этот скрипт умеет сортировать цифры, строки, правильно сортировать даты, размеры файлов и прочее, подсвечивать чётные строки таблиц цветом, а так же делить содержимое больших таблиц на страницы.

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

2. Standartista — очень похожий скрипт, но со своими особенностями. Он умеет сортировать IP-адреса, валюты, числа, текст и даты, а главная его фишка в том, что он сам умеет эти типы данных угадывать, не требуя пояснений.

Жилинский Владимир.



CSS Naked Day`09.

10 комментариев

CSS Naked Day 2009Сегодня (9 апреля)  проходит ежегодная акция «CSS Naked Day». Суть её с прошлого года не изменилась — это один день без CSS на сайтах с целью популяризации и продвижения единых веб-стандартов.

Не знаю (хотя догадываюсь), насколько ежегодное отключение CSS помогает улучшить ситуацию с версткой и соблюдением её стандартов разработчиками браузеров, но присоединяюсь — это забавно :-)

Жилинский Владимир.



Диалог: верстка и прогресс.

21 комментарий

Блочная верстка Этот пост не совсем обычный — большая его часть написана не мной. Эти мысли прислал мне Владимир «Bolzamo» Большаков, я их только немного откорректировал и добавил свои комментарии. Итак, читаем.

В наши дни web-разработка уже совсем не та, что была в 90-х, а еще через пару лет она изменится ещё больше. На дворе XXI век, и Web 2.0 принёс нам XHTML, Ajax, микроформаты, OpenID, RSS и прочие вкусности.
То, что раньше “лепилось вслепую”, теперь уже перерабатывается, проходит стандартизации и спецификации. Это касается и web-технологий, в частности — языков разметки и описания web-интерфейсов: HTML и CSS, о которых и пойдет речь.

Жилинский: А что 90-е? Я в ВГТУ получал сертификат по web-программированию в 2001 году — нам тогда давали PHP3 и говорили, что «некоторые веб-мастера уже иногда используют для верстки DIV-блоки с абсолютным позиционированием, но полностью сделать страницу на них невозможно.»

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

Будучи web-программистом, и ходя большей частью по сайтам таких же гиков и фанатов развития новых технологий, иногда начинаешь считать, что весь web красив и продвинут, что Web 2.0 прочно вошел в нашу жизнь, что красивый ненавязчивый дизайн (разработанный согласно требованиям юзабилити) и блочная семантическая верстка — это обыденность, это нормально…

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

Сколько их, этих ресурсов, построенных на табличной верстке, в коде которой сломаешь обе ноги, руку и голову? Чья кодировка — windows-1251, перенос строки формата — cr/lf, а у некоторых в еще и <META NAME=”Generator” CONTENT=”FrontPage 4.0″>…

Жилинский: Много. Очень много. Даже в корпоративном сегменте, не говоря уже про Юкоз, Народ и леса сателлитов...

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

Почему HTML изучают с таблиц? Элементарно! Потому что в учебниках написано изучать HTML с таблиц. Все учебники, самоучители и методические пособия вышли в далеких 90х годах, когда CSS рассматривался, разве что, как средство выставить шрифты и расцветку сразу для всего сайта. И слыхом никто не слыхивал о разделении контента и представления.

Есть, конечно, и новые учебники. Полистал недавно парочку… Нашел в них перепечатку старых. Только версия FrontPage поменялась и добавилось пара глав о CSS и блочной верстке. Почему-то авторы этих учебников ни разу не задумываются о том, что, чтобы научить человека чему-то хорошему, надо для начала не учить его плохому.

Кто не согласен с тем, что табличная верстка — это плохо? Почитайте спецификацию: тег table предназначен для представления табличных данных, равно как микроскоп предназначен для изучения микроскопических объектов, а не для забивания гвоздей.

Как-то я разговорился на эту тему с одним программистом, который иногда зарабатывает созданием простеньких сайтов на заказ для местных организаций. Сайты делает просто удивительные: верстка табличная, картинки увесистые, скрипты самописные, ЧПУ даже и не пахло. На все мои увещевания, что это неправильно, что надо стремиться к лучшему, он просто ответил, что веб никогда не был и не будет правильным. Что HTML — это куча мусора, к которой добавили еще одну кучу мусора — CSS, и теперь пытаются присобачить третью кучу мусора, называя ее стандартами веб-разработки. Классная формулировка, которая для многих может показаться вполне резонным оправданием, чтобы продолжать забивать интернет этим самым мусором. А какая разница? Заказчик ничего в этом не смыслит, ему красиво — он доволен.

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

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

1. Делаем, как привыкли. Уже научились верстать в таблицах, кажется очень сложным изучать все тонкости и хитросплетения CSS, вдумываться в структуру документа, воевать с багами IE, чтобы достичь кросс-браузерности. На самом деле, блочная верстка куда проще и логичнее, просто сначала стоит изучить вопрос.

2. Заказчику всё равно. Заказчик хочет отдать деньги и увидеть сайт, похожий на картинку, чтобы было очень красиво и иногда еще и понятно написано.

Жилинский: Кстати, полезное дело делает компания Opera Software — парни организуют семинары в городах СНГ в рамках программы поддержки высшего образования Opera Education Program. Прочитать об этом можно в их блоге.

Жилинский Владимир и Большаков «Bolzamo» Владимир




© 2007-2010 Блог интернет-разработчика, автор — Zhilinsky.ru.
При использовании информации ссылка на источник обязательна.