Уделим сегодня немного внимания оптимизация HTML кода, но не seo (это отдельный разговор), а обычной оптимизации, т.е. что можно сделать с кодом, чтобы он легче читался и не утяжелял страницу. Я понимаю, что у доброй половины человечества давно уже стоит выделенка со скоростью по 4, 10, а то и все 30 Мб, но тем не менее! Google пару лет назад обозначил, что скорость загрузки страницы влияет на ее ранжирование. Так что делаем выводы, после чего открываем редактор (будь то DreamWeaver, Notepad ++ или блокнот) и начинаем вносить правки. 6 способов оптимизировать html код

Если вы работаете в офисе на постоянном окладе, то фактически вы лишены головной боли по поводу поиска клиента (ну если вы не менеджер по продажам или по ведению проекта). Вы стабильно получаете свою зарплату вне зависимости от количеству работы. Понятное дело, что каждый будет рад меньшими объемам загруженности и максимальным деньгам Но сейчас перед нами стоит вопрос не как делегировать полномочия, чтобы освободить свое время под социальные сети/форму/аськи/скайпы, а как найти клиентов если вы работаете на фрилансе! Семь способов найти клиентов

Помимо дизайна сайтов я также занимаюсь и разработкой шаблонов для WordPress на заказ. Естественно каждый раз узнаю (или стараюсь узнать) что-то новое. И теперь вы сможете развиваться вместе со мной, т.к. каждый созданный шаблон будет освещаться (ну может, конечно, не каждый, а только тот, который может быть интересен). Вы узнаете что и как было реализовано.

Прежде, чем мы начнем, мой первый совет вам: прежде чем приступать к интеграции шаблона, продумайте логику вывода информации.
Как вывести в WordPress меню

В прошлых уроках мы рассматривали как повернуть текст и как добавить тень с помощью CSS.

Тема сегодняшнего урока: как скруглить углы с помощью CSS.

Для этого существует свойство border-radius. Поэтому если мы хотим всем углам в блоке придать одинаковый радиус скругления, пишем:


border-radius: 20px;
-moz-border-radius: 20px;
-webkit-border-radius: 20px;


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

CSS transform позволяет поворачивать, наклонять, перемещать и масштабировать элементы с помощью CSS. Firefox, Opera и Webkit-браузеры, конечно же, поддерживают это свойство. Ну а всеми “любимый” IE, как говорится, опять sucks.

Подробную информацию вы найдете на www.w3.org, указанной выше, а сейчас немного теории и примеров.

Чтобы трансформировать блок, прописываем в CSS к нему следующие параметры:


.classname {
transform: свойство;
-webkit-transform: свойство;
-moz-transform: свойство;
}


Пример трансформации блоков с помощью CSS

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

Внешняя тень


.shadow_out {
-moz-box-shadow: 5px 5px 5px #ccc;
-webkit-box-shadow: 5px 5px 5px #ccc;
box-shadow: 5px 5px 5px #ccc;
}


Внутренняя тень


.shadow_inner {
-moz-box-shadow: 5px 5px 5px #ccc inset;
-webkit-box-shadow: 5px 5px 5px #ccc inset;
box-shadow: 5px 5px 5px #ccc inset;
}

Пример красивого оформления тени с помощью css

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

Минусы - ну разве что лишний код и внешний ссылки. ну последний пункт решается за счет noindex и nofollow. Далее…

Есть желание БЕСКОРЫСТНО оформить с десяток групп в контакте. Мне это нужно в первую очередь для опыта. Ну и плюс портфолио.

Свыше 10 возьмусь за БЕСПЛАТНОЕ оформление тех групп, тематика которых мне покажется интересной. Делайте предложения!

С меня: оформление, рекомендации по структуре и наполнению для повышения конвертации.

Если вы еще не забили на отображение сайта (вашего или клиента) в Internet Explorer 6 (имеется в виду ie6, версии ниже в данной статье рассматриваться не будут), то наверняка уже сотню раз сталкивались с тем, что какой-нибудь мелкий “косяк” там да вылезет. Кроссбраузерная верстка, легко реализуемая в Opera, FireFox и Chrome, у вебмастеров порождает только чувство ненависти к Эксплореру, для коего приходится придумывать всякие ухищрения.

Вообщем, будьте готовы занести эту статью в закладки, ибо она будет предельно информативной и полезной:)

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

1. условные комментарии
2. хаки для CSS

Список условных комментариев и хаков для IE и CSS

Человек использует свой мозг далеко не на 100%, и даже не 50% (как правило, ученые называют цифры от 3 до 7%). Аналогичная ситуация творится практически во всех сферах. Мы предпочитаем использовать те приемы, с которыми работали ранее, тем самым не давай себе развиваться и забывая то, что знали ранее.

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

Эта статья для тех, кто только начал изучать HTML, или уже давно практикует верстку, но у него не хватает времени/желания для того, чтобы освежить свою деятельность новыми приемами. Список полезных HTML тэгов »