Open-sans, оптимизация шрифта, как реализовать?

Я оставил:

body,
html {
  font-family: 'Open Sans', Arial, sans-serif;
  font-size: 14px;
  height: 100%;
  font-weight: 400;
  color: #000;
  background: #fff
}

@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 400;
  src: local('Open Sans Regular'), local('OpenSans-Regular'),
    url('opensans/opensans-regular.woff2') format('woff2'), /* Super Modern Browsers */
    url('opensans/opensans-regular.woff') format('woff'), /* Modern Browsers */
    url('opensans/opensans-regular.ttf') format('truetype'), /* Safari, Android, iOS */
}

@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 600;
  src: local('Open Sans SemiBold'), local('OpenSans-SemiBold'),
    url('opensans/opensans-semibold.woff2') format('woff2'), /* Super Modern Browsers */
    url('opensans/opensans-semibold.woff') format('woff'), /* Modern Browsers */
    url('opensans/opensans-semibold.ttf') format('truetype'), /* Safari, Android, iOS */
}

и вес такой: в районе 150 килобайт

Open-sans, оптимизация шрифта, как реализовать?

Для ie9 думаю убрать, так как его вроде вообще ни у кого уже и нет.
вообще стоит так font-family: 'Open Sans', Arial, sans-serif;
если опен санс не грузится где-то, то применяется второй стиль Arial.

Open-sans, оптимизация шрифта, как реализовать?

tyzberd, точно. я и забыл.

теперь понять вот это:
он все сразу грузит?, для ie eot, для современных браузеров woff2 - woff, для более старых ttf.
или он определяет какой браузер и подгружает то что ему надо, если с ie зашел старой версии, то он загрузит только .eot, я прав? или похер ему и он все грузить будет.

Open-sans, оптимизация шрифта, как реализовать?

Антон Вебсайтовский, все шрифты подгрузил, убрал в путях /
/opensans/opensans-semibold.ttf
сделал так
opensans/opensans-semibold.ttf

подгрузилось.

Open-sans, оптимизация шрифта, как реализовать?

он все сразу грузит?, для ie eot, для современных браузеров woff2 - woff, для более старых ttf.
или он определяет какой браузер и подгружает то что ему надо, если с ie зашел старой версии, то он загрузит только .eot, я прав? или похер ему и он все грузить будет.

Open-sans, оптимизация шрифта, как реализовать?

есть style.css
в нем

@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 400;
  src: url('/opensans/opensans-regular.eot'); /* IE9 Compat Modes */
  src: local('Open Sans Regular'), local('OpenSans-Regular'),
    url('/opensans/opensans-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
    url('/opensans/opensans-regular.woff2') format('woff2'), /* Super Modern Browsers */
    url('/opensans/opensans-regular.woff') format('woff'), /* Modern Browsers */
    url('/opensans/opensans-regular.ttf') format('truetype'), /* Safari, Android, iOS */
}

@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 600;
  src: url('/opensans/opensans-semibold.eot'); /* IE9 Compat Modes */
  src: local('Open Sans SemiBold'), local('OpenSans-SemiBold'),
    url('/opensans/opensans-semibold.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
    url('/opensans/opensans-semibold.woff2') format('woff2'), /* Super Modern Browsers */
    url('/opensans/opensans-semibold.woff') format('woff'), /* Modern Browsers */
    url('/opensans/opensans-semibold.ttf') format('truetype'), /* Safari, Android, iOS */
}

а шрифты в папке /opensans/
вот только чет не подгружает.
или я понять не могу, вроде кеш браузера чищу.

Open-sans, оптимизация шрифта, как реализовать?

Михаил, а то что я с гугла подгружаю это плохо?

$this->template->styles[] =
'https://fonts.googleapis.com/css?family=Open+Sans:..." rel="stylesheet';

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

Open-sans, оптимизация шрифта, как реализовать?

Olek1, с гугла подгрузка идет, скачав от туда шрифты, я понял что они весят не хило.

Open-sans, оптимизация шрифта, как реализовать?

с гугла так подгружал

fonts.googleapis.com/css?family=Noto+Sans&subset=c...

Open-sans, оптимизация шрифта, как реализовать?

я бы не сказал что мало весят

Open-sans, оптимизация шрифта, как реализовать?

Там смотрю два варианта опен санс, какой лучше?

Open-sans, оптимизация шрифта, как реализовать?

так что как было с гугла лучше?

Open-sans, оптимизация шрифта, как реализовать?

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

html {
font-family: 'open sans', Arial, sans-serif;
font-size: 14px;
height: 100%;
font-weight: 400;
color: #000;
background: #fff
}

и он подгружает опен санс, а от куда? странно.

Open-sans, оптимизация шрифта, как реализовать?

Что лучше выбрать? оптимал или экперт или бесик.

Open-sans, оптимизация шрифта, как реализовать?

Значения знаю ! я использую 400 и 600, суть вопроса была не в этом.

Обработка фото при загрузке на сайт, оптимальное качество сжатия, какой процент?

Ну для маленьких да ! так как там и так особо качество не нужно.
Значит поставлю 85, для всех остальных.

Микроразметка отзывов о компании, как оформить правильно?

Сделал, можно тут посмотреть narkolog-dv.ru/otzyvy

Микроразметка отзывов о компании, как оформить правильно?

по ссылке читал, ага !
там то чего не хватает типа.

Информация о ресторане
Название: Заграница
Адрес:
Москва, Тверская, 7.

Телефон: [phone].
Сайт ресторана: zagranica.ru
Электронный адрес администрации:
[e-mail]



я ст авил, но какая суть в этом? выходит с каждым отзывов контакты о компании, а зачем. и там написано хотел.

Адаптация контента и отцентровка фото, как сделать (оцинтровку при сжатии экрана)?

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

Адаптация контента и отцентровка фото, как сделать (оцинтровку при сжатии экрана)?

не так не подойдет, у меня же css определяет если у картинки есть [style*="right;"], то он ей присваивает стиль для картинки которая идет по правому краю.

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