Показаны сообщения с ярлыком создание сайта. Показать все сообщения
Показаны сообщения с ярлыком создание сайта. Показать все сообщения

суббота, 8 апреля 2017 г.

Как посмотреть закрытую статистику «LiveInternet»?

    Счётчики для сбора статистики сайта http://www.seoded.ru/ssilki/seo/statistika-sajta.html от нас со всем уважением

Как посмотреть закрытую статистику «LiveInternet»?

    В последнее время, часто лазаю в выдаче «Яндекса» и «Гугла» по низкочастотным запросам в поисках интересных тем. У многих из моих находок стоит счётчик «LiveInternet». Однако статистика у него доступна только по паролю, он не участвует в категориях и на самом счётчике ничего, кроме логотипа, не имеется. А мне, для ясности картины, необходима статистика, хотя бы число просмотров и посетителей.



среда, 5 апреля 2017 г.

Кветч c нами, кветч как мы, кветч лучше нас

Вроде бы простая штука форма обмена валюты, однако нам понадобилось сделать четыре итерации (и один раз вернуться к началу), чтобы заставить её хоть как-то работать – и это только один проект. Вообще конец зимы – ужасное, ужасное время. Весь коллектив так истово работал, что всей компанией натерли себе курсоры. Даже не хватило времени присобачить к сайту снежинки, как делают все порядочные люди.

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

PS. Кветч.

PPS. Обновление. Разбили бачок от унитаза и диско-шар. Праздник, я считаю, удался.


четверг, 30 марта 2017 г.

Отключенное текстовое поле в Internet Explorer

Сравните активное и отключённое поле в Internet Explorer’е:


А вот как они выглядят в Фаерфоксе:


В IE пользователи не смогут отличить активное текстовое поле от отключённого. Решение этой проблемы достаточно простое: CSS. Спросите Вашего верстальщика, как сделать так, чтобы отключённое текстовое поле действительно выглядело отключённым в IE.

Это, конечно, мелочь, но разрешение этой проблемы поможет удерживать внимание пользователя пока он не наткнулся на следующую обескураживающую вещь в вашем интерфейсе. :)


среда, 29 марта 2017 г.

Как входить и выходить в дверь правильно

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

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

Второй бытовой интерфейс любопытнее. На внутренней стороне входной двери, на самом видном месте, я нашел несколько желтых листочков — «Хлеб», «Яйца», «Сыр», «Динамит». В ответ на мой вопрос «Зачем?» друг ответил, что как только что-то из продуктов заканчивается или он вспоминает о необходимости что-то купить, он пишет это что-то на листочке, выходя из дома эти листочки собирает себе в карман, а в магазине их из кармана достает. Знаю, у этого решения куча недостатков, но оно простое, работающее и расширяемое. Например, если я что-то из написанного на листочках не купил, придя домой, я могу снова наклеить его на дверь.

Но дело в другом. Через несколько дней я понял, что это решение мне прекрасно знакомо, более того, я им активно пользуюсь. Рисуя прототипы, я ставлю на страницах большие желтые блоки с текстом типа «Залогиненный пользователь» или «Если страница уже в избранном?». Это не список функциональности, а скорее вопросы и отдельные ситуации по конкретным блокам интерфейса, которые нужно не забыть спроектировать. Перед финализацией очередной версии я иду по страницам и собираю эти напоминалки — что-то дорисовываю, что-то оставляю на потом.

Хотя в определении юзабилити и есть слова про контекст («…продукт может быть использован определенными пользователями при определенном контексте использования для достижения определенных целей/мотивов…»), не стоит забывать, что и контексты, и цели/мотивы в разных задачах и областях часто бывают настолько похожи, что смело можно использовать один и тот же интерфейс. Нужно только замечать это сходство.


суббота, 25 марта 2017 г.

Хюбрис и интерфейс: кто кого поборет?

Хюбрис и интерфейс: кто кого поборет?

    Рекомендую очень смешную — и поучительную — заметку [en] о том, что получилось в «Wolfram|alpha» из-за гордыни разработчиков. Вводится новый и, на мой взгляд, очень полезный термин — «хюбристический интерфейс» (хюбрис, он же гибрис, так же известный как ὕβρις — в древнегреческой культуре особый сорт дерзости, выражающийся в желании превзойти богов).

 

 

    Автор ругает псевдо-естественный (попробуйте найти «sise of egg») язык запросов «Wolfram|alpha», мотивируя свою ругань тем, что этот интерфейс отнимает у пользователей контроль над результатом («If the product is used as a tool, its interface should be as unintelligent as possible. Stupid is predictable; predictable is learnable; learnable is usable»). Аргументация, по-моему, очень весомая.



пятница, 24 марта 2017 г.

Интерфейс может быть каким угодно…

…пока он розовый. Этой мантрой я уже давно замучил всех дизайнеров нашей дивной компании – а теперь хочу замучить и вас. Вот небольшой учебный фильм; если заменить всего несколько слов в нём, всё будет применимо и к интерфейсам! Не забудьте только включить режим HD.




четверг, 23 марта 2017 г.

On-hover убивает Flash. И не только

Рисунок «Объект является кликабельным»

Очень интересная статья аж от 2010 года профессионального Flash-разработчика о том, почему у Flash проблемы на мобильных устройствах (уж на что Adobe и Apple взаимно любят друг друга, а все равно Flash отсутствует на iPhone и конца этому не видно). Кратко: большинство Flash-изделий используют on-hover как самостоятельный и незаменимый метод взаимодействия; on-hover, в свою очередь, невозможен на современных устройствах с тактильным вводом (его эмуляция хоть и возможна, но убога до безобразия).

Я, откровенно говоря, испытываю в данном случае лишь злорадство. Мне нравится Flash (и ещё больше нравится Air, которая суть Java от людей, не испорченных enterprise-программированием), но всё же — флашеры сами виноваты в том, что получилось. Использовать интерфейсные методы только потому что (а) так можно и (б) другие так не делают — статистически верный способ получить нечто убогое.

Вот вполне реальный сценарий. Есть сайт, на сайте есть анимированное меню. В начале работы в голове дизайнера что-то щёлкает и дизайнер решает — повешу анимацию не на on-click (боже, как это скучно и старо!), а на on-hover. С мышью всё работает; с пальцем не работает ничего.


воскресенье, 19 марта 2017 г.

Расцвеченный пароль

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


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

И да, часто ещё лучше просто не маскировать пароль.



пятница, 17 марта 2017 г.

Корпорации предпочитают Twitter

Интересно сравнить стратегию продвижения в социальных медиа американских органов власти (см. предыдущий пост) со стратегией крупнейших корпораций. Глобальное PR-агентство Burson-Marsteller провело в июле 2009 исследование "Использование социальных медиа компаниями из списка Fortune 100".

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

Выяснилось, что службы по связям с общественностью этих корпораций тоже предпочитают коммуницировать с внешней средой через информационные каналы на Twitter, а не брендированные страницы (Fan pages) на Facebook или корпоративные блоги (речь идет именно о блогах компаний, а не о персональных блогах сотрудников, коих действительно много).

Впрочем, 40 компаний из top-100 вообще не пользуются ничем из перечисленного. Но все они публикуют в Интернете новости о себе и своих продуктах / услугах традиционным способом: в виде пресс-релизов или лент новостей в соответствующих разделах корпоративных сайтов.

Среди 60 "продвинутых" компаний есть 17 "самых продвинутых", которые пользуются всеми тремя каналами коммуникации. В основном это представители хайтека - Dell, IBM, Intel, Microsoft, Cisco, HP.

Twitter

Корпоративные аккаунты на Twitter есть у 54 компаний из top-100. Высокотехнологичные компании, как правило, имеют несколько каналов: новости, клиентский сервис, промоакции и даже поиск персонала. Остальные компании менее активны в Twitter, но регулярно постятся все.

Средняя температура по больнице: 4 поста в неделю и 5 234 follower's на дату окончания исследования. Число follower's стремительно увеличивается у всех, но особенно быстро у Microsoft.

Facebook

Корпоративные или "брендированные" страницы (Fan pages) на Facebook есть у 57 компаний из 100. Однако лишь 29 из них подают признаки жизни, остальные не обновляются.

Корпоративные блоги

Корпоративные блоги есть всего у 32 компаний из 100. Впрочем, на сайтах оставшихся 68 можно найти ссылки на личные блоги сотрудников или даже сторонних экспертов, которые пишут о продукции этих компаний.

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


четверг, 16 марта 2017 г.

Ведут ли блоги западные губернаторы?

Итак, многие российские губернаторы без энтузиазма относятся к новомодному увлечению блогами. Я было даже написал в комментах к посту Андрея Замулы, что блоги как формат коммуникации несовместимы с традиционным менталитетом российских чиновников.

Но потом задался вопросом - а может, проблема не в российском менталитете? Как обстоят дела в развитых странах – в США, Европе? Ведут ли там блоги главы регионов и мэры крупных городов? Если да, то какие?

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

Принято считать, что США являются самой продвинутой страной как целом в области связей с общественностью, и в области интернет-коммуникаций - в частности. Актуальный стандарт "Губернатора 2.0" нужно искать там.

Президент 2.0

В Америке, в свою очередь, планку "Чиновника 2.0" задает экс-президент Барак Обама. Он уже вошел в историю как "президент-гик". Информация о его деятельности постоянно транслируется через блогосферу, Twitter, Facebook, YouTube, Flikr, сервисы социальных новостей и многие другие каналы Web 2.0.

Некоторые считают, что подобная активность избыточна и даже начинает вызывать у публики отторжение. Недавно в New York Magazine вышла довольно ехидная статья под заголовком "Будет ли повсеместное присутствие Обамы в СМИ самым запоминающимся аспектом его президентства?" (Will Barack Obama's Media Ubiquity Be the Most Significant Aspect of His Presidency?).

Вот картинка из ехидной статьи.


А есть ли у "Президента 2.0" свой блог?

Блоги, в которых писал сам Обама, были во время избирательной кампании и некоторое время после победы. В этом смысле, сейчас у него своего блога нет. Есть блог "Белого дома", которым занимается штат специальных сотрудников.

Блог очень хороший. Сразу видно, что люди стараются, потрачено много сил, времени и денег. Мое воображение поразил перевод видеообращения Обамы по случаю мусульманского праздника Рамадан на 13 языков, включая русский.

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

* * *

Ознакомившись с эталоном, перейдем к госслужащим рангом пониже.

Я погуглил "Governor Blog" и "Mayor blog", но без особого результата. Пришлось вручную пройтись по сайтам англоязычных (американских, британских, австралийских и т.д.) мэров и губернаторов известных городов и провинций. У большинства из них нет блогов, хотя почти у всех есть аккаунты в Facebook и Twitter.

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

Личные блоги

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

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

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

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

В общем, большие западные начальники не сидят в своих блогах вечерами после работы. Блоги ведут специально обученные люди. Может быть, начальники тем самым демонстрируют публике, что они рационально используют свое время, оплаченное налогоплательщиками?

Текстовые блоги, которые ведут пресс-службы

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

Бывают и странные исключения. Вполне официальный блог бывшего мэра Майами Мэнни Диаза был зачем-то размещен на бесплатной платформе Blogspot, а каждый пост трогательно подписан - Мэнни. Причем комменты там все равно отключены, а ссылки с постов ведут на сайт мэрии.

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

* * *

На сайте бывшего терминатора, а ныне руководителя самого большого, самого богатого и, главное, самого интернетизированного американского штата Калифорния Арнольда Шварценеггера скромно написано - "народный губернатор". Впрочем, это даже не его личный сайт, а всей администрации штата.

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

Комментарии в блоге не предусмотрены.

У Арнольда Шварценеггера есть личный сайт Schwarzenegger.com и несколько "общественно-политических" типа Stand for Califorinia, но блогов там нет.

Как и у Обамы, основная web-активность Шварценнегера приходится на Facebook и Twitter, где на него явно работает целый штат помощников. Эти страницы сверхпопулярны. Хотя не надо забывать, что Шварценеггер не только губернатор, но еще звезда кино и культурист.

* * *

На другом конце Америки - город Нью-Йорк. Его мэр, 67-летний Майкл Блумберг, мультимиллиардер и владелец информационной империи Bloomberg, является еще бóльшим фанатом интернет-технологий, чем сам Барак Обама.

Однако своего блога у него тоже нет. Пресс-служба Городского совета Нью-Йорка ведет довольно невзрачный блог "Красная комната", в который вставляют новости, видеозаписи с депутатских заседаний и прочий официоз, касающийся деятельности городских властей.

Комментарии в блоге, как водится, не предусмотрены.

Зато у Блумберга есть то, чего нет ни у кого из упомянутых политиков, даже у Обамы - собственная социальная сеть Mike Bloomberg NYC. На портале можно авторизоваться при помощи Facebook Connect и присоединиться к какой-нибудь близкой по духу, культуре или району проживания группе сторонников мэра (негры, латиносы, русские, зеленые, геи и лесбиянки и т.д.).

Как Обама и Шварценеггер, Блумберг активно присутствует в Facebook, Twitter и на Youtube. И тоже абсолютно заочно.

Видеоблоги

Некоторые губернаторы и мэры, подобно Обаме, регулярно обращаются к народу с видеобращениями. Правда, слово "видеоблог" я не встречал ни разу - это или "подкасты", или просто выступления, записанные на видео.

Рассмотрим характерные примеры.

* * *

Губернатор Флориды Чарльз Крист наиболее близок по духу своим коллегам из России. Его страница оформлена в том же помпезном стиле, что и кабинет, и как бы намекает на времена унесенных ветром плантаторов Юга и прочих латифундистов. В разделе "подкасты" регулярно размещаются его выступления, записанные на видео. Все делается очень качественно и профессионально.

Например, в одном видеопослании Крист объявляет войну каким-то питонам, которых теперь будут отлавливать в болотах Флориды и гуманно усыплять.

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

Также у Криста есть страница нежилого вида в Facebook и канал в Twitter с одним сообщением, датированным маем 2009.

* * *

Бывший мэр Лондона Борис Джонсон - довольно эксцентричная личность, в прошлом профессиональный журналист, борец за права геев и лесбиянок, однозначно гик. Курит травку. Страничка мэра на правительственном портале Лондона оформлена очень скромно, но там есть его ссылки на Facebook, Twitter и YouTube.

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



Активность Джонсона в Facebook и Twitter значительно выше средней. Но сообщений, сделанных им лично, я все равно не нашел.

* * *

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

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

С другой - Брамби не вещает в никуда. На YouTube у него выстроена целая система общения с аудиторией под названием Premier′s Question Time ("Время вопросов премьеру"). Посетители могут проголосовать за понравившиеся вопросы и задать собственные, а Брамби записывает видеоответы на 5 самых "рейтинговых" вопросов.

Как и положено, помощники пиарят Брамби в Twitter, Flikr и Facebook.

Но блога у Брамби тоже нет.


суббота, 4 марта 2017 г.

Стерео сайт

Недавно принес в студию простые стерео очки (red/cyan glasses), баловства ради ну и для расширения кругозора коллег. Оказывается, никто из них не ходил в кинотеатры на 3D фильмы и не имел удовольствия насладится объемным изображением.

Конечно 3D фильма у меня под рукой не было и я показал несколько фотографий, которые сделал сам — коллеги оценили, но как-то слабенько. Установил iZ3D драйвер и включил Call Of Duty в анаглиф-режиме — вот тут был фурор, восторг и аплодисменты. Стереоэффект в динамике захватывает дух :)

Вдохновленные объемом, коллеги начали предлагать самые разнообразные идеи, где это можно было бы применить. Хотя сама тема стара, и все уже давно придумано, но одну из них мы решили испробовать и сделать первый в мире стерео сайт! За основу взяли наш небезызвестный AdProject. Если вы уже являетесь счастливым обладателем стерео очков, то смело кликаем на картинку и оцениваем объем в динамике.

(для просмотра очень желательно иметь быстрый компьютер с частотой процессора >2 ГГц)


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


пятница, 3 марта 2017 г.

Юзабилити чтения: о ширине текстовой области


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

Теория

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

Многие из книг начинаются с типирования и объяснения механизмов чтения. Для большинства людей характерно обычное построчное чтение, при котором каждая из строк читается последовательными областями, по которым «прыгает» взгляд при движении глаз слева направо:

Читать дальше http://seoded.blogspot.ru/2017/03/blog-post_3.html


Рождение вселенной

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

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

В качестве учебного пособия перед началом работы мы со Стасом получили пару частей «Звездных войн» легендарного Джорджа Лукаса. Зарядившись космической энергетикой мы приступили к делу.

За опорную точку рождения вселенной мы взяли взрыв. Космический взрыв изнутри на самом деле выглядит вот так:

Изображение недоступно

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

Изображение недоступно

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


четверг, 2 марта 2017 г.

Склонение существительных с цифрами

Склонение существительных с цифрами

http://www.seoded.ru/webmaster/sozdanie-saita/sklonenie-suschestvitelnykh-s-ciframi.html



Как мы придумывали и организовывали 404fest

В один прекрасный летний день Диме пришла замечательная идея собрать самарских веб-разработчиков на ОпенЭир. Сказано – сделано, в загородном парке собралось 60 человек. Так в далеком 2007 было положено начало преодоления феодальной раздробленности между веб-студиями Самары.

В следующем году мы основательно подошли к предстоящему мероприятию – придумали название «Фестиваль 404» и сделали сайт. Появилась программа, как на больших конференциях, но наша тяга к неформальному общению определила формат проведения. Это должен быть фестиваль, а не скучная конференция! Так было положено начало ежегодному 404fest. Гостиница Азимут в своих стенах вместила 250 веб-разработчиков из Самары, Тольятти, Ульяновска и других городов. Над организацией фестиваля в течение месяца трудилась уже целая команда сотрудников Доминиона. Особенно хочется выделить и еще раз поблагодарить Диму Фитискина, Катю Азарову, Таню Симдянову, Алексея Литвиненко и Максима Старожилова.

Вдохновленные успехами первого 404 феста, мы принялись за второй. Хорошее мероприятие зависит от участников и докладов – именно этому мы уделяли главное внимание. Работа над фестивалям началась еще в мае – запустили сайт с онлайн конференциями, завели твиттер. Месяц моральной подготовки и 3 месяца плотных работ сопровождались еженедельными онлайн-конференциями с известными веб-разработчиками. Длинные вечера и бессонные ночи не прошли даром. На новом сайте стали собираться участники и доклады. За один месяц зарегистрировалось 900 человек, а заявку успели подать 666.

В фестивале приняли участие такие легендарные личности, как Сергей Чикуёнок, Петр Диденко, Алексей Пелевин, Платон Днепровский, Алексей Копылов, Никита Филиппов, Дамир Халилов и Мария Подоляк.

Как нельзя кстати оказалась поддержка ребят из Турбомилка. Спасибо!

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


понедельник, 27 февраля 2017 г.

Optiweb vs. Netcat

На конференции Сайт-2009 Дмитрий Васильев подарил Диме Фитискину коробочную версию небезызвестной CMS — Netcat. У меня, как у молодого и амбициозного технолога, возникло непреодолимое желание попробовать ее в деле, а заодно сравнить с нашей, студийной CMS — Optiweb.

О соперниках

Netcat, думаю, не нуждается в представлении. Это одна из наиболее популярных на сегодняшний день система управления сайтами. 11.5% сайтов рунета, по версии CMS Magazine используют Netcat.

Optiweb — неизвестная система, разработанная в стенах студии еще в 2003 году, и с тех пор ядро системы практически не изменялось.

Интерфейс

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

В Optiweb не все так гладко. Верстка хромает, задний фон немного отвлекает внимание. В принципе, к этому быстро привыкаешь, но первое впечатление складывается не самое лучшее. Но если открыть админку в IE, то там Optiweb выглядит вполне нормально (парадокс).


Netcat выигрывает в плане интерфейса. Потянет, пожалуй, на твердую четверку. Отпугивает огромное количество бесполезных наворотов, типа встроенного php/html редактора. Зачем встраивать в CMS редактор с подсветкой кода? Ответ в следующем параграфе.

Базовая интеграция

Включает установку всех макетов дизайна на CMS и всех навигационных элементов (меню, хлебные крошки). Интеграцию я делал на примере корпоративного сайта компании Квадрат.



Макетирование

Вот тут случилось самое большое разочарование в Netcat. Я по привычке полез искать файл макета, но не нашел его. Пришлось открывать руководство для разработчика, из которого я понимаю, что, оказывается, никаких файлов макета нет вовсе. Все данные (как выяснилось позже, не только данные макета) хранятся в базе. Все редактирование происходит через небольшое окошко формы. Фу, плохая киса! Я опечалился и закрыл Эклипс. На мой взгляд — это ужасная, грубая ошибка — лишать разработчика возможности «играть на родном поле». Я постоянно был вынужден копировать код из поля в редактор, жать кнопку сохранить. Это отнимало у меня массу времени. Поначалу я даже хотел заплакать и прекратить дальнейшую работу с движком.

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

У Optiweb проблемы излишнего использования базы нет. Файл макета загружается на сервер, выбирается в админке, и все. Удобное назначение использования макета для страниц сайта: выбирается макет для главной страницы, и для всех вторичных.

Структура формирования макета у подопытных движков разная. В Netcat он разбивается на 2 части: Хедер и Футер, а все что посередине — блок контента. Это знакомо тем, кто работал с Битриксом. Optiweb поступает иначе: шаблон не разбивается, а в него помещаются блоки. То есть прямо в файле макета вставляется конструкция вида:


< !--#block src='blockname'-->


Парсер распознает этот комментарий как блок. Чтобы создать поле контента в нужном месте на странице пишем:


< !--#block src='content'-->


И создаем в разделе «блоки и шаблоны» раздел «content». Преимущество этого метода в том, что если допускаешь ошибку в вызове блока, то он отобразиться как простой комментарий. Тут стоит отметить, что блоки бывают нескольких типов: статический (текстовый блок), шаблоный (вывод данных по заданному шаблону), и динамический (блок вывода модулей, например новостей, каталога или навигации). Content — обычный текстовый блок.

Установка навигации

С навигацией в Netcat ничего сложного. Вызываем блок меню в макете:


s_browse_level(0,$browse_sub[0])


и в шаблоне для вывода навигации работаем вот с такой конструкцией:


$browse_sub[0]['prefix'] = "<ul>";
$browse_sub[0]['suffix'] = "</ul>";
$browse_sub[0]['active'] = "<li><span class='selected'><a href=''>%NAME</a></span>".s_browse_level(1, $browse_sub[1])."</li>";
$browse_sub[0]['active_link'] = "<li><span class='selected'><a>%NAME</a></span>".s_browse_level(1, $browse_sub[1])."</li>";
$browse_sub[0]['unactive'] = "<li><span><a href='%URL'>%NAME</a></span></li>";
$browse_sub[0]['divider'] = "";

Здесь все, пожалуй, понятно. Навигация представляет собой список. Prefix — начало списка, suffix — окончание. Active — параметры родителя, когда активен потомок, ".s_browse_level(1, $browse_sub[1])." вывод навигации второго уровня. Аctive_link — параметры активного пункта, unactive — неактивного. Divider — разделитель, он мне не понадобился.

Аналогичным образом настраивается меню второго и выше уровней уровней. Без ложки дёгтя не получится. В Netcat нельзя настраивать несколько типов навигации (вернее можно, но для этого надо схитрить). А на сайте есть 2 разных навигации: главная, и каталог домов. Чтобы сделать 2 навигации в Netcat: мы создаем в дереве дополнительный пункт меню, скрываем его на сайте, и вызываем в шаблоне:


s_browse_sub(E,$browse_sub[2])

E — это номер элемента в дереве, который использует шаблон $browse_sub[2]. Для главной навигации первое число — 0, потому что отображаются все разделы сайта. Недостаток этого метода в том, что скрытый пункт меню отобразится в хлебных крошках, что нежелательно. В Optiweb можно создавать любое количество навигаций, и применять их к любому пункту в дереве. А настройка пунктов происходит аналогичным образом:


<!--#list src='root'-->
  <div id="nav">
  <ul>
  <!--#elem-->
    <!--#cond-->
      return $_ds->getParam('is_cur_active');
    <!--#endcond-->
    <li> <span class="selected"><a><!--#slot src='fullname'--></a></span><!--#slot link='suboptions'--></li>
  <!--#endelem-->
  <!--#elem-->
    <!--#cond-->
      return $_ds->getParam('is_active');
    <!--#endcond-->
    <li><span class="selected"><a href="<!--#slot src='url'-->"><!--#slot src='fullname'--></a></span><!--#slot link='suboptions'--></li>
  <!--#endelem-->
  <!--#elem-->
    <li><a href="<!--#slot src='url'-->"><!--#slot src='fullname'--></a></li>
  <!--#endelem-->
  </ul>
  </div>
<!--#endlist-->

Несколько громоздкая конструкция, но в целом понятная. List — это список, все, что находится внутри list, перед, или после elem — это аналог суффикса и префикса в Netcat. Elem — это элемент списка. Внутри <!--#cond--> — условие. Код внутри elem выполнится, если активен потомок элемент ('is_cur_active' -аналог Active в Netcat), если нет, то переходим к следующему элементу. Is_active — выполнится, если активен сам элемент <!--#slot link='suboptions'--> — второй уровень меню. Если ни одно из условий не выполняется, то выводится последний элемент списка, не имеющий условия. На мой взгляд, в Netcat таки удобнее реализован вывод меню.

Установка модулей и компонентов

Компоненты в Netcat ставить просто. При редактировании раздела выбираем список используемых компонентов, и вызываем нужный нам компонент на страницу, например Новости. Компонентов можно вызывать несколько, но все они оказываются в разделе контент. Чтобы вывести вне контента, и заодно сделать выборку 2-х последних новостей на главной странице, пишем в шаблоне:


s_list_class(№C,№R,"recNum=2")

Где №С — номер компонента, а №R — номер раздела.

Дальше заходим в раздел компонентов, и настраиваем шаблон как нам нужно. Тут, конечно, хорошо бы иметь представление хотя бы о синтаксисе PHP, потому что не экранированные кавычки (например в названии классов) приводят к ошибке.

Аналогичным образом устанавливается компонент каталога. Но есть один нюанс. Понадобилось сделать вывод «параметров дома» в описании элемента. Оп, ноу проблем. Заходим во вкладку поля в настройках компонента, и сколько душе угодно создаем новых переменных. Вызываем нужные переменные в шаблоне вывода компонента:


<tr>
 <td>Площадь застройки m<sup>2</sup></td>
 <td>".opt_case( $f_sqr , '$f_sqr', "нет"; )."</td>
</tr>

И так для всех элементов, которые нам нужны. opt_case — Netcatовская функция условия. Буквально, если $f_sqr — существует, и не ноль, то выводить $f_sqr, иначе выводить «нет».

В Оптивебе задача вывода полей ложится на хрупкие плечи программиста. Технологу всего то и остается, что показать где быдет выводиться модуль, и настроить шаблон. Выглядит шаблон так же, как шаблон навигации, то есть имеет струкртуру list-elem-cond. List для вывода «Параметров дома» такой:


<!--#list src='item.paramList'-->
  <h3>Параметры дома</h3>
  <table>
  <tbody>
  <!--#elem-->
    <!--#cond-->
      return $elem->get('list.key') % 2 == 0;
    <!--#endcond-->
    <tr class="odd">
      <td><!--#slot src='name'--></td>
      <td><!--#slot src='value'--></td>
    </tr>
  <!--#endelem-->
  <!--#elem-->
    <tr>
      <td><!--#slot src='name'--></td>
      <td><!--#slot src='value'--></td>
    </tr>
  <!--#endelem-->
  </tbody>
  </table>
<!--#endlist-->

Красим табличку «зеброй»:

return $elem->get('list.key') % 2 == 0;

Берем номер эмемента, если остаток от деления на 2 = 0, то выводим код внутри <!--#elem-->, если не подходит, то переходит к следующему элементу. <!--#slot src='value'--> — аналог переменной (например: $f_sqr в Netcat), задается при наполнении внутри CMS.

Вместо эпилога

Сравнивать эти две системы не так просто, как кажется. Тут все как с китайцами. Они, конечно похожи, но на самом деле разные. Оптивеб — это ниндзя. Он чотко и быстро справляется с задачей. Технологу нужно приложить минимум усилий, соответственно затратив меньше времени. Netcat — супер-робот-убийца-разрушитель, обвешанный такой нереальной кучей примочек (например встроенный редактор с подсветкой кода прям в форме, или автоматический «экранирователь» спецсимволов), что пока он движется до цели — та уже постарела и умерла сама. Но Netcat более дружелюбен пользователю, а это позволит сократить время на наполнение сайта, что немаловажно.

The end


воскресенье, 26 февраля 2017 г.

Favicon

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

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

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


суббота, 25 февраля 2017 г.

Что влияет на стоимость сайта?

У бизнесмена, который решил сделать сайт своей фирмы, после обращения в десяток веб-студий резонно встаёт вопрос «Почему цены на мой будущий сайт у разных разработчиков отличаются в несколько раз?».

Попробую объяснить, почему это происходит. Стоимость сайта зависит от...

  1. Планируемой нормы прибыли. Одному хватит 0% (то есть он будет работать по стоимости своего рабочего часа), а у кого-то она больше.
  2. Организационно-правовой формы подрядчика. У фрилансера при прочих равных условиях цена будет меньше, чем у ООО или ЗАО. В последнем случае надо учитывать налоги на прибыль (самое простое 6% от суммы заказа), зарплатные налоги, аренду офиса, амортизацию рабочего места, хоз. расходы и прочее.
  3. Организационной структуры заказчика. Разработка сайта для фирмы, где всё согласуется только с директором, дешевле, чем для холдинга, где каждую запятую надо согласовать в нескольких местах.
  4. Степени проработанности ТЗ. Чем оно подробнее, тем лучше. Любой раздел сайта, например форум, новости, форму заказа, каталог товаров можно сделать абсолютно по-разному.
  5. Количества этапов разработки сайта. Полный цикл разработки сайта может включать в себя сбор информации, аналитику, разработку прототипа, разработку эскизов дизайна, дизайн, программирование, вёрстку шаблонов, наполнение информацией, написание текстов, внутреннюю seo-оптимизацию, корректорскую правку, юзабилити-тестирование, нагрузочное тестирование, документирование, обучение сотрудников заказчика. Пропуск различных этапов обычно ведёт к уменьшению цены и качества.
  6. Профессионализма подрядчика. Чем он выше, тем дороже стоимость его работ. Он опытнее теоретически и практически, он знает все подводные камни.
  7. Планируемой суточной и пиковой нагрузки. Сайт для 100 посетителей в день и для 10 000 — это совсем не одно и то же.
  8. Сроков. Сделать сайт за 2 недели, потому что у нас уже реклама оплачена, а предыдущие подрядчики подвели, — это дороже, чем за 2 месяца.
  9. Степени загруженности подрядчика. Если все ресурсы заняты, то скорее всего цена на сайт будет больше. Надо привлекать фрилансеров или передавать работу на субподряд, а это дополнительные издержки.
  10. Степени проработки мелких деталей. Можно проставлять title на ссылки и alt на картинки, типографировать текст, делать 301 редирект с www на без www, уникальные заголовки, robotx.txt и sitemap.xml и так далее. А можно этого не делать, тогда сайт будет дешевле. И, конечно, хуже.
  11. Региона. Один и тот же сайт в Москве будет стоить дороже, чем в Новосибирске.
  12. Бренда. Сайт от Лебедева дороже, чем от малоизвестного разработчика с таким же качеством работы.


четверг, 23 февраля 2017 г.

Техническое задание

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

Давным-давно, будучи молодым, я думал, что у техзадания есть какой-то свой определенный шаблон, некий ГОСТ. Я долго его искал, но безуспешно. Перерыл все ТЗ всех компаний, что мне попадались, и нигде не было идеала. Остался даже такой осадочек на время, что ТЗ — это просто «отписка», мини-этап, который нужно сделать, чтобы скорее начать проект. У веб-студии в голове уже сформирована модель будущего сайта, зачем ее описывать — тратить время! Да и кто у нас тут специалист эпистолярного жанра, многие и запятых-то не расставят.

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

«Идеологическое». Техническое задание, составленное скорее как «отписка». Содержит общие фразы. Конкретика отсутствует. В быту называется «подписать и забыть».
«Логическое». Хорошо составленное ТЗ, прописаны многие моменты. Дана общая логика работы проекта и его частей. Вполне подходит для разработки сайта и объяснений с Заказчиком.
«Физическое». Максимально полное, прописана логика, структуры баз, схем обмена данными и пр. Имея под рукой такое ТЗ, сделать сайт может уже даже школьник.
Зачем вообще нужно ТЗ, спросим себя? Все просто! ТЗ является неотъемлимым приложением к договору на разработку проекта, и именно в ТЗ определен объем работ. Если завтра Заказчик на этапе создания сайта придет к вам и скажет, что нужно добавить еще пару разделов, — вы тыкаете его в ТЗ и говорите: «А вот и нет!» Без смеха. Приходят и говорят. И если в ТЗ четко не прописано, вы попадаете на дополнительный объем работ в том же старом бюджете и сроках.

Не пойду далеко за примерами. Месяц назад наша компания, поддавшись мотивационным срокам, за день составила техническое задание для проекта. Оно, естественно, получилось «идеологическим». Сегодня, разрабатывая проект, мы сталкиваемся с непонимаем между нами и Заказчиком. Вынуждены каждый раз спорить и отстаивать свою точку зрения, потому что банальная, казалось бы, «лента новостей» воспринимается Заказчиком вовсе не так, как она привычна для нас.

И другой пример. Почти месяц мы составляли техзадание для еще одного нашего клиента. Проведено несколько встреч, проработаны все моменты. В итоге ТЗ разместилось на 40 страницах. И это, мне кажется, еще не полный его вариант. Если бы позволяли сроки, можно было раскрыть его еще в полтора раза. Но сроки не позволяют. А они, кстати, таковы: ТЗ — один месяц, разработка проекта — полтора месяца. То есть этап разработки техзадания по длительности почти равен этапу разработки проекта. Way to go.

Как быть, ведь ТЗ обычно пишется после предварительной оценки проекта и сроков? Выход один — выделять составление техзадания в отдельный этап, который и оплачивается отдельно. Если Заказчика не устроит ваша оценка, то с этим ТЗ он сможет прийти в другую компанию и попробовать разработать проект у нее.

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

Всем отличной погоды, увидимся на пляже!