Максим Покровский

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

Сейчас работаю над:


  • Разработка одного стартапа

    Текущий статус - разработка дизайн.

  • Много всего для popsop.com

Заказать мне работу
16.08

Центрирование “плавающего” меню

Комментарии (5) CSS

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

html, body {
    margin: 0; padding: 0;
    font-family:Tahoma, Arial, Helvetica, sans-serif;
    background-color: #fff;
}

.navi {
    width: 775px; /*Устанавливаем фиксированную ширину*/
    position: relative;
    overflow: hidden;
    font-size: .8em;
    border: 1px dotted red;
    text-align: center;
    margin: 5px auto;
}

.navicontainer {
    float: left;
    left: 50%; /*Сдвигаем влево на 50%*/
    position: relative;
    text-align: center;
    border: 1px dotted green;
}

.wrpr {
    position: relative;
    left: -50%; /*Возврашаем меню точно в центр*/
    float: left;
    list-style: none;
    margin: 0; padding: 0;
    border: 1px dotted blue;
}

.navi a, .navi li  {
    float: left;
    padding: 10px; margin: 0;
    color: #3B6783;
    font-weight: bold;
    text-decoration: none;
}

.navi li {padding: 0; margin: 0;}

.navi a:hover {
    text-decoration:none;
    background: lightblue url(navirobg.gif) repeat-x 0 0;
}

.navi li a:hover {
    background: lightblue url(navirobg.gif) repeat-x 0 0;
}

Раскладка включает в себя два блока для позиционирования и собственно меню

<div class="navi">
    <div class="navicontainer">
        <ul class="wrpr">
            <li><a href="#">Item # 1</a></li>
            <li><a href="#">Next item (# 2)</a></li>
            <li><a href="#">Do you have another item?</a></li>
            <li><a href="#">#4</a></li>
            <li><a href="#">What about more</a></li>
            <li><a href="#">Done</a></li>
        </ul>
    </div>
</div>

Рабочий пример
Автор: Alex Mauzon

Добавить в закладки
Метки:,
14.08

Чистота кода и SEO

Комментарии (6) CSS, HTML, SEO

Я решил рассмотреть проблему «замусоренности» кода не с позиции профессионализма или красоты (пеньку понятно, что чем красивее код, тем больше ваш уровень как специалиста), а с позиции посещаемости сайта, но для начала поясню, что я подразумеваю под понятием чистый код.

Все стили вынесены в файл
Со скриптами ситуация сложнее, но по возможности тоже в один файл.
Скажем нет формированию отступов через  
Таблицы хороши в меру. Если у вас есть хотя бы одна вложенная таблица – это серьезный повод задуматься.
Чем меньше контейнеров тем лучше.
Использование селекторов CSS здорово улучшает код.
Использование CSS, вообще, здорово улучшает код ;)

Если ваша страница быстро и легко грузиться, если ваш …

Читать далее

09.08

Изящное отсеивание спама

Комментарии (8) CSS, HTML

Делаем в форме дополнительное поле и прячем его стилями от пользователя. Пользователь не видит поле и не заполняет его, а бот заполнит. Затем проверяем поле на стороне сервера на заполненность. Все! По утвердению автора, после этой процедуры спам стремится к нулю

html:

Name:
      Email:
      Comment:

Читать далее



— Люди делятся на заказчиков и тех, кто может ими стать.
(девиз успешного фрилансера)

Rambler's Top100