Archive for the “Web Development” Category

И грядёт эра Web 3.0 — эра межсайтовых взаимодействий,
и основана она будет на трёх китах: OpenID, OAuth и oEmbed
(Кристиан Арчеронострадамус)

В отличие от двух других, OpenID в представлении почти не нуждается. Это паспорт “я такой-то с такого-то сервера”. Сайт запрашивает у сервера авторизации подтверждение, типа, скажи мне myopenid.com, этот ко мне стучится правда vasya_pupkin? Дальше мы его узнаём и пускаем как родного — за него поручились.

OAuth чуть хитрее. Я с ним особо не сталкивался и в дневнике не упоминал. OAuth — это средство авторизованного доступа к API. Что это, с чем его едят, кому это надо и почему это не OpenID неплохо описано в статье на Хабре

И вот мы вплотную подошли к oEmbed Это очень молодой и возможно даже не до конца проработанный стандарт, но дико удобный и полезный… будет, когда широко распространится. Признаюсь, узнал я о нём буквально на днях.

Функциональность его не нова — мы и ранее вставляли картинки тегами <img>, видео хтоническими конструкциями из <object>, <embed>, флешем, джавой и даже новыми средствами html5, но это каждый сервис извращался во-своему, плееры обновлялись, постоянные ссылки на странички не подкреплялись постоянными ссылками на картинки на них.

oEmbed унифицирует вставки произвольного кода в страницу при помощи достаточно простого API.

Выглядит это так:

Всё предельно просто, кроме того куда нам слать GET-запрос =)
Адрес для GET-запроса хранится на самой странице, кусок которой мы хотим внедрить в виде тегов
с атрибутами type=”application/json+oembed” или type=”application/xml+oembed”

Типы вставляемых элементов:

  • photo — изображение. Например, с сервиса Flickr. Результат по идее скармливается тегу<img>
  • video — видео, а возможно и аудио. Поддерживается Google Video и YouTube
  • link — ссылка на документ. Допускается краткое (да и полное) содержимое, хотя отображение текста зависит скорее от желания приёмника. WordPress, например, отображает только заголовок, а вот сервис микроблогов identi.ca показывает предпросмотр. Именно линки создаёт плагин oEmbed Provider для WordPress, о котором в следующей мессаге
  • rich — просто вставка куска текста =)

Подробная (и, кстати, небольшая совсем) инструкция на буржуйском есть на официальном сайте http://www.oembed.com/ (хотя там всё равно без 100 грамм не разберешься…)

Ну и на закусь пример:

Avatars – Homeworld/Homeworld: Cataclysm

hw_ambassador_kush.gif
hw_ambassador_taii.gif
hw_bentusi.gif
hw_emperor.gif
hw_fleet_kush.gif
hw ambassador kush
hw ambassador taii
hw bentusi
hw emperor
hw fleet kush
hw_fleet_taii.gif
hw_kadesh.gif
hw_kapella_kush.gif
hw_kapella_taii.gif
hw_kharselim.gif
hw fleet taii
hw kadesh
hw kapella kush
hw kapella taii
hw kharselim

[далее]

Ссылка на какую-нибудь из коллекций в моей галерее аватарок выводит первые 10 штук, заголовок и ссылку на галерею целиком.

Comments No Comments »

Выдалось немного времени на расследование дела о пропавших градиентах.

В общем, произошло логичное упрощение синтаксиса в Firefox 3.6 beta 2 и одновременно в транке других геккобраузеров (в т.ч. снапшотах Firefox 3.7)

-moz-linear-gradient(top, bottom, from(#006699), to(#2A90C3));
стало
-moz-linear-gradient(top, #006699, #2A90C3);

Кто скажет, что стало нелогичнее и непонятнее, пусть первым бросит в меня камень убьётся камнем. Ну и это всяко лучше, чем
background-image: -webkit-gradient(linear, left top, left bottom,color-stop(0.00, #006699),color-stop(1.00, #2A90C3));

Подробности синтаксиса на сайте мозиллы:
https://developer.mozilla.org/en/CSS/-moz-linear-gradient

Tags: , ,

Comments No Comments »

Судя по ухудшившемуся виду home.sunchaser.info, мозилловцы изменили синтаксис -moz-???-gradient. Синтаксис webkit не подходит. Т.е. либо выдумали что-то новое, либо отключили на время из-за каких-нибудь проблем. Скандалы, интриги, расследования — следим дальше.

Tags: , , ,

Comments 1 Comment »

Теперь банановый! “страничка паранойи”, которая выводится при щелчке по внешней ссылке переводит адрес в нижний регистр. Кто-то забыл, что регистр букв имеет значение?

Tags: , ,

Comments No Comments »

Вопрос к знатокам: почему в Firefox 3.5 window.gecko == true, а в в Firefox 3.7 pre-alpha window.gecko == undefined?

Tags: , ,

Comments No Comments »

Работает везде, кроме Arora (если точнее, виноват сам QtWebkit)

Ахда, в любых XML документах нельзя указывать DTD, иначе Internet Explorer пойдет по указанному адресу его скачать. Всё бы ничего, но он этим ddos-ит www.w3.org, поэтому там забанен. А значит, он просто вместо документа покажет ошибку

Tags: , ,

Comments No Comments »

Провел давно обещаное исследование о том как сайты на основе XSLT индексируются поисковиками.

Проверялось на примере avalon.com.ru

1) Google

Индексирует, игнорируя стили. Отчасти даже лучше — оформление не попадает в индекс и не мешается при поиске, но для полноты индексации надо делать sitemap.

2) Yahoo!

Применяет стиль и индексирует результат. Вах! То, что надо.

3) Yandex, Rambler, Aport, Microsoft Baidu

Никак. Стыд и позор!

Что ж… к сожалению, такой технически удачный подход к созданию сайтов слегка нежизнеспособен.

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

Tags: , , , , , ,

Comments No Comments »

А точнее, поддержка элементов audio и video в современных браузерах.

Для проверки были сделаны 2 странички и использованы 4 мультимедиа файла в форматах mp3, ogg vorbis, ogg theora, x264/mp4

Итак… на сегодняшний день audio и video поддерживают:

  • Mozilla Firefox 3.5 RC (Windows, Linux) — скорее всего станет первым стабильным браузером с этой фичей
  • Mozilla SeaMonkey 2.0b1 (Windows, Linux) — ну… логично
  • Arora 0.7.1 (Linux). Виндовая почему-то не хочет…
  • Google Chrome 3.0 (Windows) — тоже пока еще development branch. Единственный конкурент Мозиллы на право первенства. Версия же под Linux пока вообще ничего не умеет

MSIE как всегда в пролете. Opera в мейнстрим пока свои наработки пускать не хочет. Safari вопреки слухам тоже пока поддержкой не обзавелся. (возможно, слухи были про MacOS)

Поддержка форматов
Где указаны 2 формата, было использовано несколько источников для элемента (см. код под катом)

Mozilla Arora Chrome
mp3 - - -
ogg + + +
mp3, ogg ogg - ogg
ogg, mp3 ogg - ogg
mp4 (h264) - - +
ogv (theora) + + +
mp4, ogv ogv - mp4
ogv, mp4 ogv - ogv

Google Chrome понял формат mpeg, но всё равно предпочел ogv в обоих случаях независимо от порядка указания. Он просто хочет audio/mp4 в качестве MIME-типа. Подправил код и Хром сразу стал вести себя логичнее.

Arora почему-то не поняла множественные источники.

Код страничек (под катом): Read the rest of this entry »

Tags: , , , , , , ,

Comments No Comments »

semigreen В рамках операции “смена деятельности чтоб не сдохнуть” подкорректировал и обновил шкурку SemiGreen для phpBB от товарища Semi Deus, который забросил ее в районе версии для phpBB 3.0.0

Половину шаблона выкинул — теперь используется наследование из prosilver, так проще стало поддерживать тему в актуальном состоянии. Убрал ужасное чередование цветов в просмотре тем форума и сообщений темы. К сожалению, немного попортил заголовки таблицы. Переименовал тему в SemiGreen CA. Отчасти, потому что моя редакция, пусть и немного было работы, отчасти потому, что ее нельзя скопировать поверх старой — необходимо удалять и ставить заново, иначе не подхватит механизм наследования (появился в phpBB 3.0.3)

Скачать можно с моего сайта:
http://home.sunchaser.info/articles/web-phpbb-style-semigreen.html

Tags: ,

Comments No Comments »

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

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

Tags: , , , , ,

Comments 1 Comment »