Существуют ли какие-либо плагины, фреймворки или инструменты, чтобы сделать веб-страницы приятными для программиста? - PullRequest
3 голосов
/ 27 июня 2010

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

Я не хочу, чтобы он был таким же красивым, как эти известные сайты, но я хочу, чтобы он был чистым, и все страницы имеютодинаковые стили.

Спасибо за любую помощь.


ОБНОВЛЕНИЕ

Для значков я знаю, что есть хороший сайт http://www.findicons.com

Я также скачал несколько инструментов, таких как «Color Scheme Designer», и я даже знаю, как использовать «Photoshop / Fireworks», я прочитал несколько книг о дизайне.Но я обнаружил, что мне не хватает духа художника, страница, которую я создал, всегда недостаточно хороша.

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


ОБНОВЛЕНИЕ

Я только что попробовал http://colorschemedesigner.com, и нашел "Пример светлой страницы "и" Пример темной страницы "очень полезен.Спасибо!


ОБНОВЛЕНИЕ

Этот сайт очень полезен: http://www.freecsstemplates.org

Ответы [ 4 ]

3 голосов
/ 27 июня 2010

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

3 голосов
/ 27 июня 2010

Для цветовых схем Color Scheme Designer является отличным ресурсом.

Для значков существует так много ресурсов, что на самом деле проще всего сказать "ищи то, что ты"ищите "- поиск в Google таких вещей, как" бесплатные наборы иконок "и т. п., как правило, довольно быстро может привести к появлению довольно многообещающих потенциальных клиентов.

1 голос
/ 27 июня 2010

@ Freewind, я отвечу вам, что для вас было бы гораздо лучше сотрудничать с графическим дизайнером, чем стать мастером на все руки. Вы должны сосредоточиться на своих технических навыках, в то время как ваш партнер концентрируется на креативной части. Зачем? Потому что с научной точки зрения наш мозг функционирует по-разному - логически на левой стороне мозга и креативити на правой стороне мозга. От вас не ожидают (в обычной ситуации) быть наделенными обоими талантами. Также вы могли бы научиться у своего партнера нескольким простым золотым правилам, которые позволят вам освоить свои «годы».

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

1 голос
/ 27 июня 2010

Ключ с внешним видом похож на программирование пользовательского интерфейса.Инкапсулируйте подобные элементы, используя теги id и class в каждом элементе html.Если у вас есть согласованное расположение контента между страницами, вы можете использовать простой код CSS, чтобы все выглядело хорошо.Это часто помогает создать спецификацию пользовательского интерфейса для ваших веб-страниц.

Например, теги <p> всегда будут содержать шрифты в стиле Arial размером 10. Все ссылки будут # e33, если они не отображаются (# 3ee) или не нажимаются (#fff).Фон страницы всегда будет #eee.Цвета, поля, шрифты и границы попадают в такую ​​спецификацию, но не являются необходимыми.Один из приемов, который вы можете использовать, - это найти среду управления контентом, такую ​​как drupal или dotnetnuke, проверить некоторые темы для каждой из них и позаимствовать и украсть код из них в соответствии с вашими потребностями.

Да, и, конечно, в верхней части каждой сгенерированной страницы поместите вызов вложения таблицы стилей:

<link href="your_stylesheet.css" rel="stylesheet"/>

или поместите все объявления стилей в генераторе, чтобы попасть внутрь:

<style>
  body{
    font-face: Arial;
  }
</style>

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

...