Кратко суть верстки: внешний элемент a поставляет картинку начала кнопки (левая часть) и делать отступ слева на ширину это картинки, первый вложенный span добавляет конец кнопки и отступ справа, второй вложенный span заливает фон кнопки и объявляет ее высоту.  Последний вложенный span нужен для размещения текста кнопки по-середине.

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

Тестировалась и работает правильно в IE 7, Opera 10, Firefox 3.5, Safari 3.1.2, Chrome 3.0.195.27.

Демонстрация…

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

Естественно, что вопросов программисту PHP можно задать море. Особенно учитвая, что знать надо связанные области (БД, сети, HTML и иже с ним, Linux). Смысла задать все вопросы, какие только можно, конечно нету. Задача — определить уровень специалиста, чтобы принять решение: подходит он нам или нет. По-этому выбрал наиболее подходящие на мой взгляд вопросы, по которым я смогу оценить уровень кандидата.

Кроме того, конечно не одиними вопросами можно обойтись. Следует предложить пройти небольшие тесты по практическим моментам. Об этом ниже.

Вопросы

1. PHP и основы программирования
1.1. Почему PHP?
1.2. Что такое ООП, основные принципы ООП.
1.3. Понятие абстракции, наследования, инкапсуляции и полиморфизма.
1.4. Что такое MVC?
1.5. Какие паттерны проектирования вам известны?
1.6. Под какую версию PHP писали? В чем различия между четвертой и пятой версиями?
1.7. Какими сторонними библиотеками пользовались?
1.8. Опыт работы с различными Frameworks/CMS?
1.9. Типы данных в PHP? (string, int, float, object, resource, null, bool, array)
1.10. Назовите по памяти функции для работы с массивами, строками и объектами в PHP (хотя бы по 5 штук).
1.11. Что такое сериализация?
1.12. Чем отличается абстрактный класс от интерфейса?
1.13. В каких случаях лучше использовать статические методы и классы?
1.14. Можно ли создать приватный конструктор? Зачем?
1.15. Как сказывается большое количество объектов в коде на производительность?
1.16. Что такое хэш?
1.17. Что такое область видимости переменной?
1.18. Что такое PDO? Что такое ORM?
1.19. Что такое PEAR?
1.20. Когда лучше использовать mysql_pconnect?
1.21. Обязательно ли писать ?> в конце скрипта?
1.22. Как вы отлаживаете PHP-код?
1.23. Проводили когда-нибудь оптимизацию сайтов?
1.24. Какую IDE используете? Какие использовали ранее?
1.25. Что такое unit-test? Использовали?
2. Tools
2.1. Что такое Apache? mod_rewrite? nginx?
2.2. Аббревиатуры SVN и CVS о чем-нить говорят? А Git и Mercurial?
2.3. Багтрекинг системы? BugZilla? Mantis? Redmine? JIRA?
2.4 .Моделирование, UML использовали?
2.5. Что такое SSH? Какие есть варианты авторизации при входе по SSH?
3. Data Bases
3.1. Что такое реляционная база данных? Какие есть типы БД?
3.2. Нормализация, денормализация.
3.3. SQL. Join’ы, Union. Подзапросы.
3.4. Процедуры, тригеры.
3.5. Вьюшки.
3.6. InnoDB vs MyISAM.
3.7. Какие бывают индексы в MySQL?
3.8. В чем отличие MySQL от PostgreSQL?
3.9. Что такое SQL-инъекция? Приведите пример.
4. HTML + CSS
4.1. Нарисуйте простенькую форму для отправки файла.
4.2. Что такое CSS? В чем разница между записью #my и .my? Для каких атрибутов можно указать :hover?
4.3. Расшифруй вот такую запись в CSS table#a tbody td.odd {text-decoration:inherit}?
4.4. Что такое стандарты W3C?
5. JavaScript
5.1. Как работает наследование в JS?
5.2. Чем отличается хэш от объекта? (провокационный)
5.3. А хэш от массива?
5.4. Если ли опыт работы с Jquery, ExtJS? Какие фреймворки использовались?
5.5. Что такое Ajax? Есть ли опыт работы с ним?
5.6. Использовали ли FireBug? Drag-on-fly?
5.7. Что такое замыкания и как они работают?
6. Linux
6.1. С *nix знаком? Какие дистрибутивы? Почему?
6.2. Apache, PHP и СУБД устанавливали под *nix? Настраивали? Оптимизировали?
7. Networking
7.1. Что такое уровни модели OSI? Сколько их?
7.2. По какому протоколу осуществляется передача данных в сети Интернет?
7.3. Какие вообще есть сетевые протоколы?
7.4. Расскажите, что происходит, когда в строке браузера набираешь адрес и нажимаешь Enter?
7.5. Что такое WSDL & web-services? Есть опыт работы?
7.6. Что такое SSL? Как работает HTTPS? Какой принцип работы HTTPS? Какие есть варианты авторизации HTTP?
8. Что такое XSLT, XML? Есть ли опыт работы с ними?

Как отработает код?

1)
<?php
/* Что будет выведено на экран? */
$a = ‘true’;
if( 0 == $a || $a )
{
echo ‘yes’;
}

2)
<?php
/* Что будет выведено на экран? */
$a = 10;
echo $a– – - – - – - – - – - –$a;

3)

<?php
class A {private function __construct(){throw new Exception(»);} public function A(){return array(‘a’,'b’,'c’);} public static function I(){return new A();}}
/*
Как вывести на экран именно то ‘b’, которое определено в массиве выше, используя одну команду (одну строку кода)?
*/

4)
<?php

/*
Какая строчка выведется при исполнении скрипта?
Почему исполняется или не исполняется каждое из условий?
*/
$x = 1;
if ($x == ’1′) {
echo ‘a’;
}
if ($x == true) {
echo ‘b’;
}
if((bool)$x === true){
echo ‘e’;
}
if ($x === true) {
echo ‘c’;
}
if((int)$x === true){
echo ‘d’;
}

5)
<?php
/*
Что выведет скрипт? (запускается непосредственно)
*/
error_reporting(E_ALL);
ini_set(‘display_errors’,’0′);

print $x[0];
dddxxxx();

6)
<?php
/*
Для какой версии PHP будет работать этот скрипт?
Что выведет этот скрипт?
*/
class Test{

private $var;

function setMe($value){
$this->var = $value;
}
}

class More extends Test{
public $var;
}

$oTest = new Test;
$oMore = new More;

echo $oTest->setMe(‘foo’);

echo $oMore->setMe(‘foo’);

echo $oMore->var;

echo $oTest->var;

Тест на corp.mamba.ru

http://www.corp.mamba.ru/test/promo.phtml

Ссылки

А вот и те ссылки, которые помогли мне в составлении списка.

http://habrahabr.ru/blogs/php/21681/

http://habrahabr.ru/blogs/webdev/19964/

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

Моя конфигурация

Для начала, что собственно требовалось сделать? Сервер настраивался для Хаброметра. Он должен был выдавать статику (лого и css) и динамику (собственно страницы сайта и png-хаброметры). При этом, надо было учесть, что хаброметр создается на лету в том случае, если не лежит в кэше (а кэш чистится каждые 2 часа при запросе новых данных). Страницы сайта также необходимо кэшировать. Вот такая была задача.

Реализацию решено было сделать следующим образом. nginx при обработке запроса должен следовать следующим правилам:

1. Если запрошена статика, то просто вернуть ее (вся статика в папочке stuff).
2. Если запрошена страница сайта, нужно проверить кэш; если в кэше файл не найден, передать запрос бэкэнду apache. Кэш страниц должен чиститься с заданной частотой (для разных страниц частота разная).
3. Если запрошен информер, то нужно проверить кэш на наличие файла. Если файла там нет, передать запрос бэкэнду.

Для кэширования хаброметров выбрана файловая система. Все сгенерированные информеры складываются в каталог /image_cache/ и он чистится каждые 2 часа при обновлении исходных данных. Рисуются информеры и кладутся в этот каталог PHP-скриптом при соответствующем запросе.

Для кэширования страниц сайта выбран memcache, т.к. с ним легко и удобно работать (как из nginx, так и из PHP) и он сам может чистить кэшированные странички через заданный интервал времени, что ФС делать не может без дополнительных скриптов. Да и работать memcache будет побыстрее, т.к. все добро складируется в оперативке.

Получилась следующая конфигурация сервера:

# cat /etc/nginx/nginx.conf

user www-data;
worker_processes 2;
error_log  /var/log/nginx/error.log;
pid        /var/run/nginx.pid;

events {
    worker_connections  2048;
}

http {
    include       /etc/nginx/mime.types;
    default_type  application/octet-stream;
    access_log  /var/log/nginx/access.log;
    sendfile        on;
    keepalive_timeout  65;
    tcp_nodelay        on;
    gzip  on;
    add_header Habrometr "hacker_mode_enabled;)";

    server {
        listen       80;
        server_name  habrometr.server.valera.ws habrometr.ru www.habrometr.ru;
        access_log  /var/log/nginx/habrometr.access.log;
        location / {
            root   /home/habrometr/public_html;
            index  index.html index.htm;
            if (-f $document_root/image_cache${uri}) {
                rewrite ^.*$ /image_cache/$uri last;
                break;
            }

            set $memcached_key "habrometr$uri";
            memcached_pass localhost:11211;
            # если в memcached не найден ресурс, передаем запрос на апач
            error_page 404 502 504 = @backend;
            add_header Content-Type "text/html; charset=UTF-8";
            gzip on;
            gzip_proxied any;
            gzip_types application/octet-stream;
    }

    location @backend {
        set $proxy_uri http://habrometr.ru:99999$request_uri;
        proxy_pass $proxy_uri;
        proxy_redirect off;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header X_Forwarded-For $proxy_add_x_forwarded_for;
        proxy_connect_timeout 20;
    }

    location /image_cache/ {
        root   /home/habrometr/public_html;
        expires modified +2h; # кэш истекает через 2 часа после модификации файла
    }

    location /stuff/ {
        root   /home/habrometr/public_html;
        expires 30d;
    }

    location ~ /\.ht {
        deny  all;
    }

}

Учитывая приведенный выше сценарий, вся конфигурация должна быть понятна. Замечу лишь, что http://habrometr.ru:99999 — это apache, которому будут перенаправляться запросы. Порт я, конечно, изменил, в реальности обычно используют 8080 или что-то типо того.

Фокусы

А теперь о том, что нетривиального в этой конфигурации (во всяком случае для новичка в этой области).

Версия

Во-первых, сервер у меня работает на Debian 4.0. Весь софт я естественно ставил из стандартных репозиториев. Поставил оттуда и nginx. Установленный nginx оказался версии 0.4 при наличии последней версии 0.7 со значительным списком изменений.

Выяснилось, что версия 0.4 не умеет делать много из того, что было нужно. В частности:

1. флаг modified не сузествует для директивы expire, а мне это необходимо было для указания времени устаревания кэша информеров (2 часа после создания: expire modified +2h);
2. proxy_pass не умел использовать переменные, а мне требовалась эта возможность;
3. memcached не использовал переменную $memcached_key для определения ключа, т.е. нельзя было задать ключ нужного формата.

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

Перед тем, как описать процесс установки, замечу, что по умолчанию при сборке из исходников все файлы nginx складывает в каталог /usr/local/nginx. Его, конечно, можно изменить (–prefix=). Но обратите внимание, что установленных из пакетов nginx раскидывает свои файлы по соответствующим каталогам системы (/etc, /var/log, /var/run и т.д.), что лично мне определенно нравится больше, чем /usr/local/nginx/*. По этому я откомпилировал nginx из сырцов с настройками на системные каталоги, а потом вместо make install просто вручную заменил старый бинарный файл сервера в каталоге /usr/sbin на новый (/usr/sbin/nginx). Больше значимых файлов после сборки для сервера нет. Конфиг, естественно, остается тот же самый.

Итак, установка nginx на Debian etch из исходников поверх установленного пакета старой версии.

# wget http://sysoev.ru/nginx/nginx-0.7.31.tar.gz
# tar xzf nginx-0.7.31.tar.gz
# cd nginx-0.7.31
# apt-get install libpcre3 libpcre3-dev libpcrecpp0
# /etc/init.d/nginx stop;
# ./configure --sbin-path=/usr/local/sbin --with-http_ssl_module
--without-mail_pop3_module --without-mail_imap_module
--without-mail_smtp_module --prefix=/var/lib/nginx
--sbin-path=/usr/sbin --conf-path=/etc/nginx/
--error-log-path=/var/log/nginx --http-log-path=/var/log/nginx
--pid-path=/var/run --lock-path=/var/lock
# make
# cd objs
# cp -f ./nginx /usr/sbin
# /etc/init.d/nginx start;

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

Документы из memcached

Когда nginx отдает напрямую файлы, он передает заголовок Content-type в соответствии с типом данного файла. Когда nginx проксирует apache, Content-type приходит от apache. Но когда nginx забирает документа из memcached, то Content-type не устанавливается. А значит, используется дефалтный. А дефалтный у нас по конфигу default_type application/octet-stream;, и это правильно. В этом случае при отдаче документа из кэша будет неправильно передаваться тип и некоторые браузеры предложат сохранить бинарный файл, вместо того чтобы открыть HTML-страницу. Чтобы ситуацию исправить, в случае отдачи из memcached устанавливаем заголовки (и, кстати, сжатие тоже) дополнительно:

set $memcached_key "habrometr$uri";
memcached_pass localhost:11211;
error_page 404 502 504 = @backend;
add_header Content-Type "text/html; charset=UTF-8";
gzip on;
gzip_proxied any;
gzip_types application/octet-stream;

При этом из memcached мы получаем только HTML в UTF-8.

Мухи отдельно, котлеты отдельно.

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

if (-f $document_root/image_cache${uri}) {
    rewrite ^.*$ /image_cache/$uri last;
    break;
}

Если файл находим в кэше, то просто возвращаем его пользователю, сообщая что файл можно закешировать до времени следующего обновления (модификация файла + 2 часа):

location /image_cache/ {
    root   /home/habrometr/public_html;
    expires modified +2h;
}

Обратите внимание на наличие флага last у rewrite и директивы break; за ней. Без использования этих двух директив мне не удалось заставить nginx 0.4 (на 0.7 я не проверял) сразу перейти в секцию location /image_cache/, т.е. после обнаружения файла он переходил к проскированию, что неверно.

А вот таблица по количеству поисковых запросан на Яндексе за месяц:

Выводы (кратко). Не забывайте, что статистика рабочих мест касается только Беларуси, а поиска — только рунета.

1. PHP все еще актуален и в лидерах. В то же врмемя, раз много ищут в яндексе, значит много новичков и чайников им интерисуются.
2. C# жжот.
3. HTML ищут много. Профессионалам по HTML искать почти нечего, вывод — студенты, новички все еще атакуют :)
4. Java-программеры давно поняли, что помощь надо просить у гугла. Тех, кто еще не понял, осталось мало :)
5. JavaScript солидно отстает по популярности от того же PHP.

Теперь выводы из поиска вакансий/резюме.

1. Ищут в основном Java-девелоперов. Причем, как спрос, так и предложение (относительно других языков) велики. Специалисты могут выбирать, имеют возможность менять работу в поиске лучших условий и з/п.
2. С#: спрос в 3 раза превышает предложение. Ищут много, большенство уже нашли себе теплые места и сидят там :) Ждем лета-осени, когда работу начнут искать выпущенные студенты… (тут сказали, что нихера не ждем, потому что распределение и все дела. Ну и ладно, значит не ждем :)
3. Delphi: мест мало, резюме много. Дельфи знают многие, это популярный язык у чайников. Но серьезные конторы не работают с этой средой.
4. C++: все хорошо, все на своих местах…
5. PHP-программистов не хватает. Всех хороших разобрали, плохие никому не нужны. Однако, и спрос, и предложение, меньше традиционных системных языков. Сайт-бум прошел.
6. Python и Ruby: есть мизерный спрос, предложение нулевое. Эти языки у нас не популярны. Больше как хобби расматриваются.
7. SQL жив. Правда программировать на нем довольно грустно и сложно (имеется в виду программирование бизнес-логики в хранимых процедурах), потому предложение в 3 раза меньше спроса. Но при этом, в большенстве вакансий ищут не SQL-разработчика, а c++, php, c#, а SQL только прилагается. Это объясняет второе место после Java. А вообще, банки атакуют :)
8. JavaScript и HTML получили 3-е и 4-е места только потому, что они вечно к чему то прилагаются. В основном к PHP и C#.

Короче говоря, лучше всех живется джаверам: огромный спрос, относительно спроса малое предложение :)

Рейтинг основан на количестве разработчиков на данных языках по всему миру, количеству различных курсов и производителей, использующих те или иные языки. Для рассчета рейтинга используются популярные западные поисковики Google, MSN, Yahoo!, и YouTube. По-этому, не стоит понимать данный рейтинг, как выбор лучшего языка программирования, или показателя количетсва написанных строк кода на предствеленных языках.

Итак, предствим 20-ку лучших. Позиции с 21 по 50 представлены на сайте-источнике.

Status обозначает принадлежность языка программирования к группе основных используемых (A) или второстевенных (B). A- означает сдвиг в сторону второстепенных.

Как видно, Java лидирует и за год набрал 2,6% пользователей. За ним идет Си, который не поменял позиции. А вдвоем они держат 35% рынка (если так можно выразиться).

Не совсем понятно поднятие на 2 позиции Visual Basic. Он обогнал PHP, который сумел удержаться. Зато 2 позиции сдал C++. Это падение как раз объеснимо: +1 позиция C# и +3 позиции Delphi немного потеснили C++. Эти 3 языка можно включить в одну группу взаимозаменяемости.

JavaScript, который сейчас, казалось бы, на пике популярности, сдал 3 позиции. Почему? Рискну предположить, что пользователи стали меньше искать по JS в поисковиках за счет появления фрейморков. Программировать на нем стало проще, он стал меньше обсуждаться.

6-ю и 7-ю позиции Perl’а и Python’а мне честно говоря вообще сложно объяснить. Казалось, что первый давно забыт, а второй используется довольно редко. Возможно Python удерживается и за счет того, что до сих под активно используется в Google.

Интересно так же то, что в 20-ку нагло ворвались Pascal и Lua (+5 позиций). Неужели на Pascal еще пишут софт?

Вообще, рейтинг довольно спорный, но интересный :)

Источник: http://www.tiobe.com/index.php/content/paperinfo/tpci/index.html