Обновить
358.06

Веб-разработка *

Делаем веб лучше

Сначала показывать
Порог рейтинга
Уровень сложности

Про резиновую верстку

Время на прочтение1 мин
Количество просмотров29K
Навеяно этим.

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

Как сделать? min-width и min-height.

#site {
  margin: 0 auto; /*это чтоб центрировать контент при превышении max-width*/
  min-width: 980px;
  max-width: 1500px;
}


Но ведь IE их не поодерживает. А expression слишком нагружает браузер… Спокойно, други! Я выведу вас к свету из тьмы!
Пишем далее.



А в ie.js помещаем

window.attachEvent('onload', mkwidth);
window.attachEvent('onresize', mkwidth);

var minwidth = document.getElementById("site").currentStyle['min-width'].replace('px', '');
var maxwidth = document.getElementById("site").currentStyle['max-width'].replace('px', '');
function mkwidth(){
    document.getElementById("site").style.width = document.documentElement.clientWidth < minwidth ? minwidth+"px" : (document.documentElement.clientWidth > maxwidth ? maxwidth+"px" : "100%");
};


В чём особенная вкусность приведённого метода? А в том, что минимальное и максимальное значение нужно задавать только в одном месте, ну и вообще.

Пользуйтесь, короче, на здоровье!

Почти таргетинг

Время на прочтение5 мин
Количество просмотров729
Позвольте рассказать вам одну историю, случившуюся в 2002 году. (Точная дата подзабыта, но год именно этот.) Как и множество других историй — она длинновата, но, в отличие от некоторых историй — правдива.

Пока разработчики Нетскейпа готовили новый релиз Мозиллы, браузера, от которого мы «отбранчили» Навигатор, мы в группе Technology Evangelism/Developer Support (TEDS) проверяли его на популярных и партнерских сайтах. На некоторых из них верстка расползалась. В одном случае — очень серьезно.

Читать дальше →

Microsoft пытается подмять веб-стандарты под IE8

Время на прочтение1 мин
Количество просмотров919
Возможно, я глубоко ошибаюсь в заголовке; очень хочется услышать мнение Хабралюдей по поводу того, как в IE8 предполагается «решить» проблему рендеринга старого HTML-кода, напичканного хаками для IE6 / IE7 (вот оригинальная статья с A List Apart, плюс Джон Резиг по этому же поводу).

Вкратце — Microsoft предлагает ввести специальный мета-тэг X-UA-Compatible для обозначения версии целевого браузера, чтобы IE8 мог корректно отображать страницы, созданные ранее для его предшественников.

Update: интересно, как на это отреагируют онлайн-сервисы создания веб-страниц, например, движки MovableType, WordPress и прочая. От их решения будет зависеть развитие ситуации, верно?

Мнения разработчиков о действиях Microsoft в плане поддержки стандартов

Время на прочтение3 мин
Количество просмотров696
В связи с сообщениями о том, каким образом разработчики Internet Explorer планируют решить проблему поддержки стандартов и соблюдения качественного просмотра страниц, многие известные личности в своих блогах и интервью высказали собственное мнение по данному вопросу. Учитывая их опыт и знания вопроса следует, видимо, с повышенным вниманием отнестись к тому, как они понимают ситуацию и какие видят перспективы. Вот краткие тезисы их статей:
Читать дальше →

Опубликован черновик HTML 5

Время на прочтение1 мин
Количество просмотров1.3K
Консорциум W3C опубликовал первый черновик спецификаций HTML 5. Помимо уже обсуждаемых ранее тэгов <video>, <audio> и <canvas>, планируются такие возможности, как соединение с базами данных на стороне клиента, открытие новых сетевых соединений через TCP и Bluetooth, и многое другое. Общее впечатление — HTML 5 направлен на ещё большее стирание граней между компьютером и интернетом.

Спецификации HTML 5

Источник новости

Мелочи жизни — валидный код для Спайлога.

Время на прочтение1 мин
Количество просмотров688
Может я, конечно, «Америку открываю», но авось кому пригодиться… При «полировке» сайта обнаружил, что Спайлоговский счетчик не проходит валидацию на validator.w3.org. В принципе, все и так работало, но, как говориться, мелочь, а неприятно… :)
Читать дальше →

Опыт верстки под Pocket PC на примере

Время на прочтение4 мин
Количество просмотров953
Не так давно я запустил небольшой проект, призванный помочь «мобильным» людям объеденяться, общаться на форуме, меняться мыслями на хабраподобных блогах итп. Однако, как правильно было замечено в комментариях, проект якобы «мобильный», а с мобильных устройств он смотрится хреновенько, не смотря на валидную xhtml верстку итп. «Черт подери», — подумал я, включил свой FS loox n560 и начал потихоньку переверстывать темплейты для pda версии.
Сначала я думал обойтись подключением «handheld.css» и написанием КПК-ориентированных стилей, как я это делаю обычно для «печатных» версий. Но достаточно быстро понял, что не все проблемы можно решить с помощью CSS. Тем более принцип построения тех же «печатных» страниц сводится обычно к: «Это скрываем, это скрываем, это переносим сюда, это туда, а это тоже скрываем». Все же мы имеем дело с мобильными устройствами и грузить лишний траффик, чтобы в итоге не отображать его это глупо… В итоге пришел к тому, что следует не только CSS стили переписать, но и шаблоны переверстать. Начал с более маленького и простого проекта, чтобы попрактиковаться…
Читать дальше →

Tag Systems

Время на прочтение2 мин
Количество просмотров1.4K
Ну и что, скажите, сложного в том, чтобы вешать в своей системе на все единицы контента N тегов, и после делать по этим тегам выборку с системой релевантности и важности связей? Да ничего в этом сложного нет, ибо это типовая задачка по проектированию БД из 10го класса! Что? Вы всё ещё кипятите? Ну тогда я расставлю быстренько все галочки :)

Итак, задача: Иметь возможность маркировать любой контент в системе «ключевыми словами», по которым позже делать выборку для получения списка данных, маркированых точно такими же ключсловами.
Подробности...

Немного практики: «горячие клавиши» средствами jQuery

Время на прочтение4 мин
Количество просмотров11K

Предисловие



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

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

Правда? И как же?

Динамический Favicon

Время на прочтение1 мин
Количество просмотров5.9K
Небольшое эссе о том, как менять Favicon без перезагрузки страницы.

Недавно перед нами стояла задача как динамически менять Favicon без перезагрузки страницы. Решение «в лоб», т.е. замена значения href у favicon link ничего не дала, пришлось крепко задуматься и начать пробовать все возможные альтернативные варианты. Сработал способ пересоздания ноды link в документе. Это удалось заставить работать везде, кроме Internet Explorer. Есть подозрение, что ему не нравится имя файла с иконкой или его формат (PNG).

собственно, код

Веборуб 2008 Ice — первая НЕконференция

Время на прочтение1 мин
Количество просмотров576
Веборуб 2008
8 февраля в подмосковном Бекасово откроется «Неконференция» профессионалов веб-разработки ВЕБОРУБ Ice 2008. Самое приятное — на полный двухдневный марафон (проживание, питание) цены снижены вдвое, а однодневное участие и вовсе бесплатно! (читай — бесценно!)

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

Важный момент — полный запрет на спонсоров, поэтому никаких рекламных презентаций — только опыт, опыт и ещё раз опыт.

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

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

jQuery обновилась до версии 1.2.2

Время на прочтение1 мин
Количество просмотров707

14 Января, 2008г. вышел очередной релиз популярной javascript библиотеки, которой я пользуюсь уже почти год. Хабр насчитал 45 хабратопиков по слову jQuery, поэтому, тем кто не знает что это за магия — рекомендую ознакомиться.

Этот релиз не привносит ничего революционного (вспомните релиз версии 1.2), а лишь насчитывает около 100 багфиксов, несколько улучшений и парочку feature requests. Подробнее можно посмотреть на баг-трекере

p.s. Видимо не только я один воспринимал новогодние праздники как способ эффективно заняться своими проектами…

Ближайшие события

Lightwindow — функциональный клон Lightbox

Время на прочтение1 мин
Количество просмотров2.2K

Основное отличие от оригинала в том, что Lightwindow позволяет просматривать не толко картинки, но и практически все что угодно:
  • Media: Movies, Flash (с «подгонкой» под размер окна), PDF..
  • Веб страниц (включая, по внешней ссылке)
  • Формы
  • … любой веб-контент
Читать дальше →

А все таки — нужна ли полная кросс-браузерность?

Время на прочтение2 мин
Количество просмотров2.1K
Всякий раз, когда начинаю переделыватть дизайн сайта, натыкаюсь на одни и те же грабли: делаю красивый, лаконичный HTML, к нему красивый, лаконичный CSS, гляжу в FireFox, гляжу в Opera — все супер. Гляжу в IE… И произношу фразу состоящую из сплошной ненормативной лексики. Или две фразы… Думаю, очень знакомое местной тусовке чувство.

Обычно, на всех дизайнерских сайтах, на сей счет написана стереотипная фраза: это проблемы веб-программиста, а не клиента, нужно делать кросс-браузерный код любыми усилиями!

Но, давайте проведем аналогию:
Читать дальше →

Lightview — очередной превьювер изображений

Время на прочтение1 мин
Количество просмотров3.8K


Нашел вот такой вот превьювер для изображений, написанный на javascript'е c использованием библиотек Scriptaculous и Prototype.

Переводить не хочу, на сайте все прекрасно и просто описано, вообще принципиальных отличий от всякий Lightbox'ов я не увидел, разве что края закругленные. И еще — это чудо использует Canvas и VML для прорисовки изображений.

В любом случае — может кому и пригодиться. Удачи!

www.nickstakenburg.com/projects/lightview

Blitz Templates

Время на прочтение2 мин
Количество просмотров3.9K


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

Читать дальше →

Ссылки доверия

Время на прочтение2 мин
Количество просмотров775
Уточнение. Эта… хмм… статья была изначально опубликована в моём личном блоге и хорошенько там поднялась, получив несколько приятных отзывов. Теперь благодаря наличию позитивной кармы я переношу статью в общественный блог, так как мне интересны мнения тех многих людей, которые её ещё не прочли. Если я сделал что-то нехорошее, минусуйте конечно, но только объясните что именно. Заранее спасибо )

Описание проблемы
Если кратко, то проблема описывается так: хочется откомментить или посмотреть, но нельзя. Допустим мне прислали ссылку на статью/пост/комментарий с вопросом «А ты что думаешь об этом? Откомменть, поддержи меня!» Перейдя по ссылке я вижу что-то вроде «Дорогой посетитель, ты этого не увидишь/не откомментишь потому что ты не зарегистрирован. Иди-ка ты… зарегистрируйся.»

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

Читать дальше →

Векторизация растровых логотипов

Время на прочтение1 мин
Количество просмотров45K
На самом деле, не только логотипов, но и других рисунков/фото и прочих растровых изображений. Возможно у многих возникала такая потребность, увеличить логотип изображения, либо вручную было необходимо обрисовывать в фотошопе векторными линиями, что бы добиться более лучшего результата, чем исходное (как правило маленькое) изображение.

В любом случае, для всех, кому было необходимо векторизовать изображение (отсканированное, сфотографированное).

VectorMagic — онлайн векторайзер. По качеству результата, превосходящий оффлайновые standalone приложения такие как Adobe Streamline и Corel.

Этот сайт был разработан двумя энтузиастами из Лаборатории Искусственного Интеллекта Стэндфордского Университета (James Diebel & Jacob Norda).

Они разработали воистину хороший стартап(?), который имеет отличное качество векторизации. В общем, судите сами.

UPD: так как такая тема оказывается уже была, я хотел бы узнать, существую ли программы, по качеству лучше чем Adobe Streamline и Corel, для оффлайновой векторизации изображений? А то я таких не находил.

Бойтесь браузеры — ACID 3 грядет!

Время на прочтение1 мин
Количество просмотров871
John Resig опубликовал в своем блоге предварительную информацию об ACID 3 и первые скриншоты для разных браузеров. Тест стал сложнее и теперь можно увидеть не только изображение, но и численную оценку качества браузера (эталонное изображение):

Под катом скриншоты браузеров, про технические данные о тесте и его статусе, можно прочитать в блоге по ссылке выше.
Читать дальше →

Вклад авторов