Статьи

120 советов, хитростей и уловок с 2009 года стоит вашего времени

Теперь, когда мы подошли к концу 2009 года, какие были лучшие учебники и статьи по веб-разработке и дизайну за год? Мы посмотрим на 120 из них!




В сегодняшнем видеоуроке мы будем создавать систему входа в систему с помощью PHP и MYSQL. Многие, многие функции будут рассмотрены; включая MySqli, подготовленные операторы, jQuery, классы, сеансы, файлы cookie и т. д. Я откусил больше, чем смогу пережить для сегодняшней передачи. Итак, я буду создавать Часть 2 в ближайшие пару недель, чтобы еще больше улучшить нашу систему.


13 января 2009 года в фильме Тора Хеденгрена «Другое»
Службы сокращения URL-адресов являются обязательными, если такие службы микроблогов, как Twitter, должны работать. Из 140 символов вы не хотите, чтобы URL, на который вы ссылаетесь, съели 100 из них. Или хуже, это может даже не соответствовать. Введите TinyURL и множество других сервисов, которые предоставляют вам более короткий пользовательский URL, указывающий на целевой сайт. Но почему бы не сделать свой собственный, используя Phurl? Давай сделаем это!


В сегодняшнем видеоуроке мы будем нарезать PSD, нарезать кубиками для Интернета и подавать на горячей тарелке. Наш дизайн отличается аккуратным чувством «Web 2.0» и предоставлен Джофри из ThemeForest.net. Обязательно посетите его профиль, если у вас есть такая возможность.


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


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


2008 год был очень хорошим годом для сообщества WordPress. Программное обеспечение неоднократно обновлялось, что привело к недавнему выпуску версии 2.7, и было создано много новых блогов, посвященных WordPress. Конечно, были обнаружены тонны новых хаков, которые помогли многим блоггерам улучшить свои блоги.

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


Можно с уверенностью сказать, что почти каждый современный веб-сайт использует ту или иную систему управления контентом (CMS). Хотя существует множество отличных бесплатных опций, которые предоставляют нам CMS для управления веб-сайтом (WordPress, Drupal и т. Д.), Не мешало бы заглянуть под капот и почувствовать, как работают эти системы.


Очевидно, это началось еще в 2003 году, но это привлекло мое внимание только через два года после этого. С тех пор он был помечен как интернет-мем, что интересно, потому что я впервые увидел его на плакате на вокзале недалеко от Лондона, а не в Интернете! Если вам интересно, что «это» здесь, вы идете.


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


В моем последнем посте я говорил об условиях, при которых в браузерах отображается страшный, продолжительный диалог скриптов. Браузеры прекратят выполнение скрипта, если они выполнили слишком много операторов (Internet Explorer) или когда механизм JavaScript работал в течение определенного времени (другие). Проблема, конечно, не в том, что браузер обнаруживает долгосрочные сценарии, а в том, что выполнение сценария занимает слишком много времени.

Смотрите часть 2 , часть 3 и часть 4 этой серии.



Здравствуйте и добро пожаловать в первую часть, которая, как мы надеемся, будет обширной серией, охватывающей основные аспекты языка программирования JavaScript и DOM API.
В то время как такие инфраструктуры, как jQuery, Prototype и MooTools, являются отличными способами устранения ошибок браузера и ускорения разработки, важно знать и понимать базовые технологии. В этой серии рассказывается, что вам нужно знать о JavaScript и объектной модели документа (DOM). Даже если вы клянетесь какой-то конкретной библиотекой, это все равно принесет вам пользу — знание того, как что-то работает под кожей, может быть только хорошей вещью!

Не забудьте оформить заказ 2


Сегодня Андрес научит нас, как использовать CSS-спрайты, чтобы улучшить время загрузки и уменьшить количество запросов HTTP. Как всегда, не стесняйтесь задавать любые вопросы в области комментариев.


Одна из лучших вещей в PHP — это прекрасный язык, в который можно просто «погрузиться», благодаря его широкой популярности. Любой, у кого есть возможность нажать «Поиск» в Google, может быстро создать программу. Однако это также вызывает серьезную критику в отношении PHP: найти и воспроизвести плохой код почти слишком легко.
Вот 10 ошибок PHP, которые любой программист, независимо от уровня квалификации, может сделать в любой момент времени. Некоторые из ошибок очень просты, но сбивают с толку даже самого лучшего программиста PHP. Другие ошибки трудно обнаружить (даже при строгом сообщении об ошибках). Но все эти ошибки имеют одну общую черту: их легко избежать.


Django — это мощный веб-фреймворк, созданный на Python, который следует за DRY (не повторяйте себя), и в него включены философии Это позволяет быстро создавать веб-сайты, предоставляя широкий спектр инструментов и ярлыков из коробки. Django чрезвычайно быстр и гибок — даже быстрее, чем все доступные PHP-фреймворки. В этой статье я познакомлю вас с Django и покажу, как создать простой список дел.


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


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


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


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


Контент не всегда должен оставаться видимым. Иногда его можно спрятать в самых неожиданных местах.

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


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



CSS 3 на горизонте, и мы все взволнованы. Благодаря последним обновлениям браузера разработчики могут начать работу с новыми, экономящими время новыми свойствами, такими как @ font-face. К сожалению, доступность этих функций ограничена ничтожной долей нашей общей базы пользователей. По крайней мере, на следующий год или около того нам нужно будет продолжать использовать альтернативы Flash и Javascript при встраивании шрифтов.
К счастью, новый претендент, CufÛn, сделал процесс невероятно простым. Что отличает это? Вместо Flash он использует смесь canvas и VML для визуализации шрифтов. Через несколько минут я покажу, как использовать любой шрифт, который вы хотите в своих веб-приложениях. В восторге?


Давайте попробуем что-то другое на Nettuts + сегодня. Любой дизайнер, который работал с большими CSS-файлами, согласится, что его основным недостатком является невозможность использования переменных. В этой статье мы узнаем, как реализовать переменные с помощью PHP и мода переписывания URL Apache.


Как некоторые из вас могут знать, я веду еженедельные серии видеороликов в блоге ThemeForest, которые учат новых разработчиков, как именно работать с PHP. Раз или два в неделю я выпускаю новый «эпизод», основанный на предыдущих днях. Чтобы расширить нашу аудиторию, я решил выпустить «День 13» здесь. Не забудьте подписаться на In The Woods, чтобы оставаться в курсе каждого нового выпуска.
Почему это так? Потому что у людей не всегда есть время для просмотра шестидесятиминутных видео. Публикуя короткие десятиминутные эпизоды, новички могут легко переварить каждый урок, вместо того чтобы перегружаться большим количеством информации, чем их умы способны усвоить. Если вы новичок в PHP и не знакомы с этой серией, я надеюсь, что вы подпишетесь и станете новым зрителем.


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


Прошлой ночью, задолго до того, как я должен был заснуть, я наткнулся на фантастический обзор «внешнего интерфейса». Это видео, которое обязательно нужно посмотреть, представленное Нейтом Коечли. Многие дизайнеры получат больше от этого видео, чем от целой книги. Нейт охватывает все: от недоиспользуемых тегов html, до типов документов и до соответствующих соглашений об именах. Я настоятельно рекомендую посмотреть его.


Уже существует множество учебных пособий по созданию слайдеров контента с помощью jQuery.
Так зачем писать еще один? Хотя я не думаю, что существующие уроки
неверно, плохо или иным образом неприемлемо, я не нашел тот, который отвечал бы моим потребностям.


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


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

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


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


Добро пожаловать в мою новую серию видео «Регулярные выражения для чайников». В течение примерно десяти видео я собираюсь научить вас, как использовать регулярные выражения в ваших приложениях Javascript и PHP. Как всегда, я предполагаю, что вы знаете абсолютно zip. Если вы еще этого не сделали, подпишитесь на нашу ленту RSS или подпишитесь на меня в Twitter, чтобы быть в курсе новых выпусков.

Также посмотрите на часть 2 , часть 3 , часть 4 и часть 5 в этой серии!



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


Несмотря на обширный кодекс, многие пользователи WordPress не знают, как создавать собственные плагины. В сегодняшнем скриншоте мы начнем с нуля и создадим наш первый используемый плагин. Для этого примера мы напишем простую функцию «форматирования», которая позволяет редактору блога более легко форматировать статьи.


В этом уроке мы собираемся создать скроллер изображений, используя отличные анимационные функции jQuery и, в общем, повеселиться с кодом. Изображение скроллеры, конечно, ничего нового; их версии выходят все время. Многие из них, однако, инициированы пользователем; Это означает, что для изменения отображаемого в данный момент содержимого посетитель должен нажать кнопку или выполнить другое действие. Этот скроллер будет отличаться тем, что он будет полностью автономным и начнет прокручиваться после загрузки страницы.


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


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


Мы вступаем в уникальный возраст; эпоха, когда простой поиск в Google может заменить профессоров. Когда студенты по всему миру решат, стоит ли тратить огромные суммы денег — во время финансового кризиса — на посещение университета этой осенью, они могут спросить: «Стоит ли это того?»

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


Понимание массивов является первой важной вехой при изучении кодирования. Поначалу массив — это непростая концепция, поскольку массив имеет много значений или элементов и может использоваться многими способами. Многие функции возвращают свои результаты в виде массива. Нет никакого способа обойти это, если вы хотите научиться кодировать, будь то на php, javascript или любом другом языке, вам нужно будет понять массив.


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

PE отличается от Graceful Degradation (GD) тем, что GD — это путь от сложности к простоте, тогда как PE — это путь от простоты к сложности. PE считается лучшей методологией, чем GD, потому что она имеет тенденцию охватывать более широкий круг потенциальных проблем в качестве базовой линии. PE является белым списком в черный список GD.


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


Вчера я опубликовал статью о том, как вы можете использовать собственную графику «пропускающего изображения», когда изображение не загружается с помощью MooTools. Вот как это сделать, используя jQuery.


Между Nettuts + и ThemeForest я получаю десятки вопросов по электронной почте каждую неделю. Хотя я стараюсь изо всех сил, у меня просто нет времени, чтобы найти ответ на каждый из них. Учитывая это, я решил время от времени публиковать статьи «Ask JW». Вопрос этой недели касается самозванных анонимных функций Javascript и задан Трэвисом.



Если вы такой большой разработчик WordPress, как я, вы можете обнаружить, что вам нужно создать новую установку для каждого сайта, для которой требуется странная структура или особые посты, вместо того, чтобы использовать обычную локальную тестовую установку WordPress. Cue WordPress Mu. Многопользовательский WordPress — это платформа, созданная гениями Automattic, которая в основном представляет собой установку WordPress, которая позволяет нескольким блогам работать с одним и тем же программным обеспечением.


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


Самым сложным аспектом работы Nettuts + является учет множества различных уровней квалификации. Если мы опубликуем слишком много продвинутых уроков, наша аудитория для начинающих не выиграет То же самое верно для противоположного. Мы делаем все возможное, но всегда не стесняемся, если вы чувствуете, что вас пренебрегают. Этот сайт для вас, так что говорите! С учетом сказанного, сегодняшний урок специально для тех, кто только погружается в веб-разработку. Если у вас есть год опыта или меньше, надеюсь, некоторые из перечисленных здесь советов помогут вам стать лучше, быстрее!
Без лишних слов давайте рассмотрим тридцать лучших практик, которые нужно соблюдать при создании разметки.


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


Среды Javascript превратили простые функции AJAX в однострочные. Это совершенно невероятно, учитывая тот факт, что для достижения той же цели с помощью необработанного Javascript потребуется более двадцати. Тем не менее, важно узнать, что находится «под капотом».

Не забудьте проверить часть 2 !


Эта статья проведет вас через процесс установки Ruby on Rails и любого другого программного обеспечения, необходимого для его использования.

Проверьте часть 2 .


У вас есть огромный массив элементов, которые необходимо преобразовать в список HTML, не доставляя пользователю никакого горя. Есть несколько распространенных способов сделать это:


Мне все равно, что мне скажут, безопасность PHP — это вопрос номер один, который меня беспокоит при написании сценария. Если бы вы непосредственно вводили данные из $ POST или $ GET в базу данных MySQL, вы могли бы (и, вероятно, будете) испытывать массу проблем. Сегодня я расскажу вам, как создать очень простую в использовании функцию очистки ввода в PHP.


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


Результат здесь был результатом некоторых случайных экспериментов с нажатиями клавиш jQuery за последние несколько дней. Я рекомендую вам использовать этот учебник как доказательство концепции, а не как конечный продукт.

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



В качестве продолжения «30 лучших практик HTML и CSS» на этой неделе мы рассмотрим JavaScript! После того, как вы просмотрели список, обязательно сообщите нам, с какими маленькими советами вы столкнулись!


Безопасность это горячая тема. Обеспечение безопасности ваших сайтов чрезвычайно важно для любого веб-приложения. На самом деле, я трачу 70% своего времени на защиту своих приложений. Одной из самых важных вещей, которые мы должны обеспечить, являются формы. Сегодня мы рассмотрим метод предотвращения XSS (межсайтовый скриптинг) и подделки межсайтовых запросов в формах.


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


Сегодня мы будем создавать простой форум с использованием Ruby on Rails, и мы будем работать над основами, охватывающими такие вещи, как аутентификация и более продвинутые методы работы с базами данных.


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


Расположенный в файле header.php большинства тем WordPress, есть важный хук, называемый wp_head (). Этот важный хук позволяет функциям выводить контент в браузер в

область веб-документа 1. В более новых версиях WordPress этот хук позволяет WordPress выводить следующие три строки в раздел вашей темы.


Я знаю, что jQuery отлично подходит для управления событиями, но мне было интересно, если вы нашли способ определить, был ли удален элемент DOM (скажем, строка в таблице)? У меня есть таблица, и я хочу запускать ajax-запрос каждый раз, когда tr был удален, но есть несколько способов удалить tr.


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


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


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



После многочисленных запросов сегодня мы запускаем новую серию скринкастов на Nettuts +, которая будет посвящена исключительно PHP-инфраструктуре CodeIgniter. В течение примерно 10 видео я научу вас, как именно использовать этот фреймворк. В конечном счете, мы будем работать над созданием собственной CMS. Без дальнейших церемоний, вот первый день!

И вы должны проверить часть 2 , часть 3 , часть 4 , часть 5 https://net.tutsplus.com/videos/screencasts/codeigniter-from-scratch-day-4-newsletter-signup/, часть 6 , часть 7 !


И Twitter, и Apple App Store используют блестящую технику для загрузки дополнительной информации; Вы нажимаете на ссылку, и свежие элементы волшебным образом появляются на экране. Это руководство научит вас использовать AJAX, CSS, Javascript, JSON, PHP и HTML для создания этой магии. В этом руководстве также будут представлены версии скрипта для jQuery и MooTools.


В этом руководстве мы собираемся создать страницу блога, используя методы следующего поколения из HTML 5 и CSS 3. Цель этого руководства — продемонстрировать, как мы будем создавать веб-сайты, когда спецификации будут завершены и поставщики браузеров их реализовали. Если вы уже знаете HTML и CSS, им легко следовать.


Продолжая наш обзор файлов htaccess, сегодня мы рассмотрим, как использовать mod_rewrite для создания красивых URL-адресов.


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


С тех пор, как я увидел API-интерфейс Bit.ly JavaScript, я хотел создать простой скрипт для отслеживания числа людей, посещающих пост в блоге из Twitter. На прошлых выходных я написал небольшой сценарий для этого — и совершенно незаметно.


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

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


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


Закрытие в JavaScript может быть просто описано как сохраненная область; по крайней мере, так я об этом думаю. Преимущество замыкания заключается в том, что оно сохраняет область действия («цепочку областей видимости») внешнего (или «родительского») контекста исполнения. Такое поведение может быть использовано несколькими различными способами и стало полезным средством для многих проблем с JavaScript; Одной из наиболее распространенных является «проблема с перекосами».


Это серия из трех частей, посвященная объектно-ориентированному PHP, способу управления вашим кодом и разделения отдельных частей, при этом все они легко доступны. Я на самом деле не планировал это таким образом, но моя предыдущая статья послужила хорошим предшественником этой статьи, показывая вам, как установить и запустить PHP / MySQL Sandbox, и это то, что мы будем использовать для этого урока, как я полагаю. На подходе это лучший способ научиться таким вещам.

И тогда вы должны прочитать часть 2 и часть 3 .



Webkit — один из немногих — если только — браузерных движков, который действительно использует расширенные эффекты CSS3. К сожалению, это представляет собой обоюдоострый меч. Мы можем поиграть со всеми этими удивительными эффектами — такими как маски CSS, отражения, переходы, анимация, масштабирование и т. Д. — однако мы не сможем по-настоящему внедрить их в наши проекты, пока больше браузеров не предоставят поддержку. С учетом всего вышесказанного важно быть на переднем крае того, что возможно.


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


Регулярные выражения являются собственным языком. Когда вы изучаете новый язык программирования, это маленький суб-язык, который не имеет смысла на первый взгляд. Часто вам приходится читать другой учебник, статью или книгу, чтобы понять описанный «простой» шаблон. Сегодня мы рассмотрим восемь регулярных выражений, которые вы должны знать для своего следующего проекта кодирования.


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


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


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


Web 2.0 — хорошая вещь. Вы можете создавать целые веб-сайты, новостные системы или галереи изображений — просто используя возможности контента, представленного пользователями.

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


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


Эл Гор изобрел интернет. Пить алкоголь держит ваше тело в тепле. Вы не забеременеете, если встанете на голову после … ну, вы поняли. Мифы — это те жесткие и быстрые правила, которые часто начинаются как правдоподобная идея или разовое наблюдение, которые растут и превращаются в «общие знания» по мере их распространения. Я знаю, что поверил некоторым из них. Я также попросил своих друзей по UX-Твиттеру рассказать о UX-мифах — и их много!


С тех пор как он впервые появился на Facebook, эластичные текстовые области — элементы <textarea>, которые автоматически расширяются или сжимаются в зависимости от объема вводимого пользователем текста, — стали одним из самых крутых функциональных эффектов пользовательского интерфейса в Интернете. В этой статье я проведу вас через воссоздание этого удивительного эффекта с помощью Ext JS, и держу пари, что вы будете удивлены, увидев, насколько легко это сделать.



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


Когда люди думают о конфигурации .htaccess, первое, что приходит в голову большинству людей, — это манипулирование URL с помощью переписывания модов . Люди обычно разочаровываются сложностью переписывания модов . Этот учебник проведет вас через все, что вам нужно знать для наиболее распространенных задач mod_rewrite.


Работа с формами XHTML может быть несколько сложной; они не только используют некоторые нишевые элементы HTML, но и стирают грань между статическим контентом и взаимодействием с пользователем. Давайте рассмотрим некоторые вещи, которые нужно помнить при создании следующей формы.


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

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


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


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


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

Вы хотите прочитать часть 2 , часть 3 и часть 4 .


Однопиксельное фоновое изображение может быть довольно универсальным. С repeat-x это может быть горизонтальная линия, repeat-y создает вертикальную линию, а repeat делает цвет заливки. В качестве небольшого забавного подтверждения концепции мы можем использовать его для создания неупорядоченного списка в виде таблицы глубины:


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


Шрифты являются огромной частью дизайна (как мы все знаем). Текст в Интернете должен быть гораздо более динамичным, чем в любом другом медиа. У нас есть решения, такие как CufÛn, sIFR и т. Д., Но, возможно, одним из лучших вариантов является использование @ font-face в CSS.



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


Вы когда-нибудь работали над таким громоздким проектом, что боялись обновить файл или добавить функцию? Возможно, проблема была в том, что вы не использовали систему контроля версий. В сегодняшнем уроке мы изучим основы того, что может быть лучшей VCS в мире: Git.


Мы все видели великолепную функциональность Mashable, где новости и интересные статьи могут быть опубликованы на сайтах социальных сетей; функциональность определяется изображениями, сопровождающими статьи; Вы нажимаете и удерживаете изображение, а затем можете перетащить его на панель инструментов, чтобы поделиться им. Это великолепно и интуитивно понятно, и в этой статье я собираюсь показать вам, как мы можем воспроизвести это поведение с помощью jQuery и jQuery UI.


Ленты. RSS. Атом. Syndication. Абоненты. Вот некоторые из ключевых слов, плавающих в Интернете, которые приобрели известность на протяжении многих лет. В этом руководстве мы рассмотрим ряд вещей, в том числе, что такое фиды, зачем вам нужен фид для вашего сайта, как его настроить, а затем опубликовать.


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

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


Одной из наиболее часто запрашиваемых функций браузера в недавней памяти является поддержка URI данных. Недавно было написано достаточно много о URI данных: мой коллега Стоян Стефанов написал пару постов о URI данных, а мой бывший коллега Хеджер Ван также написал статью о том, как использовать URI данных в IE. Удивительно, но все еще существует много недопонимания и путаницы в отношении URI данных, что они из себя представляют, как они работают и почему вы когда-либо захотите использовать один.


Еще один, достойный лба проклятый момент: я заполнил длинную онлайн-форму и нажал кнопку «Отправить», только чтобы обнаружить, что смотрю на пустую форму, усыпанную красными ошибками. Это с тобой случилось? Конечно, имеет.


В этом уроке по веб-дизайну в Photoshop мы собираемся создать макет чистого и современного веб-сайта. Это первая часть серии учебных пособий, которая покажет вам, как создать дизайн, а затем преобразовать его в шаблон HTML / CSS.


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


Эта статья в основном предназначена для людей, которые только начинают изучать jQuery. Я полагаю, вы знаете следующее.



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


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


Дуглас Крокфорд. Джон Резиг. Петр-Поль Кох. Николас С. Закас. Если вы узнаете эти имена, вы, вероятно, знаете, что у них всех общего: они удивительно талантливые разработчики JavaScript. Сегодня вы услышите от всех них в этом обзоре презентаций JavaScript. Будьте готовы растянуть свой мозг!


Nettuts + — это прежде всего PHP-убежище; однако я уверен, что мы все можем согласиться с тем, что в нашем распоряжении есть много фантастических и технически более мощных языков и структур. Джереми Макпик, автор Professional AJAX и Beginning JavaScript: 4-е издание, научит вас создавать приложения ASP.NET с нуля в течение следующих нескольких видеоуроков. Наслаждайтесь!

И часть 2 .


В последние годы все большую популярность приобретает JavaScript, отчасти благодаря библиотекам, разработанным для облегчения создания приложений / эффектов JavaScript для тех, кто еще не полностью освоил основной язык.
В то время как в прошлом был распространенный аргумент, что JavaScript был базовым языком и был очень «шлепком» без реального основания; это уже не так, особенно с введением крупномасштабных веб-приложений и «адаптаций», таких как JSON (JavaScript Object Notation).


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


Сегодняшние вопросы и ответы предоставлены Фредерико Гонсалесом из Twitter. Он спросил, есть ли простой способ добавить панель объявлений в верхнюю часть его сайта, очень похожую на ту, что есть на ActiveDen прямо сейчас (при условии, что вы не вошли в систему). К счастью, как вы увидите, довольно просто создать плагин jQuery, который сделает эти объявления несложными.


Сегодня мы начинаем первую часть серии из 8 частей, посвященной созданию веб-приложения с нуля до готового продукта. Я собираюсь начать с представления идеи, а затем я буду заниматься дизайном, пользовательским интерфейсом и общими вопросами интерфейса. Мы собираемся вернуться туда и обратно к блогу моего друга Джейсона Ленгсторфа Ennui Design. Джейсон будет работать с серверными компонентами, такими как планирование приложений и базы данных. В конце недели мы раскроем для вас актуальное рабочее приложение.

Вы должны будете прочитать часть 2 , часть 3 , часть 4 , часть 5 , часть 6 , часть 7 и часть 8 .


Вы были на сайтах, которые их используют, симпатичная маленькая контактная форма AJAX. AJAX — это отличный способ отправки данных без обновления страницы и отличный инструмент для определенных элементов веб-сайта, таких как форма контакта. Так как же мы поступим так? Сегодня мы сделаем это шаг за шагом и создадим вашу первую контактную форму AJAX и PHP. Мы будем использовать jQuery и популярный код проверки электронной почты, который можно найти в коде Google (изначально был добавлен AddedBytes), чтобы помочь нам.


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



Благодаря широкому внедрению таких библиотек, как jQuery и Mootools, популярность JavaScript за последние несколько лет резко возросла. Однако в процессе произошла интересная вещь: многие новые разработчики изучают эти библиотеки, не тратя время на то, чтобы на самом деле узнать о необработанных методах JavaScript. Какой процент пользователей jQuery не знает, как скрыть элемент только с помощью необработанного JS? Я думаю, что это намного выше, чем многие думают.

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

Эта серия экранов посвящена исключительно JavaScript и перенесет вас от первого предупреждения «Привет, мир» до более сложных тем.

Не забудьте посмотреть часть 2 и часть 3 .


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

И вот часть 2 .


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


Являетесь ли вы программистом или нет, вы видели это везде в сети. В этот момент адресная строка вашего браузера показывает что-то, начинающееся с «http: //». Даже ваш первый скрипт Hello World отправлял HTTP-заголовки, а вы этого не понимали. В этой статье мы собираемся узнать об основах HTTP-заголовков и о том, как мы можем использовать их в наших веб-приложениях.


CodeIgniter — это PHP-фреймворк с открытым исходным кодом и множеством функций. Недавно, благодаря последнему обновлению, в эту среду была добавлена ​​новая функция, называемая классом корзины. В этом уроке мы собираемся воспользоваться преимуществами этого нового класса и написать систему корзины покупок с добавлением jQuery.


Как правило, когда я имею дело с привязкой событий в jQuery, я использую это совершенно одноразовым способом. Это означает, что у меня редко есть несколько обработчиков событий, привязанных к одному и тому же элементу, и я редко использую всплывающее окно событий, при котором событие используется более чем на одном уровне дерева DOM. Поэтому мне никогда не требовалось более поверхностного понимания объекта события jQuery. Однако сегодня утром, когда я продолжал исследовать пользовательские типы событий в jQuery, быстро стало очевидно, что мое понимание объекта события на самом деле было критическим недоразумением.


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

Во второй статье мы сосредоточимся на использовании техник CSS (и небольшого количества JavaScript) для создания некоторых практических элементов и макетов. Как и прежде, Caveat Coder — многие свойства CSS, которые мы собираемся использовать, имеют ограниченную поддержку, если таковая имеется, в IE6 / 7 и, вероятно, 8. Firefox 3.5+ и Safari 4 — ваш лучший выбор прямо сейчас, чтобы увидеть все интересные вещи в CSS прямо сейчас (Chrome тоже неплохо работает).


Со времен Тима Бернерса-Ли CSS лучше всего случается с сетью. Это простой, мощный и простой в использовании. Но даже при всей своей простоте он скрывает некоторые важные возможности. Спросите любого дизайнера, и он скажет вам, что большая часть его головной боли вызвана и в конечном итоге решается с помощью CSS.


Три года назад я впервые выступил на Yahoo! озаглавленный, Поддерживаемый JavaScript ( слайды ). Смысл разговора состоял в том, чтобы побудить людей использовать более строгий код в JavaScript. Многие люди, которые пишут JavaScript для жизни, начинали как любители и хакеры, включая меня. Конечно, все лучшие инженеры-самоучки самоучки, потому что этому не учили в колледжах и университетах. Я воспользовался возможностью, чтобы просто указать, что те же методы кодирования, которые преподаются в традиционных программах разработки программного обеспечения, могут также применяться к JavaScript. И, конечно, я добавил некоторые из моих личных открытий, собранных за годы веб-разработки.


Когда кто-то комментирует ваш сайт, куки с введенной информацией сохраняются на их компьютерах. WordPress облегчает доступ к этой информации. На самом деле, в вашем шаблоне comments.php они представляют собой готовые переменные PHP, которые вы можете выкладывать в любом месте, где захотите. Давайте посмотрим.


Я не включил ни одной статьи из 24 Ways , потому что вы должны прочитать их все! (Если вы не в курсе, 24 Ways публикуют 24 статьи каждый год, с 1 по 24 декабря.) По той же причине нет статей из A List Apart .


Сбор всех этих советов, статей и статей был интересным опытом (когда-либо пытался работать с 30+ вкладками одновременно?). Как и я, я заметил — конечно, не в первый раз — тревожную тенденцию в сообществе веб-разработчиков: на многих сайтах пост за постом называлось что-то вроде: «предметное число прилагательное». Хотя некоторые посты в списке хороши (угадайте, что вы только что прочитали?), Ничто не сравнится с содержанием. Nettut + отлично умеет готовить отличные учебные пособия, приправляя их случайным списком. Мы надеемся, что в 2010 году появятся новые блоги веб-разработчиков и дизайнеров, следуя этой схеме!


У всех нас есть наши любимцы; какая статья из 2009 года помогла вам больше всего?

  • Подпишитесь на нас в Твиттере или подпишитесь на ленту Nettuts + RSS для получения лучших учебных материалов по веб-разработке.

Готовы поднять свои навыки на новый уровень и начать зарабатывать на своих скриптах и ​​компонентах? Проверьте наш родной рынок, CodeCanyon .

CodeCanyon