Содержание выпуска:

Длительность: 23 мин. 11 сек. Размер: 11 Мб. + 12 Мб. Скачать часть 1 (резерв) Скачать часть 2 (резерв) Скрипт редактора и схема

Если Вы создаете динамический сайт с использованием технологий PHP+MySQL, то Вы, наверняка, задумывались над тем, как же обеспечить полноценное редактирование страниц сайта через админский интерфейс.

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

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

В данном случае я использовал бесплатный редактор CKEditor. Как этот редактор выглядит и работает Вы можете посмотреть на сайте разработчика.

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

Длительность: 14 мин. 41 сек. Размер: 17,7 Мб. Скачать видеоурок (резерв) Плагин TipTip+jQuery

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

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

Также можно менять события, по которым будет происходить появление подсказки. По-умолчанию, подсказка появляется при наведении курсора мыши на объект. Но при желании, можно повесить ее на клик по объекту и на получение объектом фокуса.

Плагин очень легкий по размеру, два файла (css и js), которые нужны для работы, весят менее 10 Кб (это не считая jQuery).

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

Есть даже возможность размещать в подсказке HTML-код!

В общем, во всех отношениях приятный скрипт. Пользуйтесь.

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

Но ложка дегтя все-таки есть. Текущая версия скрипта плохо дружит с браузером IE. Но обновляется скрипт постоянно, так что, думаю, через неделю-другую это недоразумение будет исправлено.

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

1. Сервис ViewLike.us

Первый сервис, о котором я хотел рассказать, в переводе будет звучать "Смотри, как". Если развернуть название, то оно будет звучать так: "Смотри, как будет смотреться твой сайт в разных мониторах и устройствах".

Как правило, когда мы разрабатываем сайт, мы видим его внешний вид только в рамках своего монитора, а это не есть хорошо.

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

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

Чтобы решить эту проблему можно воспользоваться этим сервисом и посмотреть, как будет выглядеть Ваш сайт на мониторах с разной разрешающей способностью, а также на таких устройствах как iPhone и Wii-browser.

2. Сервис MyFonts

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

Мне часто пишут люди и спрашивают: "Евгений, а какой шрифт вы использовали в шапке своего сайта или в каком-то баннере?".

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

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

Сервис работает в два этапа.

1. Вы загружаете изображение или даете на него ссылку и жмете кнопку "Continue".

2. Сервис пытается определить, какая фраза была на изображении и выдает Вам свой вариант. Если в представленном варианте есть ошибки, Вам надо их исправить и снова нажать "Continue". На следующем экране Вы увидите результаты в виде списка шрифтов, максимально похожих на искомый.

3. Сервис TYPETESTER

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

Все, что Вам нужно сделать, это в поле "Sample text" ввести текст, который Вы хотите протестировать, и настроить все варианты, которые Вам нужны.

Например, можно в первом варианте поставить шрифт Verdana, во втором Tahoma, а в третьем Arial и, что называется, почувствовать разницу.

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