2013-07-15 4 views
0

Я хотел бы создать отзывчивый макет с использованием html5 и css3. Прочитав немного в Интернете, я действительно смутился, когда начинаю. Из того, что я читал есть рамки, которые помогают развивать адаптивные макеты:отзывчивый макет с html5

Это где начинается confustion:

  1. Что это преимущество использования этих фреймворков?
  2. Где я могу найти учебники, которые научат меня перейти от PSD => HTML5 Ответственный макет =>, и я предполагаю, что тогда используйте фреймворк.
  3. Нужно ли использовать эти рамки?
+0

Вам в основном нужна система сетки. Bootstrap предлагает один, с другим материалом usefil. Я бы предложил посмотреть раздел «Scaffholding» под документацией загрузчика –

+0

и в основном Responsive = использовать Media Queries в CSS (я бы предложил также поиск в Google), чтобы изменить отображение вашего контента таким образом, который работает для разных размеров экрана. –

+0

Ответный макет является более методикой кодирования/написания сценариев. Я пробовал фреймворки и некоторые системы cms, и я обнаружил, что предпочитаю начинать с нуля и поддерживать полный контроль. – defaultNINJA

ответ

1

Эти структуры имеют много классов, сгенерированных создать подвесную систему очень быстро и легко. Например, Bootstrap имеет кучу классов, которые помогают настроить сетку для жидкости с каждым <div> или контейнером, имеющим ширину жидкости, которая может быть различной по сравнению с ее соседним контейнером.

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

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

Счастливое кодирование!

+0

, но мне кажется, что все сайты должны следовать одному и тому же стандарту и будут в значительной степени выглядеть одинаково или очень похожими. разве это не так? И, делая это по-старому, это сокращение PSD (например, здесь: http://www.ultimatedesignertoolkit.com/tutorials/psd-html-easy-ultimate-css-framework/) все еще применяется к этим фреймворкам? Я просто запутался в PSD для части HTML-таблицы сетки. – ShaneKm

+0

Переход от psd к HTML не обязательно должен быть точной копией, это скорее просто идея, вместе, а затем знание того, как должен выглядеть сайт. –

+0

Большинство сайтов разные, перейдите на сайт apple.com, а затем в google..com, а затем на adobe.com. Каждый из них имеет другую навигационную структуру в другом месте и работает по-разному, а их содержимое находится в разных местах. –

1
  1. Часть работы для вас уже выполнена. (Если они делают то, что вам не нравится, то это, конечно, не выгодно).
  2. Вопросы просящих учебник рекомендации являются вне темы для Stackoverflow
  3. No.
Смежные вопросы