Страницы

вторник, 30 декабря 2014 г.

Барашки

Оставлял сейчас заявку на hoster.kz  и заметил, что с левой стороны экрана вылазит барашек при наведении мышки и поздравляет с новым годом. Очень круто. Дизайнеру респект, что было выделено время, для создания элемента, который делает настроение. =)


воскресенье, 28 декабря 2014 г.

Установка favicon

Два тега, которые универсально позволят отображать favicon на сайте:

1<link rel="icon" type="image/vnd.microsoft.icon" href="path-to/favicon.ico">
2<link rel="SHORTCUT ICON" href="path-to/favicon.ico">

Сам favicon я делаю на сайте favicon.ru - дизайнер делает простую картинку, а на сайте можно конвертировать ее в маленькое изображение формата .ico

Мета-теги для социальных сетей.

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

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



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

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

Facebook
VK
Google+
Twitter

С их помощью вы можете генерировать тэги для вашего сайта.
И вставить их в раздел <head>
</head>.

Для примера - после настройки видно полное описание сайта и выбирается специально отформатированная картинка. Вот пример с VK.









пятница, 12 декабря 2014 г.

Lucid Chart

Интересный аналог MS Visio, в котором можно работать онлайн. При этом бесплатная версия доступна взамен регистрации. Платные версии по хорошей цене. Основной функционал поддерживается. Уже использую.




понедельник, 1 декабря 2014 г.

Плавная прокрутка между ссылками внутри страницы (якорями)

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

<script type="text/javascript">
$(document).ready(function() {

$('a[href^="#"]').click(function(){
        var el = $(this).attr('href');
        $('body').animate({
            scrollTop: $(el).offset().top}, 1500);
        return false; 
});
    
});
</script>

Ссылка (якорь) внутри страницы делается следующим образом - элемент, к которому нужно передвинуть экран называется с решеткой вначале, например 

#home-anchor
<a href="#home-anchor">

Таким образом - при нажатии на эту ссылку экран переместится к элементу:

<div id="home-anchor">

При наличии скрипта внутри тега <head> переход будет плавный.