Пользователь пока ничего не рассказал о себе

Наибольший вклад в теги

Все теги (14)

Лучшие ответы пользователя

Все ответы (9)
  • Выбор бесплатной CMS для интернет магазина?

    @crazyivan_ru
    Не забывайте отметить решением, если ответ помог!
    Я бы тоже предложил обратить внимание на OpenCart, всю заявленную вами функциональность он поддерживает (большинство из коробки, оставшееся - модулями).
    Ответ написан
    3 комментария
  • Как загружать CSS чтобы добиться высокой оценки в Google PageSpeed Insights?

    @crazyivan_ru
    Не забывайте отметить решением, если ответ помог!
    В идеале вам нужно собрать все стили в один файл, стили подключать скриптом, например, так:
    <script>jQuery("head").append("<link rel="stylesheet" type="text/css" href="/путь_до_файла_стилей.css">");</script>

    а все скрипты вставить в конце страницы - прямо перед закрывающим тегом </body>, плюс, если у вас могут быть пользователи с отключенным javascript'ом в браузере (мало ли), нужно будет продублировать подключение файла стилей внутри тегов <noscript></noscript>, например, так:
    <noscript><link rel="stylesheet" type="text/css" href="/путь_до_файла_стилей.css" /></noscript>
    Ответ написан
    2 комментария
  • Как работает CSS свойство - content: '\e80f'?

    @crazyivan_ru
    Не забывайте отметить решением, если ответ помог!
    Это иконочный шрифт, чтобы понять как он работает, нужно рассмотреть всю конструкцию, во-первых у рассматриваемого элемента где-то должен быть указан еще один css параметр - font-family, например так:
    .icon-vk:before {
        font-family: "название_иконочного_шрифта";
    }

    Теперь найдем файл стилей этого иконочного шрифта (обычно по названию понятно), в нем, в самом начале, будет подключение исходных файлов шрифта (eot, otf, woff, svg и пр.), обычно оно выглядит так:
    @font-face {
        font-family: "название_иконочного_шрифта";
            src: url("путь_до файла_eot");
            src: url("путь_до файла_ttf") format("truetype"), url("путь_до файла_woff") format("woff"), url("путь_до файла_svg?") format("svg");
        font-weight: normal;
        font-style: normal;
    }

    В этих файлах хранятся как раз те самые иконки, которые выводятся шрифтом, и хранятся они в символах с названиями вида \e80f, и, соответственно, чтобы вывести какой-то символ, нужно использовать конструкцию вида:
    .icon-vk:before {
        content: '\e80f';
    }

    Псевдоклассы :before (или, иногда, :after) используются для того, чтобы сохранить работоспособность механизма на тот случай, если элементы сайта динамически формируются, например, PHP функцией, и нет прямой возможности редактировать HTML.
    Ответ написан
    Комментировать
  • Как лучше составлять тайтлы с точки зрения сео-оптимизации - прописывать вручную для каждой страницы? или составлять автоматически с помощью шаблона?

    @crazyivan_ru
    Не забывайте отметить решением, если ответ помог!
    На самом деле многое зависит от того, о каком сайте идет речь:
    - если это интернет-магазин на 250 категорий и 50 000 позиций, то нет смысла писать для товаров заголовки (и meta-теги) вручную - во-первых это займет у вас большое (очень) количество времени, в во-вторых это просто бессмысленно, так как в поисковый индекс конкретные товары скорее всего не попадут (это бывает очень редко и только в определенных нишах, например, в электронике, где посетитель часто ищет именно конкретный товар), а попадут страницы категорий, и для них заголовки (и meta-теги) лучше, конечно, прописать вручную
    - если же это корпоративный сайт с 10-50 страницами - однозначно лучше для всех страниц заполнить заголовки (и meta-теги) вручную - так как во-первых вы сделаете это более качественно, чем любая автоматика, а во-вторых, обычно, это быстрее, чем писать какой-то алгоритм, который будет делать это за вас
    Ответ написан
    Комментировать
  • Резиновый и адаптивный дизайн: какие различия в создании для дизайнера, сколько девайсов должно быть на выходе?

    @crazyivan_ru
    Не забывайте отметить решением, если ответ помог!
    Основное различие в том, что резиновый дизайн растягивается/сжимается в зависимости от разрешения экрана на котором он отображается, а адаптивный дизайн - перестраивается - какие-то элементы могут пропадать/появляться, сдвигаться вниз/вверх и пр., соответственно для дизайнера это разные подходы к созданию макета, для верстальщика - разные подходы к верстке (использование определенных технологий/фреймворков и пр.).

    В плане того "что отдавать в итоге" для адаптивного дизайна можете ориентироваться на Bootstrap - у них хорошая разбивка по устройствам:

    Mobile-First подход:

    /* Custom, iPhone */ 
    @media only screen and (min-width : 320px) {
    }
    /* Extra Small Devices, Phones */ 
    @media only screen and (min-width : 480px) {
    }
    /* Small Devices, Tablets */
    @media only screen and (min-width : 768px) {
    }
    /* Medium Devices, Desktops */
    @media only screen and (min-width : 992px) {
    }
    /* Large Devices, Wide Screens */
    @media only screen and (min-width : 1200px) {
    }


    Non-Mobile-First подход:

    /* Large Devices, Wide Screens */
    @media only screen and (max-width : 1200px) {
    }
    /* Medium Devices, Desktops */
    @media only screen and (max-width : 992px) {
    }
    /* Small Devices, Tablets */
    @media only screen and (max-width : 768px) {
    }
    /* Extra Small Devices, Phones */ 
    @media only screen and (max-width : 480px) {
    }
    /* Custom, iPhone */ 
    @media only screen and (max-width : 320px) {
    }
    Ответ написан
    Комментировать