Originally published at Optimizator Field - блог веб разработчика. Please leave any comments there.

Большинство дизайнеров либо не разбираются в веб типографике, либо не хотят. Им нужно готовое решение для разных ОС – Windows, Mac или Linux. Те же, кто достаточно многое в ней понимают – могут чувствовать себя ограниченными в креативе, используя только безопасные шрифты.

Использование готовых групп шрифтов (CSS свойство font-face) поможет и тем и другим. Наборы сгруппированы по схожести с основными частоиспользуемыми шрифтами и составлены в такой последовательности: шрифт, его аналоги, кроссплатформенный аналог и общее название семейства.

Read the rest of this entry »

Originally published at Optimizator Field - блог веб разработчика. Please leave any comments there.

Для начала качаем, устанавливаем, НО не запускаем WebIDE.

Либо просто распаковываем инсталл (например, хорошей и бесплатной [и естественно портабельной B-) ] UniExtract)

Далее нужно поменять пути к настройкам(config) и плагинам(/config/plugins)

Системную папку (system) не трогать, т.к. она содержит индексы проектов и разрастается неимоверно – пусть так и лежит в папке юзера ОС.

А конкретнее, в папке «\WebIDE\bin\» правим файл idea.properties (строки 12-19):

idea.config.path=${idea.home}/.WebIde10/config
idea.system.path=${user.home}/.WebIde10/system
idea.plugins.path=${idea.home}/.WebIde10/config/plugins

Т.е просто поменяли ${user.home} на ${idea.home} и теперь все настройки будут в папке IDE!

Кстати, в плане портабельности Web IDE гораздо вкуснее MAIA – она весит на 150мб меньше :)

Originally published at YoYurec Field. Please leave any comments there.

Для осознания что это за зверь советую почитать замечательную статью от Вадима Макишвили – «Вёрстка в IntelliJIDEA». Часть №1 и Часть №2.

Но самое главное в моей заметке не это. Главное – новость о том, что…

JetBrains открыла программу EAP (Early Access Program) для JetBrains Web IDE. JetBrains Web IDE это IDE для веб программирования. Она построена на основе платформы JetBrains IDE Framework.

Web IDE доступна в двух вариантах: в стандартный вариант включена поддержка HTML, CSS, Javascript. В PHP Developer edition добавляется поддержка PHP и SQL.

Read the rest of this entry »

Originally published at Optimizator Field - блог веб разработчика. Please leave any comments there.

Яндекс приглашает в гости всех, кому интересно поговорить о HTML-вёрстке, CSS, API и обсудить эти темы за чашкой кофе. Пройдёт субботник 25 апреля.

Субботники ориентированы на разработчиков и проходят в комфортной, неформальной обстановке офиса Яндекса. Участие в Cубботниках бесплатное. Первое мероприятие из цикла Я.Субботник — «Верстка, API и другое…» прошло 31 января 2009 года.

Отличная идея делиться таким уникальным опытом веб-разработок! К сожалению, все места уже заняты, так что остаётся только читать отзывы и статьи, листать презентации и смотреть видео о прошедшем московском:

• Список докладов
• Видеоверсии
• Отчёт о поездке от Юрия “akella” Артюха
• Впечатления на хабре

PS: уже подсел на IntelliJIDEA!

Вёрстка в IntelliJIDEA. Часть №1

Вёрстка в IntelliJIDEA. Часть №2

Запись опубликована <ё> YoYurec Field

“Никак”, - быстрый ответ. А для особо любопытных - CSS Compatibility and Internet Explorer, объёмный документ из MSDN с громадным количеством сводных таблиц о поддерке IE5.0-IE8.0 тех или иных CSS селекторов, псевдоклассов…

Запись опубликована <ё> YoYurec Field

С пылу с жару! Как я рад, что пофиксил немного “Facebox” (особенно учитывая мои слабые познания js)!!!

Суть проблемы проста - .png рамки непрозрачны в ИЕ :(

Для этого перепробовал кучу решений и остановился на Ifixpng, плагине для jQuery, который фиксит прозрачность. Качаем, подключаем скрипт и инициализируем его на страничке:

1
2
3
4

jQuery().ready(function(){
        $('a[rel*=facebox]').facebox();
        $('#facebox td').ifixpng();   < ------
});

Ура, уголки стали прозрачными! Но у нас появилась новая проблема - ifixpng не поддерживает CSS свойство “background-repeat”, из-за чего некорректно ображаются рамки. Так что напильничком подрихтовываем стили facebox’а (facebox.css):

1
2
3
4
5

#facebox .b {
  background: #555;
  opacity: .70;
  filter: alpha(opacity=70); /* for IE6 support */
}

Теперь нам совсем не нужен файл “b.png” и с моего полупинка фейсбокс работает как и задумывал автор (которому, кстати, огромный респект)! Удачи!

Originally published at Optimization Field - блог веб разработчика. Please leave any comments there.

Привет всем! Извините, что давно не пишу – сейчас мало времени :(

Но думаю компенсировать в скором чем-нибудь новеньким. А пока…

Если вам вдруг интересен jQuery, и чисто случайно есть желание почитать о нём, но совсем нет времени искать ресурсы, то вам к Потапову Геннадию! Он собрал просто громадную коллекцию ссылок (Влад, было приятно увидеть там ссылку и на твой блог!) :

jQuery – The best JavaScript framework

Так что страничку в закладки, а «TermiT’s Blog» в подписку! :)

Удачи!

Запись опубликована <ё> YoYurec Field

После того, как Microsoft объявила (опять же), что они изменили способ обработки плагинов в Internet Explorer у веб-разработчиков добавилось проблем. Заключается она в том, что при вставке applet, object, или embed в HTML документ плагин не допустит взаимодействия с пользователем до тех пор, пока пользователь не нажмёт на него :(.

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

Итак…

SWFObject это небольшой Javascript файл, используемый для максимально лёгкой и валидной вставки флеш. Он помогает обойти дурацкую “защиту” в IE, работает во всех основных браузерах, дружит с поисковиками, вобщем мастхэв! Взгляните на демо-страничку скрипта.

В использовании предельно прост - подключаем файл swfobject.js и добавляем в код странички примерно такое:

Читать запись полностью »

Запись опубликована <ё> YoYurec Field

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

• Хорошее решение, с пошаговой инструкцией. Кроме этого рассказано о проблеме с темноватым изображением и не работающими ссылками при использовании PNG в качестве фона в IE. Из “минусов” - нужно использовать дополнительный класс у картинки.
• На известном 24ways.org похожее решение, но без дополнительных классов CSS. Использую его.
• Вариант для любителей jQuery тоже не мог обойти стороной.
• И на закуску полезная статья по работе с PNG в Fireworks от SitePoint.

Запись опубликована <ё> YoYurec Field

И пока не убежал с работы, ловите ссылку - Aptana! Ещё не смотрел, но судя по описанию весчь, которая должна быть у каждого вебразработчика!

…В Google группе “Вэб-мастер Клуб” проскочила ссылка на новый IDE для разработки вэб приложений на основе AJAX под названием “Aptana“. Не поленился, скачал и попробовал…

UPD: Статья на Сomputerra.ru

UPD2: Программа Aptana и видео уроки в UA-IX!!!

Originally published at Optimizator Field - блог веб разработчика. Please leave any comments there.

Поехали, сразу с середины статьи Alex’a Walker’a – New Windows and Usability: the Theory of ‘REL-ativity’. Вольный первод :)

До сих пор у всех нас есть шеф или клиенты, которые хотят от нас использования всплывающих окон, ну и конечно же, открытия внешних ссылок в новых окнах. Но использование аттрибута ‘target=»_blank»‘ в XHTML strict не является валидным :(

Использование 'href="javascript:...."' или 'href="#" onclick="..."' для всплывающих окон нам не подходит изначально – т.к. протокола javascript: нет, а # вообще никуда не ведёт – в любом случае при отключенном js пользователь окажется в неприятном положении :(

Итак, усовершенствуем ссылки…

Read the rest of this entry »

Запись опубликована <ё> YoYurec Field

Вебдевелоперская общественность довольна! :)

Originally published at Optimizator Field - блог веб разработчика. Please leave any comments there.

Искал давеча способ, позволяющий при нажатии кнопки «Submit» в форме, открыть её в новом окне. Нашёл, универсальный, т.к можно для popup окна задать все нужные параметры. Для начала в < head > надо вставить код:

1
2
3
4
5
6
7
8
9
10
11

<script type="text/javascript">
/*
Form2Pop Script- By Peter Bailey (http://www.peterbailey.net)
Featured on JavaScriptKit.com
Visit http://www.javascriptkit.com for this script and more
*/
function createTarget(t){
window.open("", t, "width=600,height=550");
return true;
}
</script>

А после подправить код в самой форме:

1
2
3
4

<form name="sampleform" method="POST"
action="/cgi-bin/formsubmit.pl" 
onsubmit="return createTarget(this.target)"
target="formtarget"></form>

Originally published at Optimizator Field - блог веб разработчика. Please leave any comments there.

Отличные статьи по теме от Ckovalev’a, опубликованные в Веб-отделе.

*«Клиент всегда прав? Я так не думаю.»

*«Разночтения и умолчания: повод для драки»

*«Театр одного эскиза: презентация дизайна»

Запись опубликована <ё> YoYurec Field

Вот оно! Наконец-то нашёл решение проблемы с кодировками. При переносе дампа из mysql3.х mysql4.х почему-то были одни вопросики вместо русских буковок.

Originally published at Optimizator Field - блог веб разработчика. Please leave any comments there.

Ура! Dave Child продолжил серию полезных шпаргалок (уже есть по CSS, PHP, MySQL). Теперь список пополнился шпаргалкой JavaScript Cheat Sheet. Статью про CSS-шпаргалку на русском можно глянуть на webmascon’e.

Запись опубликована <ё> YoYurec Field

Что касается фрейдовской трактовки слова “fuckability”, то оно означает “степень готовности (или “доступность”) к fuck mission”. Но, поскольку мы не заморачиваемся Фрейдом, посмотрим на трактовку в IT. Известно, что usability бывает хорошей и плохой. Но есть еще один вид usability - ебанутая, т.е. “per anus”. Собственно, идиотизм в области usability (плюс нестандартные, перпендикулярные извилинам, решения) и называется “fuckability“. (source)