Перейти к содержимому
  • Типовые сетки сайтов

       (117 отзывов)

    Евгений Зубов
    • 11 4,25,6,20,3,26,27,28,29 4,2,31,6,20,32,3 https://creatura.club/uploads/monthly_2015_12/2.1.7_%D0%A2%D0%B8%D0%BF%D0%BE%D0%B2%D1%8B%D0%B5_%D1%81%D0%B5%D1%82%D0%BA%D0%B8_%D1%81%D0%B0%D0%B9%D1%82%D0%B0.mp4.ad217127fc0bd54efa82209c869e5ad1.mp4 6 До 10 минут display: block; https://creatura.club/uploads/monthly_2016_01/Tipovyie_setki_saytov_ot_muse.digitalmakers.ru_zip.2824f530a7f7950090b57e1cd17bf1bc Низкая сложность display: none;
      1. Скачайте материалы этого урока
      2. Пройдите тестирование
      3. Задайте вопросы в обсуждениях (если есть)
      4. Сдайте задание и оцените урок
    • Чему должна быть равна максимальная ширина сайта?



    • почему рекомендуется использовать типовые сетки сайтов?




    • В каких случаях нужно использовать быстрые направляющие?




    • Какие бывают виды быстрых направляющих?




    • Вы скачали шаблоны с типовыми сетками сайтов?


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

      Давайте я открою программу, создам новый сайт, жму ОК, зайду сюда Файл/Свойства сайта. Количество столбцов сетки сайта подбирается исходя из того, какой именно сайт вы хотите создавать, насколько сжато преподносить информацию на сайте и насколько много будет на сайте мелких элементов, которые нужно будет выравнивать по горизонтали относительно друг друга. Чем большее количество столбцов используется в сетке, тем более сжато будет восприниматься информация на сайте. Что касается ширины сайта, максимальная ширина страницы состоит 960 пикселей. Здесь основной критерий выбора – это ширина экрана устройства, на котором будут просматривать сайт большинство пользователей.

      Ширина сайта должна быть меньше ширины экрана этих устройств. Т.е., если у нас максимальная ширина страницы 960 пикселей, то это значение должно быть, чем ширина экрана устройств, а котором будет просматриваться сайт. Что же касается величины средника, то для создания сайта в Adobe Muse мы в последнее время практически полностью отказались от использования средников. Поэтому, в превалирующем большинстве случаев, мы выставляем его значение на 0 и все типовые сетки, о которых далее пойдет речь, в них средника не будет. Исключение для использования средника могут составлять сетки для создания информационных сайтов или сайтов интернет-магазинов.

      Итак, основные размеры типовых сеток сайта следующие, для ширины сайта 960 пикселей, которые установлено в программе по умолчанию. Оптимальным решением будет использование 12 столбцов. Средник, как я уже говорил, мы выставляем на 0. Поля сайта мы обычно тоже выставляем на 0. Для ширины 1024 пикселя, самым удобным будет создание 16 столбцов. И для ширины 1120 пикселей тоже будет удобным создание сетки сайта с использованием 16 столбцов.

      Для ширины сайта 1200 пикселей это последнее максимальная ширина страницы, которую мы рекомендуем использовать, удобно использовать 20 столбцов. Сайты, построенные с использованием указанных выше типовых размеров сеток, прекрасно будут смотреться, как на стационарных больших мониторах, так и на современных ноутбуках без появления горизонтальной прокрутки страницы. Размер ширины экрана самых популярных современных ноутбуков на сегодняшний день, составляет 1366 пикселей. Максимальный размер ширины типовой сетки из вышеназванных, 1200 пикселей. Как вы видите, это меньше ширины экрана ноутбука.

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

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

      Точно также берем левой кнопкой мыши, зажимаем на линейке и перетаскиваем эти направляющие для использования в программе. Чтобы удалить направляющую, нам необходимо нажать правую кнопку мыши и нажать «Удалить направляющие». Все направляющие, которые мы создали, удаляются. Если вы хотите удалить одну направляющую, выделите ее, нажмите на клавиатуре клавишу Delete. У нас есть уже заготовки готовой сетки сайты, сохраненные специально для использования в программе Adobe Muse, вы их получите и сможете скачать, в ссылке будут под этим видео. В комплекте будет несколько файлов, которые я только что называл.

      На этом данный урок по типовым сеткам сайта закончен. Выполните домашнее задание к данному уроку, пройдите тест и получите доступ к следующему уроку.

    Вы познакомитесь с типовыми сетками сайтов. Узнаете для чего нужны сетки сайтов и как подобрать сетку сайта. Узнаете где можно скачать готовые сетки сайтов.


      Жалоба


    Отзывы пользователей


    Tumi

    Я узнал что существуют типовые размеры экранов, под которые нужно делать сайт. Классические размеры сайта 960px, 1080px, 1200px и 1280px. Остальные размеры экранов не такие популярные. Если я собираюсь делить сайт на столбцы, то стандартными размерами столбца будут 60px, 70px и 80px. То есть для экрана с размеров в 960px количество столбцов 12px, для 1080 18px и для 1200 это 20px.

    Поделиться отзывом


    Ссылка на отзыв
    SindRom

    Пришлось соврать, что скачал сетки))

    Поделиться отзывом


    Ссылка на отзыв
    7dgoni6

    Всё понятно.

    Поделиться отзывом


    Ссылка на отзыв
    Раджао Тэн

    good

    Поделиться отзывом


    Ссылка на отзыв
    X_G

    Спасибо за урок

    Поделиться отзывом


    Ссылка на отзыв
    Presniakoff

    Скачал сетки. Пригодятся. Будем все делать последовательно

    Поделиться отзывом


    Ссылка на отзыв
    YanaZamkova

    Очень полезный для меня урок) наконец-то я разложила по полочкам информацию об оптимальной ширине сайта!

    Поделиться отзывом


    Ссылка на отзыв
    loogwes

    1. Понятно

    Поделиться отзывом


    Ссылка на отзыв
    lukomorik

    Спасибо!

    Поделиться отзывом


    Ссылка на отзыв
    Сергей  Осипов

    Спасибо, пока все понятно.

    Поделиться отзывом


    Ссылка на отзыв
    Владислав201

    я так и не понял для чего нужны быстрые направляющие

     

    Поделиться отзывом


    Ссылка на отзыв
    Слава Баранов

    Всё понятно

    Поделиться отзывом


    Ссылка на отзыв
    Лелявина Мария

    Спасибо. Полезно.

    Поделиться отзывом


    Ссылка на отзыв
    Genka

    +

    Поделиться отзывом


    Ссылка на отзыв
    Павел Высоцкий

    Урок понятен. Евгений на вебинаре говорил о другом размере сетки.

    Скачанный файл не соответствует действительности.

    Поделиться отзывом


    Ссылка на отзыв
    samoylov.webmaster

    +

    Поделиться отзывом


    Ссылка на отзыв
    Гость Падалко Сергей

    Супер

    Поделиться отзывом


    Ссылка на отзыв
    Харин Владислав

    Информативно и полезно.

    Поделиться отзывом


    Ссылка на отзыв
    Ол Баданин

    Скачал сетки, спасибо Нед Крубер за подсказку. По оптимальной ширине сайта всё понятно.

    Поделиться отзывом


    Ссылка на отзыв
    adel

    А под разрешение 2560 никто не делает сайты?
    Я сделала.

    Удалять что ли?

    Норм ли я сделала точки остановки? не много ли?
    спасибо заранее за ответ)
     

    screenshot7.png

    Поделиться отзывом


    Ссылка на отзыв

×