Будут ли текущие сайты стоить?

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

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

Итак, создается ли сайт с флюидом, который стоит проблемы?

Ответ 1

Это зависит от вашей аудитории и вашего контента.

Ниже перечислены сайты, которые я уважаю, и я думаю, что это пример для подражания.

Примеры жидкости:

Amazon

Wikipedia


Статические примеры:

Apple

eBay

MSN

/fooobar.com/...

MSDN


Some Mix it Up!

CNN

Я думаю, что предпочитаю статику большую часть времени. Легче сделать его лучше в других браузерах. Это также легче читать.

Ответ 2

Создание веб-сайта, но добавление атрибута min/max-width, по-видимому, является лучшим из обоих миров, для меня. Вы поддерживаете текучесть, но ограничиваете ее на определенную ширину (скажем, 800px и 1200px).

Это зависит от вас - вот некоторые вещи, которые следует учитывать:

  • Текст трудно (er) читать, когда строки очень длинные.
  • Ваша аудитория может иметь большее или меньшее разрешение, чем обычно, и выбор "неправильной" статической ширины будет раздражать их.
  • Поддержание участка жидкости может быть, но не должно быть намного сложнее, чем его статический аналог.

Ответ 3

Совершенно верно. Это большой неудобство для людей с огромными мониторами, чтобы изменить размер страницы. Это также может быть немного изворотливым с некоторыми макетами. Маленькие неудобства, какими бы незначительными они ни были, могут повлиять на мнения людей на вашем сайте.

Кроме того, нетбуки имеют нечетные разрешения, которые затрудняют создание сайтов. Например, я пишу это с разрешением 1024x600.

В настоящее время это не особенно сложно (в современных браузерах), особенно с min- и max-height в CSS, а также с новыми градиентами и т.д. в CSS3, поэтому масштабирование изображения не будет такой большой проблемой в ближайшем будущее.

В ответ на приведенный ниже комментарий, я думаю, что профи перевешивают минусы в этом конкретном случае - IE6 - проблема повсюду. Нам просто нужно иметь дело с этим.

Ответ 4

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

Ответ 5

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

В противном случае я думаю, что это простой вопрос о том, какой сайт вы разрабатываете и как он выглядит на разных экранах и окнах. Как упоминалось ранее, существует возможность установить максимальную ширину, но одна и та же оговорка применяется к блокам кода и iPhone. Я разработал оба варианта, и я не предпочитаю друг друга.

Хотя, интересно наблюдать, как коробки перемещаются, когда я играю с размером браузера с жидким макетом, но меня можно легко удивить.

Ответ 6

Приложения на основе текста: Нет. Приложения на основе таблиц: Да.

Плюсы раскладки жидкости

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

Недостатки макетов жидкостей:

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

Если вы показываете табличные данные (iTunes, db manager,...), ширина жидкости хорошая. Если вы показываете текст (статьи, вики-страницы,...), ширина жидкости плохая.

Ответ 7

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

Взгляните на "Отзывчивый веб-дизайн" Итана Маркотта: http://www.alistapart.com/articles/responsive-web-design/

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

Ответ 8

Это зависит от того, что вы пытаетесь сделать. Взгляните на SO. Это фиксированная ширина, и это здорово. Фактически, если бы он был жидким, это было бы немного PITA. Некоторые сайты выглядят лучше с жидкостными макетами, но лично я поеду с исправленными, если у вас нет веских оснований для жидкости.

Ответ 9

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

Просто помните о преимуществах любого решения.

Ответ 10

До точки - да.

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

Однако, когда вы идете вниз к меньшим размерам, быть жидкостью может быть хорошей идеей. Браузеры мобильных телефонов все более и более способны отображать "нормальные" веб-сайты просто отлично, но они иногда ограничены по ширине и, как таковые, приносят пользу, если ваш сайт может вписаться в немного меньшее пространство.

Лично мне также нравится сохранять браузер на моем мониторе, но только на половине ширины монитора (24 дюйма). Сайты, которые хорошо масштабируются, очень хороши.

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

Ответ 11

Да. Увеличение страницы велико, но в основном используется для увеличения текста, а не для того, чтобы текст заполнил область просмотра. Конечно, если текст тела уже слишком широк, масштабирование вниз, чтобы сделать его пригодным, обычно делает его нечитаемым.

Вам нужна компоновка жидкости, если вы собираетесь сделать текст подходящим для видового экрана, независимо от того, масштабируется ли оно.

Точка о "длинных строках, которые трудно читать, часто завышена дизайнерами, которые пытаются оправдать конструкции с фиксированной шириной (*), но на самом деле она, похоже, не так сильно сидит на экране, как на бумаге. Разумеется, важно установить хорошую ведущую/линейную высоту, а максимальную ширину можно использовать для подавления худших излишеств длинных линий. (Установите его в относительных единицах шрифта.) В IE6 вы не получите максимальную ширину, но это не та катастрофа, которая когда-то была. (Вы можете исправить это с помощью немного JavaScript, если вы действительно заботитесь о тех парнях, я этого не делаю.)

(*, которые действительно меньше работают для графических макетов, но для более простой компоновки, например, er, StackOverflow, на самом деле нет никакой причины не идти в жидкость. Tsk @SO, eh!)

Ответ 12

Предисловие: не профессиональный веб-художник.

Я обнаружил, что есть слишком много фидбитов, чтобы заставить вещи течь именно так на сотовых телефонах и широкоформатных размерах, особенно в чем-то разумно интересной сложности.

Как правило, я проектирую вокруг места фиксированной ширины в некотором роде; обычно ограниченным [600, 128].

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

Ответ 13

Вы можете сделать это следующим образом.

# Сделайте основной макет и примените ' max-width: 1140px' к нему и центрируйте его.

Таким образом не будет "длинных строк" ​​текста на больших экранах и правильного расчета веб-страницы на более мелких (исключая 800x *** и уменьшает).

Я реализовал этот метод в своих новых проектах, и он работает как прелесть.

a.t.b..:)

Ответ 14

Я думаю, что решение liquid/fixed должно основываться также на содержании веб-сайта:

  • Для сайтов с большим количеством простых информация (например, новостные порталы), лучше использовать компоновку жидкости.

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

Ответ 15

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

Ваши сомнения относительно влияния Ctrl + Scrollbar не имеют большого значения. Эта функция предназначена в первую очередь для доступности, чтобы сделать текст более читаемым, увеличив размер.

Однако, если вы укажете все свои размеры в пикселях (px), этого не произойдет. Правильная настройка происходит только тогда, когда вы используете "em" для указания размера. Таким образом, у вас есть способ включить/выключить его.

Ответ 16

Я большой поклонник фиксированного в < 800px... легче читать узкие столбцы, и он будет работать где угодно. То есть, если вы пытаетесь создать веб-сайт, на котором представлен гипертекст... Веб-сайты, которые представляют прикладные интерфейсы, я думаю, что другая червь может быть полностью...

Ответ 17

Конструкция флюида - по-настоящему жидкость - тяжелая. Очень сложно. Это не просто вопрос ширины страницы - ваши шрифты масштабируются, и все ли с ними масштабируется? В идеале:

  • Размеры должны быть определены в em, а не px
  • ... и это касается размеров элементов, а не только шрифтов!
  • Учитывая изменение размера шрифта или уровня масштабирования, элементы страницы должны быть одного размера по отношению друг к другу.

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

С одной стороны, изображения - на узле с фиксированной шириной, вы можете иметь изображение, которое заполняет половину ширины и отлично выглядит. В жидком месте это изображение так же вероятно будет потеряно в море пробелов, выглядя довольно одиноким.

Жизнь должна быть проще после border-radius, а другие свойства CSS3 вступают в игру больше, но, к сожалению, наша основная аудитория - это правительственные работники, которые все, ВСЕ ЕЩЕ ИСПОЛЬЗУЮТ IE F @! * ING 6!


Чтобы ответить на вопрос, "стоит ли это"? Да, если вы сделаете это правильно.

Здесь сценарий: выберите сайт с фиксированной шириной: ваш босс отображает его клиенту на своем совершенно новом ноутбуке с разрешением 1920x1600, а затем жалуется на вас о том, "как все выглядит мало на этом экране парня!"

Ответ 18

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

Ответ 19

Я собираюсь пойти против большинства и сказать НЕТ. Рассуждение: жидкие сайты, такие как Википедия, являются кошмаром, чтобы читать на больших экранах из-за их длинной длины линии (хотя его цитаты затрудняют чтение в лучшие моменты).

Проблема действительно возникает из-за отсутствия механизма для изменения размера текста относительно разрешения экрана. Если вы можете автоматически сделать текст более крупным по большему разрешению, вы можете оставаться ближе к 80 с лишним символам в строке, которые обычно считаются лучшими для удобства чтения.

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

Ответ 20

Я поклонник сайтов, которые имеют фиксированную максимальную ширину между 800px - 1000px, но также могут уменьшаться, чтобы я мог читать контент без прокрутки в стороны, а также без масштабирования, потому что часто текст становится слишком маленьким, чтобы читать, и мне больно. Таким образом, это, как правило, хочу, к чему я стремлюсь, потому что я хочу создавать сайты, которыми я могу гордиться.