Google

индекс
191,41

Демонстрация возможностей HTML5 на главной странице Google.com

Сегодня, 7.09.2010, в день рождения Google, прямо на главной странице google.com, если смотреть с помощью Firefox, Safari или Chrome, можно увидеть HTML5 в действии.
Логотип «Google» состоит из разноцветных шариков, которые разлетаются в стороны, если навести курсор.
В IE8 эффект работает, но все шарики одного размера, что смотрится не так красиво.



Видео, демонстрирующее эффект (спасибо хабрапользователю Defite):


P.S. Работает также и на google.ru. Возможно, показывается не всем пользователям.

P.P.S. Как правильно отметили хабрапользователи ryuzaki_spb и Ogra, от HTML5 там только doctype =)
Шарики — это куча абсолютно позиционированных div со свойством border-radius.

3 P.S. А ещё можно потрясти окно браузера! (спасибо хабрапользователю larikov !)
+109
7 сентября 2010, 11:45
17

комментарии (154)

+1
Dolios #
Хм. Хром 4.0.249.43
Ubuntu 9.04

Шариков нет :(

Все-таки показывается не всем пользователям.
+1
coolspot #
Вот сейчас, мне показывается на Google Russia, но не показывается на google.com.
И там и там много раз чистил куки и обновлял. На ru всегда показывается, на com 15 минут назад показывался, сейчас — уже нет.
+2
ApocalipssiS #
Ubuntu 10.04
FF 3.6.8

Есть шарики :)

Не уверен, что Гугл выбирал пользователей
–1
bergen1975 #
У меня FF 3.6.8, Gentoo нет шариков. Гугль страдает разизмом по отношению к разным дистрибутивам?
0
bergen1975 #
Упс, внизу прочитал, что нужно включить html5, после чего начало работать на гугле.ру. Впечатляет :)
0
aimodify #
Смешные шарики )
(Fedora 12:, в Хроме 5.0.375.99 все ок, в ФайрФоксе 3.5.10 — медленнее, в Опере — нет вообще)
+1
AHrEJI #
Чтобы появилось в Опере надо у нее сменить идентификатор браузера на FireFox )
(ПКМ — Настройки для сайта — Сеть — Идентификация браузера)
У меня на 10.61 все красивенько летает )

Кстати аффтор… добавь в пост, а то операфаны негодуэ )
+2
BReal #
Специально Оперу гнобят :(
0
Devix #
Забавно, что никто, кому я с утра предложил посмотреть на новый вариант логотипа, ничего не увидел. Всё стандартно.
И да, у всех была Опера.
Я уж подумал, что я особенный:) Хотя у меня Файрфокс.
А так да, забавно. Развлечение на работе.
–1
koluchiy01 #
Может у тех, кому ты предлагал выбрана персональная тема и бубл не показывается?
0
Devix #
Они все гуглоненавистники и не знают, что такое «персональная тема».
+7
koluchiy01 #
«гуглоненавистники» — а вот и причина :)
+3
Borro #
Гугл не любит оперу. Нужно в опере включить Прикидоваться шлангом Маскироваться под Firefox.
+1
bediary #
я увидел
–2
maximaximax #
На самом деле в любом браузере работает, только в ослике попроще выглядит.
0
maximaximax #
Ошибся. В Опере действительно нет шариков.
+10
Aineko #
там квадратики?
0
selcrit #
кубики
+61
xn__p2a #
квадратики — это в других браузерах:

image
0
FractalizeR #
Интересная картинка. Ссылкой не поделитесь?
+4
digitaldog #
0
dimap #
У меня в седьмом хромиуме он глазами шевелит о_О (вспомнил первый ACID тест и оперу...)
0
TheShock #
Там, в ие, все на самом деле куда печальнее:
+1
stansult #
Интересно проследить эволюцию по Firefox:

CSS-Cat in Firefox
+3
ryuzaki_spb #
Вижу почему-то только на google.ru, на доткоме старое лого (Ctrl+R не помогает).
Если отрубить javascript — то тоже автоматом старый логотип.

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

Но смотрится, конечно, мегакруто. Я бы не выдержал такой скрипт писать.
+5
Ogra #
Из html5 там вот что:
<!doctype html>
0
wRAR #
оно там очень давно
0
coolspot #
Добавил P.P.S.
0
Volshebnyi #
«Демонстрация возможностей border-radius на главной странице Google.com».
Да, как-то не звучит.
+2
ryuzaki_spb #
Скорее уже «Демонстрация возможностей javascript-гуру на главной странице Google.com» :)
+1
valerypride #
Увидел только на google.ru, на коме действительно все по-прежнему. Браузер — хром.
0
bagzilla #
Windows 7 Home Basic
Mozilla/5.0 (Windows; U; Windows NT 6.1; ru; rv:1.9.2.8) Gecko/20100722 Firefox/3.6.8
анимируется
–12
ivlis #
Firefox ok
0
zizop #
Да, у меня на фоксе в убунте тоже работает.
+2
Devix #
Хочу амные программы.
–3
nepx #
«Вау, круто, Вы юзаете Гугл Докс, респект!»
Вы же это хотели услышать? ))
–2
ivlis #
Я хотел показать, что в мозиле тоже работает. Фанаты такие фанаты, да.
0
stansult #
This account's public links are generating too much traffic and have been temporarily disabled!
0
ivlis #
Dropbox не ok
–9
Vovanys #
я с просоня шуганулся чуть, на весь экран шарики поскакали (24 дюйма мониторчик)
Но классно сделали ;)
+9
NeonMercury #
«Вау, круто, У вас 24 дюйма, респект!»
Вы же это хотели услышать? ))
+5
obiwanus #
Он хотел услышать «Вау, круто, я тоже хочу в 12 часов вставать»)
+1
Ivanhoe #
В Фоксе под виндой хорошо, только надо включить HTML5 в about:config.
0
Svobodniy #
В версии 3.6.10 такое есть?
+2
Ivanhoe #
У меня 3.6.8

0
Svobodniy #
Может в финалке и есть… а вот в Намороке 3.6.10 почему-то нет. Либо какое-то расширение предоставляет такие настройки?
+1
Ivanhoe #
Да вроде не, кажется, родная опция…
0
Svobodniy #
Проверил. Очень странно. В Файерфоксе 3.6.8 и Майнфилде «4.0 бета 6 пре» эта настройка есть, а в промежуточной Намарока 3.6.10 нет… :(
+7
ophiuhus #
Ставим в опере «Представляться как Firefox» и идем на google.ru — все работает. А вообще — это же дискриминация какая то!
+6
assTeT #
Имя этой дискриминации — Опера.
–3
chessk #
это не дискриминация, а нормальная политика отдела разработчиков. Лучше пользователь в своем любимом браузере будет видеть стабильно работающий сайт, который не отожрет оперативки или вообще положит браузер, чем увидит какую-то аццки некрасивую и глючащую фичу, после которой будет ходить и говорить «во в %companyname% ламерье работает! у меня в %browsername% все поразъехалось!»

так что это не дискриминация, а забота о нервах пользователя и о собственном имидже
+2
wRAR #
Тем не менее, browser sniffing, как мне казалось, давно уже считается плохим тоном.
–2
chessk #
сниффинг в плане ИЕ, мне кажется, абсолютно оправдан)
+1
wRAR #
Для этого есть conditional comments.
+7
bolk #
который не отожрет оперативки или вообще положит браузер
Это вы про «Оперу» сейчас говорили?
+2
ophiuhus #
Я не помню когда последний раз мне плохо делала опера, но вот хром уже несколько раз в BoD кидал машину. Проблема весьма известная и до сих пор не решена.
0
ophiuhus #
Прошу прощения, в BSoD.
0
stansult #
странно, пользуюсь Хромом давно, и ни разу такого не было, ни на каком из 4-х вариантов…
сам Chrome падал, но BSoD — никогда
+4
iSage #
Действительно. Нельзя допустить, что б скрипт в опере работал плавнее, чем в собственном детище.
Надо обязательно позаботится о пользователе, дабы он расстроился и таки поставил хром.
+8
norlin #
Оперу вообще казнить надо. Местами хуже чем ИЕ. И версий столько что во всех замучаешься отлаживать.
Это не наезд, а крик души вырвавшийся из собственного опыта.
+6
Perez #
забыл уже когда последний раз в опере косяки большие появлялись при вёрстке. А под кучу версий можно не подстраиваться, операфаны довольно резво обновляются до свежих релизов.
+1
norlin #
Тем не менее, в интернетах еще достаточно много юзеров с оперой 9.6, например. А глюки в основном не по верстке, а с JS, хотя и с версткой бывало немало всякого.
0
adminimus #
Вот вам пример, напарывался в реальном проекте.
Тестовая страница: dl.dropbox.com/u/998228/LOR/inline-block-test/test.xhtml
Результат рендеринга: dl.dropbox.com/u/998228/LOR/browsers-render.png

В целом проблем с версткой и скриптами в опере на порядок меньше, чем в ослике. Очень редко приходится что-то специально под нее затачивать. Но если уж что-то случилось, то отлаживать очень тяжело, оперовская стрекоза абсолютно неюзабельна, даже по сравнению с отладчиком в IE :(
0
ophiuhus #
У меня вот в хроме косячит ваша тестовая.
–1
MikelArdRi #
Ничего там не косячит
+1
ophiuhus #
Я только надеюсь, что так и должно быть
img840.imageshack.us/img840/339/chromef.png
0
MikelArdRi #
Так и должно быть, посмотрите результат рендеринга для разных браузеров сначала
0
ophiuhus #
В результатах оно на одной линии и не съезжает вниз.
0
MikelArdRi #
а сорри, я только смотрел на факт съезжания крестика как в опере, а что за версия хрома?
0
ophiuhus #
6.0.472.53
0
lol2Fast4U #
В 7.0.503.0 на Маке то же самое: d.myfreeweb.ru/1Gg47C
0
kmike #
сафари 5 на маке, то же самое
0
sletix #
FF 3.6.3 на маке то же самое
0
stansult #
у меня то же самое
0
all1 #
Просьба всем, кого не устраивает дискриминация, отписаться тут: www.google.ru/support/forum/p/web+search/thread?tid=6c8335ba706d48fc&hl=ru
0
grcool #
Готов убивать разработчиков за их мнения о том, что мне показывать, а что не показывать %)
Чтобы пользоваться новым поиском картинок на гугле приходится маскировать браузер под Firefox >_<
0
all1 #
А мне новый поиск по картинкам не нравится…
+1
fenrirgray #
Понимаете, они показывают новые фичи только для тех браузеров, для которых они эти фичи тестировали… В принципе это весьма верный подход. У оперы же слишком низкий охват рынка и гуглу на неё просто наплевать…
+1
grcool #
Это не мешает сделать сделать ссылку по которой включается новый функционал.
–1
Rulez #
В Украине доля Оперы существенна
+3
Naps #
Доля Украины в интернете несущественна.
0
Rulez #
И что это меняет? если компания работает только на территории Украины, то ей интересна только эта аудитория. 10-12 млн. человек, кому как, для меня и моей компании это существенная аудитория
+2
Krypt #
Работает и в Опере, только надо поставить «представляться как FireFox» — про неё опять забыли.
+1
ilyuxa #
работает на винде в ФФ и Хроме =)
Прикольно =)))
Можно даже поиграться — удерживать какой-нибудь шарик в стороне, чтобы не вернулся в кучу логотипа =)
+2
Devix #
Попробуйте так с несколькими шариками. На работе — самое то.
0
mafet #
У меня под фф 3.6.8 только после изменения user-агента заработало.
Может кому пригодится — поставил «Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US) AppleWebKit/534.7 (KHTML, like Gecko) Chrome/7.0.514.0 Safari/534.7»
0
roskov #
Под IE 8 работает, но шарики меньше… и даже с таким размером подтормаживает.
+4
roskov #
Получается, обделили только любителей жанра музыкально-драматического искусства… т.е. Опера.
0
grcool #
Не впервой) Новый поиск картинок нам тоже не показывают)
–2
Spy #
Вам повезло, новый поиск картинок очень не удобен.
+1
bigfrogg #
Opera 10.61. Debian GNU\Linux. Шариков нет
0
throble #
Попробуйте включить browser identification = masquerade as Firefox, под Windows помогает. Кстати, этот же трюк позволяет пользоваться в Opera новым Infinite Scroll в Google Image Search.
0
avecity #
Лично у меня — под виндой под Chrome 6 — работает отменно, причем в IE шарики не меняются в размерах, а только ползают.
В Chrome же — полный функционал)))
Красота)
+24
larikov #
Еще можно окно браузера потрясти :)
+9
tematika #
Со мной явно что-то не так, раз я начал трясти монитор. Пойду кофейку попью.
+1
lega #
Chomium 7.0.515.0 x64 linux — трясутся только когда мышку отпустишь (
0
zlord #
Chromium 6.0.472.53, x32, Linux, KDE 4.5 — «полёт» нормальный. Firefox 3.6.8 — тоже.
0
lega #
FF 3.6.8 x64 (Gnome 2.30.2) так же, при перетаскивании окна прыгают когда отпущу мышь.
0
belk #
Aero Snap (или как оно там) в Windows 7 с ума сходит :)
0
twangel #
Особенно шикарно это смотрится с «вязкими окнами» в компизе. :)
–1
monaxide #
IE 8, XP SP3 — works fine! Иногда не выдается!
–1
koct9i #
в десятой опере косящей под фф фсё работает
0
koct9i #
всё кроме тряски окном
0
khoody #
Тряска тоже работает, только надо трясти вкладку внутри окна, а не само окно.
Окно реагирует только на восстановление-разворачивание.
+2
Nubilius #
Ещё интересная особенность: в Google Chrom/Fire Fox шарики летают в 3х измерениях (ближе-дальше), в перспективе в общем. А вот в firefox и ie только в плоскости…
0
Nubilius #
>>А вот в ie только в плоскости…
во втором предложении FF лишний, конечно.
+1
lega #
Гугл остановил работу ИТ отдела в моей компании :)
0
smsteel #
Под Opera работает. Просто «не надо определять мой браузер» ©. «Identify as Firefox» в настройках решает проблему.
0
Serenevenkiy #
Стыжусь, но не могу найти это поле в настройках. Ну или как это в opera:config называется?
+2
Volshebnyi #
Проще всего: Shift+F12 -> Кнопки -> Настройки -> Перетаскиваете «Представляться как...» на удобную панель.
0
Merser #
ПКМ на странице конкретоного сайта — Настройки для сайта — Сеть. И там выбор есть.
0
cst #
Не работает FF4.0b4, Chrome 7.0.503.0 dev, XPsp3.
0
cst #
В проксе дело было.
0
q_styler #
У меня работает во всех браузерах (хром, лиса, IE).
Но почему-то только на google.ru
.ком открывается обычным.
0
Francyz #
Всем отделом ловим шарики. Если верить диспетчеру, то проц тоже грузится прилично из-за них.
+2
Volshebnyi #
Не вы, случайно, всем отделом правительственные сайты делаете?
+2
Francyz #
Нет, что Вы.
+1
freehome #
Кипр
не показывается нигде
+1
TravisBickle #
Гугл в очередной раз удивляет своей непосредственностью и открытостью. Не могу представить подобную штуку на microsoft.com.
+2
vollossy #
ааааа, черт, залип минут на 10 гоняя эти шарики по экрану
+1
andreikharlanov #
У кого старый логотип и никаких шариков, можете посмотреть эту красоту на YouTube: http://www.youtube.com/watch?v=mf_X9zoZEn4
0
Klajnor #
Ещё пару дней назад был логотип с молекулой фуллерена вместо буквы О. И можно было её крутить
+2
iSage #
radio.momoiro.ru/ballz.html
Больше шариков, персиковых и круглых!
Можно невозбранно забирать код и вернуть туда поддержку IE.
0
iSage #
Немного де-обфусцировал скрипт.
0
Nebulosa #
Во! работает в Epiphany! А то Гугл такой Гугл…
+1
Nasvit #
На моем слабеньком компе в Chrome 6.0.472.53 шарики тормозят, в Opera все отлично, нагрузка на проц не больше 80%.
0
non7top #
Не уверен зачем мне прорекламировали хром и сафари. Сейчас просто запустил фаерфокс и увидел странные шарики. Оказалось это в честь топика на хабрахабре о великих хроме и сафари.
0
coolspot #
Не делайте поспешных выводов.
Я проверил эффект во всех браузерах, прежде чем написать топик. И в тот момент, когда я проверял, в моём основном браузере (FF 3.6.8) эффекта не было, а в Safari и Chrome — был.
+2
Supercharged #
Демонстрация возможностей HTML5 — детские шарики по всему экрану. 10 лет, между прочим, ждали.
–2
q0p #
Гугл становится неудобным: эти летающие шарики ощутимо нагрузили мне процессор. Я считаю плохим ходом приделывать подобные бесполезные свистоперделки в ущерб производительности и скорости.
–2
q0p #
А в найтли билде лисы — так ещё и скроллбары появляются, при сильном разлетании шариков.
–1
0n1y_0ne #
Народ, сколько можно дрочить на HTML5 и canvas? Не понимаю, что за прелесть в технологии, грузящая самые современные процессоры чуть не на половину просто при просмотре видео, который сделан на ней? Технология, которая никогда не добъется такого же функционала, что Flash, гораздо кстати менее требовательный к ресурсам? На хабре на каждой второй странице мелькают статьи «10 новых нахер никому не нужных фишек, сделанных на HTML5, которые удивят вас и загрузят ваш комп по самое не могу». Ну объясните, что в этом такого клевого?
0
mraleph #
вы так говорите «никогда не добъется», словно флэш был дарован нам Богом на горе Синай.

у меня каждый раз на Маке включается вентилятор, когда я смотрю видео во флэше. и что?

люди работающие в разных компаниях по всему миру тратят своё время, чтобы оптимизировать встроенные в браузеры механизмы рендеринга и исполнения JS (который осмелюсь напомнить вам лет 10 назад сам по себе неплохо тормозил, а сейчас его в серверных приложениях используют).
0
kurono #
pastie.org/1143211 — исходник шариков. зависит от prototype.js
0
iSage #
habrahabr.ru/blogs/google/103704/#comment_3227411 и следующий. Там код посвежее, чем то, что я заливал на пасти.
0
xget #
Firefox 3.6.3, XP PRO SP3 На google.ru все работает!
0
gymlyg #
Несколько дней назад, под хромом, в центре гугол логотипа наблюдался трехмерный сферический каркас (на тему фулеронов) который можно было повертеть вокруг различных осей — зависело от движения мыши. Под мозила файрфокс эффект не работал.

дизайнеры+програмисты гугол лого достойны респекта и уважухи за вот такие псевдо пасхальные йайца — они задают стиль, они делают работу с браузером более диалоговой, комфортной и уютной (всего понемногу).

Однако с шарами несомненно перебор — очень отвлекает.
+1
petergreen #
«4 P.S Прошу прощения у минусовавших меня фанатов FF за то, что изначально написал только Chrome и Safari. У меня у самого основной браузер FF, но там эффект почему-то не работал, сейчас — работает. „

Да пусть они сгорят все в своём фаерфоксе вместе с вашим рейтингом, чо прощения просить? Люди, что с вами делает эта сраная кармасистема? Вы в жизни такие же становитесь, или только тут? Какой же идиотский искуственный извращённый механизм вы тут развели, ТМ! я понимаю конечно, что не первый (милионный), кто это говорит, но это постоянно отвлекает от содержания и смысла и невольно обращаешь внимание.
+1
Alex7Kom #
О чем все говорят? Какая демонстрация HTML5? Просто Google, как обычно, 7 сентября празднует мой свой день рождения! С днем рождения, Google!
googlesystem.blogspot.com/2010/09/googles-particles-doodle.html
+2
Gregory #
с днем рождения, %username%!
0
dimap #
Ага. И там же ниже:
«Update (via Blogoscoped Forum): Google says that the animated doodle didn't celebrate an important event. It was fast, fun and interactive, just like Google.»

Но тем не менее — с днём рождения!
0
Golden_Grey #
В глазах рябит
0
Defite #
супер эффект. правда, если бы мне не рассказали утром о нем, даже бы и не заметил, у меня по дефолту обои стоят в поисковике.
0
Defite #
кстати, сделал видео capture с демонстрацией работы, если кому-то нужно, могу поделиться.
0
coolspot #
Добавил видео.
0
qmax #
и что же демонстрируется теперь картинкой www.google.ru/logos/keystroke10-hp.png?
0
Defite #
вот поэтому хорошо, что есть видео ;)
0
mraleph #
ну картинка-то тоже интерактивная:
+1
coolspot #
Ребята в гугле походу решили устроить на главной js playground =)
0
Defite #
а что, удобно, столько бета-тестеров сразу)
0
qmax #
о! а мне как-то даже не пришло в голову чтото искать :)
0
Defite #
пока не воспользуешься поиском, не поймешь :)
0
MrPrayer #
Очень хочется теперь услышать людей, которые будут говорить, что и такой логотип не под силу опере…
0
Borisfen #
Пузырикиии!

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