Последнее время меня часто спрашивают, как стать веб дизайнером и как научиться делать темы для WordPress. С чего начать и с чего начинала я?
Я нарисовала дизайн своей первой темы в Фотошоп (как я сейчас понимаю, дизайн оставлял желать лучшего), скачала из Интернета простую WordPress-тему, установила на компьютере Denwer, WordPress и потихоньку начала эту тему переделывать под свои задачи.
Научиться можно, только практикуясь и попутно осваивая теоретическую часть.
Вы можете сделать то же самое.
Вот список материалов, которые вам потребуются.
1. Материалы по Фотошоп:
Разумеется дизайн сайта можно нарисовать в любой графической программе.
Перечислять не буду – их множество. Но я рекомендую делать это в Фотошоп.
Главная причина, по которой я выбрала именно эту программу для создания дизайнов шаблонов и рекомендую ее вам – в рунете можно найти множество уроков по работе с Фотошоп.
Вот одни из лучших, встретившихся мне за последний год - 6 простых пошаговых видеоуроков на практике покажут вам, как из кучи разных картинок легко и быстро сваять шикарный дизайн сайта.
А ведь действительно через пару часов вы получите не только готовый дизайн сайта, но и навыки работы в Фотошоп, которые пригодятся вам в будущем.
Вот чему вы научитесь:
• Правильно расставлять объекты на сайте
• Создавать дизайн сбалансированным и гармоничным
• Создавать единый стиль дизайна
• Простые правила типографики
• Работать с текстурой (дерева и бумаги)
• Разрабатывать логотип
• Узнаете как делать глянец
• Как делать реалистичные тени
• Как делать свечения
• Как составлять и обрабатывать коллаж
• Как делать графику более реалистичной
• Как придать уникальность и неповторимость всем элементам сайта
• Как подбирать гармоничные цвета
2. Материалы по WordPress:
- Чтобы знать, какие файлы в папке с темой, за что отвечают (какие страницы формируют): Иерархия шаблонов в WordPress - www.sonika.ru/blog/wordpress/template-hierarchy.htm
- Чтобы понимать, как из файла формируется страница сайта:
Введение в теги шаблонов - codex.wordpress.org/Введение_в_теги_шаблонов - Чтобы разобраться, какие функции в файлах, что выводят:
Базовые Функции WordPress - wp-kama.ru/functions - Чтобы знать, что такое цикл в WordPress - wp-config.ru/sozdanie-tem/urok-6-cikl-the-loop
- Чтобы соединить все полученные знания в одной теме:
Сделайте вашу Собственную Тему для WordPress:
Часть 1я - interblog.org/archives/206
Часть 2я - interblog.org/archives/207
С чего начать:
- Скачиваете и устанавливаете Denwer - www.denwer.ru
- Скачиваете и устанавливаете WordPress - mywordpress.ru
- Находите в Интернете простую тему для WordPress, скачиваете на компьютер и активируете на WordPress.
- Ищете в интернете блокнот Notepad2 – он бесплатный и скачиваете его на компьютер.
- Открываете блокнотом файлы темы и начинаете разбираться в том, что видите.
Все возникающие вопросы задаете на форумах:
mywordpress.ru/support
forum.maxsite.org
3. Материалы по HTML и CSS:
Самоучитель HTML - htmlbook.ru/samhtml
Самоучитель CSS - htmlbook.ru/samcss
Учиться начинаете так:
- Найдите в интернете блокнот Notepad2 – он бесплатный и скачайте его на компьютер.
- Откройте самоучитель HTML - htmlbook.ru/samhtml.
- Создайте на рабочем столе (или в любом другом месте) текстовый файл, переименуйте его в index.html
- Откройте этот файл программой Notepad2, прочитайте первый урок по HTML и запишите теги из этого урока в файл index.html. Сохраните его.
- Запустите файл двойным кликом мышки, т.е. откройте его браузером.
- Посмотрите, что у вас получилось.
- Опять запишите в файл теги из нового урока – перезагрузите страницу, посмотрите, что на ней изменилось.
Все вопросы по результатам учебы можно задать на форуме forum.htmlbook.ru
CSS учите аналогично, вопросы задаете на том же форуме.
Вам потребуется, также
4. Умение самостоятельно учиться.
Без него, увы, ничего не выйдет.
Удачи!
Спасибо огромное, получила от вас целое руководство)) Давно хочу тему поменять на блоге.
Как обычно все разжевано и разложено по полочкам. Прямое руководство к действию.
Однако хочется добавить для питающих иллюзии, что все просто и элементарно - это не так просто и не элементарно. Придется долго сидеть, разбираться, пробовать и ошибаться, накапливать знания и разочаровываться.
Так что если вы серьезный автор статей на своем сайте и не особо вдавались в процесс установки ПО для его работы, а в разработке темы участвовали как критик или максимум соавтор, то лучше доверьте вопрос создания темы тем кто на этом специализируется, а сами занимайтесь написанием интересных и полезных статей.
Ну а начинающим или желающим поднять свой уровень найдя что-то новое - читаем, разбираемся, применяем.
Ролик буду смотреть обязательно, актуально для сегодняшних задач.
и сколько у автора ушло время на изучение всего перечисленного? мне кажется минимум 3 месяца надо для всего этого,а уж про CSS я молчу,там можно увязнуть очень крепко
Примерно столько же времени и ушло.
А потом еще месяцев 6, пока отшлифовала полученные навыки.
Чтобы научиться делать шаблоны на профессиональном уровне, а не только для своего сайта, нужен минимум год.
Но мы ведь не ищем легких путей :)?
С CSS и HTML у меня более-менее, а вот с фотошопом никак не могу подружиться. Надо как-то скомпоновать всё это воедино ...
Посмотрите урок из этого поста и вам многое в Фотошоп станет понятно. В уроке очень просто и подробно рассказывается о сложных вещах.
Урок просмотрел, отличный урок, 2 часа потратил не зря.
Частенько по работе с материалом приходится пользоваться графическим редактором. Как среднему пользователю фотошопа нашел много полезных приемов. В отличие от многих уроков с которыми приходилось сталкиваться, автор не сбивается, повествование ведет последовательно подтверждая демонстрацией, ключевые моменты выделены.
С СSS и HTML пока вопросов нет, а работа с графикой прихрамывает, так что очень своевременно.
Cпасиб, Ксана! умение сказать (напомнить) о важном дорогого стоит!
Виктор Гюго
То есть не нужно знаний по ПХП чтобы делать шаблоны(темы) как у Вас? (если это так, то это радует). Что то в этой статье не упоминалась про это...
В шаблонах(Ваше портфолио), в админке видел встроенные "настройки темы" - разве это не в ПХП сделано? Можно такое сделать зная только то, что перечислено в этой статье ?
Заранее спасибо за ответ !
Toha, знания php, разумеется, нужны.
Обратите внимание на пункт "Материалы по WordPres" - это и будет первое знакомство с php.
Чтобы сделать страницу настроек в теме, нужно изучить php основательнее.
Что касается того, что в моем посте не написано о нужности изучения php - пост предназначен для начинающих сайтостроителей, которые хотят самостоятельно создать тему для своего сайта. Для этого вполне достаточно изучения перечисленных в посте материалов.
Чтобы сделать тему премиум-класса (а страница настроек в теме, это одно из составляющих таких тем), придется изучить все основательней - в том числе и php.
Но, пусть вас это не смущает - чтобы сделать хорошую тему, вовсе не обязательно быть гуру php.
Я, например, вовсе не великий специалист в php, я больше дизайнер, чем программист, но смею надеяться, что темы, которые я создаю, вовсе не плохие.
спасибо за ценные указания, давно хотела поменять у себя тему)
По поводу освоения фотошопа советую demiart.ru/forum
Вот там то точно хорошо можно освоить фотошоп.
На счет HTML и CSS, при хорошем желании можно выучить за 2 недели. А сверстать легий дизайн не составляет проблем)) // Испытано на личной "шкуре" 😀
Молодец, Ксана, все у вас здорово и аккуратно и очень уютно на сайте +)
Здрасте, подскажите, как сделать меню в ворлресс так, что бы при нажатии на рубрику оно сворачивалось, типа аккордеона?
Используйте функцию get_the_category.
Подробности в codex.wordpress.org/Function_Reference/get_the_category
Меня интересует, где можно найти фрилансера, который под мой блог сделает профессиональную тему, в пределах 50-60 $.
Скорее всего нигде - специалисты не работают за такие деньги.
Но, если убрать из ваших требований слово "профессиональную", то можно поискать на форумах по wordpress.
Возможно, кто то из начинающих возьмется сделать.
Да, согласен с вами - не обладая информацией цену назвал смешную. Уже полазил на freelance.ru, цены не слабые.
Да же не саму тему переделать, а хотя бы фон добавить к ней, (может кто возьмется кто читает комменты) черный фон ну не как ни катит. Поверьте, я пишу не с целью повысить посещаемость блога, а реально хочу поработать со знающим человеком. Аська: 628281230
Спасибо за пошаговую инструкцию и множество полезных материалов!
Здравствуйте, Людмила! Случайно набрела на Ваш сайт и просто очарована - столько интереснейшей информации! Меня, абсолютного профана, очень заинтересовала возможность наглядно изучать html и scc на виртуальном сервере. Но... случилась беда-:), я, наконец-то решилась сегодня скачать Denwer, но не смогла завершить инсталляцию, так как на моем компьютере нет поддержки русского языка (я живу в Израиле), а в процессе скачивания там было окно, в котором (вероятно) были необходимые указания или ключ, я полагаю...
Я решила удалить Denwer пока не приобрету новый компьютер с другой ОС, но не тут-то было... Я не могу удалить Denwer, который, кстати, создал свой "личный" диск. Я попыталась найти помощь в Интернете, но ни на русском ни на английском не нашла ничего для себя полезного. К тому же, увы, я не пониманию многой терминологии. Как от него избавиться? Должен же быть путь! Пожалуйста, спасите! Мне нужно объяснять как чайнику - типа, нажми вот тут, а потом вон там, а теперь вот здесь...Заранее, спасибо огромное за помощь!
Если у вас именно Денвер, то удалить его можно, просто переместив в корзину.
Если последняя версия под названием Енделс, ее можно удалить так же, как и любую другую программу
- Кнопка Пуск\Панель управления\Программы и компоненты\Endels
Спасибо огромное за такой быстрый ответ! Я Вам очень признательна! К сожалению, путь, который Вы мне предлагаете, у меня не срабатывает, так как в панели управления в Программах у меня НЕТ никакой индикации, что программа инсталлирована, поэтому, естественно, не может быть и опции удалить ее в корзину. Это потому, я полагаю, что когда я увидела, что в процессе скачивания появилось окно с "иероглифами" , и я не могу прчитать указаний, я просто отменила процесс, не доведя его до конца. Позже, я нашла в интернете указания на скачивание Денвера с пошаговым объяснением и снимками этого окна. Надо было создать директорию для Денвера, чего я, естественно, не делала. Тем не менее, у меня-таки появилась эта директория - виртуальный диск "Y", от которого я теперь не могу избавиться. На нем было несколько файлов, которые я не могла удалить в корзину, так как появлялась надпись, что программа открыта в MySQL (где это, я не нашла).
Я, от волнения и по дурости, просто "спрятала" эти файлы, нажав на опцию "hide". Теперь я понятия не имею, где эти файлы сидят (дурная голова ногам покоя не дает). И как удалить этот виртуальный диск??? Я беспокою Вас, так как на сайте Денвера невозможно задать этот вопрос.
Людмила, мне удалось разрешить мою проблему. Извините, что побеспокоила Вас, и еще раз большущее спасибо за Ваше любезное желание помочь! У Вас потрясающий сайт! Огромных Вам успехов!
Добрый Людмила, уже как подходит 2 год являюсь Вашим подписчиком. Только сегодня внимательно посмотрел,что Вас звать Людмила, а всё время думал, что Вы Ксана.
Почему я решил написать комментарий, да потому, что мне казалось, что Вы учились в школе дизайнеров, а оказалось Вы самостоятельно овладели веб дизайнерством. Хочется пожать Вам крепко руки и сказать, что Вы молодец.
Хочется написать многое, но думаю не стоит забивать Вам голову.