Как облегчить работу верстальщика-программиста. Программы спешат на помощь.

« Предыдущая запись
 
  Следующая запись »
 

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

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

1. Программы для редактирования кода

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

  • 54430 Как облегчить работу верстальщика программиста. Программы спешат на помощь.Adobe Dreamweaver. Впереди планеты всей, я бы сказал. Я начинал в ней изучать вёрстку, и программа меня "учила" как всё делается, словно говорила - "повторяй за мной". Собственно базу вёрстки я взял у неё и у одного очень хорошего автора.
    Сейчас я использую только процентов 5 возможностей дримивера, потому что многое предпочитаю писать сам. Но ради этих пяти процентов я его и использую. Потом я посвящу отдельный пост этой программе, рассмотрев самые полезные элементы, по моему мнению.
    При правильной настройке, программа будет доставлять большое удовольствие, поскольку скорость работы, это всегда приятно. Однако я использую его только для вёрстки. В принципе и с пхп в нём можно работать, он разрешает, но в нём мне не нравится с ним работать, поэтому я использую…
  • phpDesigner. Почему я отдаю предпочтение этой программе. Самый главный её плюс - подсветка открывающего и закрывающего тега - это позволяет быстро сориентироваться в коде. При этом автозакрытие тегов и реализация подсказок при наборе кода выполнена на ура. И что мне ещё очень нравится - подсветка различных типов кода: если мы редактируем пхп код, то он будет весь высвечен, а весь остальной код (хтмл, жабаскрипт) будет почти слит с белым фоном. При этом цветовая гамма подсветки очень приятная, использует лёгкие оттенки, не режет глаз. Собственно здесь, в блоге, я использую цвета подсветки именно из неё.
  • HateML. Программу не очень хорошо уже помню, помню лишь, что она в своё время мне понравилась. Правда кажется она подсвечивала только хтмл-код. Что-то мне в ней ещё нравилось касательно кода, но в итоге на первых двух я так и остановился. Программа небольшая, хорошая. Так что будет время, советую ознакомиться. Мало ли=).
  • Microsoft Frontpage. Лично сам в ней не работал, но наслышан о ней не с положительной стороны. Главный минус заключается в том, что программа оставляет много мусора в коде. Впрочем что ещё можно ждать от Microsoft, если вспомнить её прелести импорта Word документа в html.
  • Macrmedia HomeSite. Особо программу не рассматривал, но за 5-10 минут знакомства с ней, он оставила приятное впечатление. Подсветка кода такая же приятная, как и в phpDesigner, а просмотр вёрстанной страницы сделано лучше, чем в Дриме в том плане, что гораздо правдивее показывает, что на самом деле везде отображается. Автозакрытие тегов присутствует, а вот подсказок-автозаполнений замечено не было. Хотя кто знает, посмотреть есть смысл. В общем если вам не нравится ни одна из вышеперечисленных программ, советую посмотреть на эту, вроде бы она того стоит.

2. Текстовые редакторы

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

В своё время я перепробовал их несколько, и взор остановился на трёх.

  • RezaDotCom Как облегчить работу верстальщика программиста. Программы спешат на помощь. Notepad++. Самый популярный из всех. В принципе не удивительно. Файлы открываются во вкладках, то есть удобно переключаться между файлами, море настроек и возможностей. Хотя открывается он помедленнее, чем ниже представленные сородичи. Скачать можно на официальном сайте.
  • Notepad2. В принципе описать можно программу как блокнот с подсветкой кода и автозакрытием тегов. Открывается почти мгновенно. Минимум от максимума. Лично для себя я нашёл в нём всё, что нужно для самого быстрого внесения изменений в файл - быстро открыл, быстро увидел, быстро нашёл, быстро исправил, и быстрым нажатием клавиши Esc вышел из программы. Конечно настройки включить для этого надо. Минус для такой простой программы пожалуй только один - на английском всё=). Впрочем, это маленькая придирка (особенно от тебя, зануда - прим.ред.), так как я предпочитаю программы на английском (я ж грю, зануда - прим.ред.). Программу можно скачать с моего сервера. Скачать.
  • Bred2. До Notepad2 я использовал эту программку. Причём довольно давно, ещё когда не занимался сайтами. Она почти ничем не отличается от стандартного блокнота, вот только кодировок несколько поддерживает, сама подобротнее сделана, закрывается через Esc и скорость её загрузки самая реактивная. Я ещё на старом компьютере её использовал и любил именно за это. В принципе на текущих машинах в ней смысла особого нет, но всё таки дань уважения отдать стоит. Да, у неё есть третья версия, но она мне не понравилась, какая-то она другая и неудобная. А посему отдаю предпочтение этой. Её тоже можно скачать с моего сервера. Скачать.

3. Графические редакторы

ba4d70f86c3a Как облегчить работу верстальщика программиста. Программы спешат на помощь. Необходим для нарезки макета, плюс ко всему обычно в многослойных psd или tiff и присылают макеты. Как ни крути, но лучше Adobe Photoshop здесь ничего, имхо, нет. Он позволяет хорошо нарезать графику и при этом сохранить её в минимальных размерах, поскольку не сохраняет всякую ненужную для веба инфу типа блоков exif. Пи этом можно сразу посмотреть в каком формате выгоднее сохранять. В общем зе бест.

4. Браузеры

О браузерах я уже писал ранее, в статье "Сайты: проверка на кроссбраузерность". Однако остановлюсь здесь на двух или даже трёх из них.

98374b Как облегчить работу верстальщика программиста. Программы спешат на помощь. Первый - Internet Explorer, желательно последний. Он выявляет ошибки в жаба-скриптах. Конечно он не очень адекватно показывает где они, но если они они есть, он покажет, и это хорошо.

Второй - Google Chrome. В нём есть инспектор кода, похожий на один из аддонов к фаерфоксу. Может кому-то это удобно.

Третий - Mozilla Firefox. Но только в случае установленных плагинов.

  • Firebug. Текущая версия 1.4.5. Позволяет отлаживать скрипты, смотреть что откуда в коде и как и почему, имеет аналогию с Дримом, когда кликаешь по просматриваемому элементу, и подсвечивается его код (и в Хроме подобное есть). Полезный плагин, особенно если про него всё разузнать и настроить и проапгрейдить по полной. Смотрим, качаем.
  • Web Developer. Текущая версия 1.1.8. Имеет кучу различных полезных штук. Смотрим, качаем.
  • ColorZilla. Текущая версия 2.0.2. Пипетка. Пипетит цвета, что ещё тут сказать. Смотрим, качаем.
  • Pixel Perfect. Текущая версия 1.1.0. Позволяет сравнить с исходным изображением насколько точно свёрстан сайт. Уж не знаю насколько это полезно, но довольно интересная штука. Смотрим, качаем.

Есть ещё аналог FireBug для других браузеров, который встраивается в виде скрипта. Поглазеть и скачать можно здесь.

Лично я привык работать без хрома и лисовых надстроек, потому что всё сам быстренько могу поправить и найти. Плюс я использую Оперу. А вот использовал бы лису, без вариантов плагины бы использовал, полезные.

5. Локальный сервер и FTP-менеджер

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

1247347736 appserv Как облегчить работу верстальщика программиста. Программы спешат на помощь. В общем нам нужен следующий пакет из: сервера (например, Apache), интерпретатора (например, PHP), базы данных (например, MySQL), ну и веб-интерфеса по работе с базами данных (например, phpMyAdmin). По отдельности всё устанавливать довольно мыторное занятие. Именно для этого умные люди придумали пакет, в котором представлено всё вышеизложенное и имя ему - Appserv. В принципе установив его, к нему уже можно пристёгивать и остальное, что вам надо, типа других интерпретаторов языков, ZendOptimizer и так далее.

02042176 Как облегчить работу верстальщика программиста. Программы спешат на помощь. А фтп-менеджер нужен для закачки файлов на сервер. ФТП-шников много, на вкус и цвет. Лично я почему-то предпочитаю FileZilla. В редких случаях использую Total Commander, но он какой-то более медленный. Есть ещё, кажется, CuteFTP. Часто о нём говорят, но попробовать как-то не доводилось.

6. Несколько важных сайтов

3 Как облегчить работу верстальщика программиста. Программы спешат на помощь. Конечно, я не буду называть тут гугла и яндекса, а назову что-то более конкретное. Например, есть замечательный сайт по html и css, где подробно расписаны свойства тегов и различных свойств. Если что-то вылетело из головы и хочется срочно припомнить - я залетаю в браузер и набираю http://htmlbook.ru/.

Есть ещё два ресурса, которые проверяют на корректность HTML и CSS код. HTML проверяется сайтом http://validator.w3.org/ , а CSS - http://jigsaw.w3.org/css-validator/.

7. Литература

Литература встречается разная, какая-то просто полезная, какая-то интересная, а какая-то становится настольными книгами.

  • Дронов В. А. Adobe Dreamweaver CS4. БХВ-Петербург, 2009. С этой книги, а точнее ещё с той, где был Macromedia Dreamweaver 8, и начались мои похождения. Книга толстая, больше 800 страниц, где подробно всё разжёвано не только по дримвиверу, но и просто по хтмл. Собственно вот так, изучая дримвивер, я изучал и хтмл. В общем лучшая книга на тему, и автор крайне доступно даёт материал, да и вообще просто хороший человек - довелось пообщаться с ним по почте. Книга бы до сих пор была настольной, если бы её кто-то не взял и не зачитал - до сих пор не знаю где она. Хотя может новое издание и куплю, полистать, что-то может вспомнить. Альманах. Оценка: 5+
  • Кузнецов М. В., Симдянов И. В. PHP. Народные советы. БХВ-Петербург, 2007. Офигенная книга. Рассказано очень много полезного и интересного, сделан некий упор на защиту. И написана доступно. Маст хэв. Оценка: 5+.
  • Дунаев В. В. PHP и Javascript. БХВ-Петербург, 2006. Уже давно вышла новая версия книги. В целом книга мне не очень, не так легко читается, как хотелось бы. Однако мне нравится в ней сравнение двух языков, и особо нравятся страницы про массивы и операции с текстовыми строками. Я постоянно забываю, что делают стрчр, стрпрдр и так далее. В целом книгу использую как мини-справочник. Оценка: 4.
  • Харрингтон Д. Д. PHP. Трюки. Питер, 2008. Очень хорошая книга с очень полезными советами. Книга не предназначена для совсем новичков, но для тех кто разбирается или очень хорошо разбирается - самое то. Оценка: 5.
  • 10211222 131618093.thumbnail Как облегчить работу верстальщика программиста. Программы спешат на помощь. Бибо Б., Кац И. jQuery. Санкт-Петербург-Москва, Символ, 2009. Может книга и переведена слегка деревянно, но в целом очень неплоха. А за неимением аналогов, зе бест. Оценка: 5.

Особняком хочу сказать про две книги. "Дэйв Мерсер, Аллан Кент, Стивен Новицки и пр.  PHP5 для начинающих. Диалектика, 2006" и "Эд Леки-Томсон, Алек Коув, Стивен Новицки. PHP5 для профессионалов. Диалектика, 2006". Эти два толмута - пожалуй практически классика. Наверное в них есть всё самое-самое необходимое. Книги толстые, особенно первая и довольно мелко напечатана. В общем ясно сколько там информации подчерпнуть можно. Минуса у книг два: 1) читается довольно сложно (но можно), 2) многабукаф, ниасилил. Но ответы на вопросы найти можно в любом количестве.

 

Есть ещё интересные книги. Например, "Дронов В. Javascript Народные советы". Пока с ней я не успел подробно познакомиться, но обилие примеров и наглядно решаемых вопросов уже говорят поставить книге пять.

А ещё любителям миниатюризации советую две карманных книги: "Кристиан Уэнц. PHP карманный справочник. Москва, 2007". Как таковой базы PHP тут нет, просто рассмотрены различные интересные примеры. А вторая книга для начинающих изучать JavaScript - "Рева. О. Н. JavaScript в кармане". Неплохую базу подчерпнуть здесь можно. Хотя в целом ничего сверх-сверх в книги нет, кроме удобного размера=).

 

В завершении

А я уже всё и сказал. Буду рад дополнениям и комментариям=).

, ,

1 звезда2 звезд3 звезд4 звезд5 звезд (голосов: 2, средний: 5.00 из 5)
Понравилась статья или журнал? Подписывайся на продолжение!
Отзывов: 21 на запись

"Как облегчить работу верстальщика-программиста. Программы спешат на помощь."

  1. Черт, нигде книг почти не осталось) Я вот PHP начинал учить по книге Энди Харриса PHP for Begginers. Да вот только через некоторое время нашел западло – там писался код под старый PHP, и примеры пришлось дорабатывать самому (конечно, дополнительный стимул к самообучению, но не всегда понятно, что делаешь), конкретно, там везде нужно вручную писать запросы переменных из супермассивов

  2. Приезжай в Питер, тут есть хорошие магазины, не говоря об одном специализированном: выбирай – не хочу=)
    На тему ПХП вторым и третьим пунктом две книженции. Дунаев правда скорее для начинающих, но если что-то надо вспомнить, самое то. А Кузнецов-Симдянов как сборник полезностей и нужностей. А вообще надо в магаз итти и выбирать, потому что и на вкус, и на цвет, по крайней мере в Питере=)

  3. До Питера метро не провели из Москвы )
    Сегодня был в книжном магазе, мало чего полезного нашел, но всё-таки купил по дешевке уцененные книжки. Какую-то PHP5 (так, для самоповторения) и ActionScript 2.0 (старьё, но может найдётся чего полезного).
    Сегодня продолжил эксперименты с PHP. Учебник Харриса хорош тем что там, во-первых, разжевано (реально просто), а во-вторых, есть домашние задания, без ответов. Радует то, что мне они даются, даже легко.
    Будем искать в других магазах

  4. Да? А жаль=)
    Ну тогда поздравляю и желаю найти, то что хочется и то что было бы нужно и полезно=).

  5. сейчас пользуюсь программой Top Style 4ой версии, без нее и расширения для FF FireBug вообще не представляю как можно сверстать страницу аккуратно и быстро, если вы не сталкивались, то очень рекомендую заметки Вредного

  6. хмм, про Топ Стайл слышал, но пользоваться не приходилось.
    в принципе скорость и аккуратность приходят со временем. сейчас у меня наблюдается тенденция, что я быстро верстаю страницу на одном браузере и во время вёрстки стараюсь не использовать то, что может привести к потери “кроссбраузерности”. а потом в конце уже проверяю во всех браузерах и вношу мелкие правки. но тем не менее подобие файрбага в Хроме мне помогает разбираться с чужими вёрстками по-быстрому, за что большой респект=)
    сайт обязательно гляну на днях, как время выдастся=)

  7. Вроде нашел всё, что хотел) Ну почти всё) Осталось буквально пара книжек. Буду еще флеш постигать, т.к. раньше умел что-то

  8. Молодцом!=)
    Смотри правда на многое не распыляйся, это иногда вредно бывает=)

  9. Сижу на дримвивере, но пытайюсь переехать на редактор Аptanа
    Две причины:
    1. Аptana бесплатен и имеет хороший функционал
    2. Для него есть плагин от Сергея Чикуенка zen-coding 0.5 который просто в разы ускоряет верстку http://chikuyonok.ru/2009/11/zen-coding-v05/

    p.s.
    Но бл..дь так сложно отвыкнуть от дримвивера.

  10. Хммм, очень интересный функционал плагина. Обязательно скачаю посмотрю, может тогда юзать буду, может даже вместо любимого phpDesigner. В общем надо глянуть, спасибо за наводку

  11. Александр и другие веб мастера, подскажите с какой книги лучше начинать обучение html, CSS, PHP? И в каком порядке, чтоб все уложилось и не перемешалось :) Заранее спасибо.

  12. Александр Шуйский
    25/03/2010 at 18:00 Постоянная ссылка Цитировать

    Прежде всего нужен html+css. В принципе уже с самыми простыми знаниями html можно начинать знакомиться с php (т.к. незнакомые теги всегда можно посмотреть на htmlbook). На изучение всей базы html и css должно уйти не больше месяца-двух, т.к. там учить особо нечего. Все нюансы познаются на практике.
    Лично я начинал изучать html и css при изучении Дримвивера. Я щёлкал кнопочки, он мне делал код, я код изучал (книга Дронова по Дримвиверу выше). Сейчас я понимаю, что других книг по html и css у меня не было вообще, учился на примерах. Недавно зашёл к другу, увидел у него толмут по CSS2. Полистал и понял, что ничего нового там нет. Однако я бы не отказался от этой книжки в самом начале обучения.
    Пхп я хотел изучать тоже с дримом, но это оказался бред, однако это помогло понять различные вещи (книга Дронова по PHP и MySQL в Дримвивере).
    Простой и всецело понятной книги по ПХП я не видел, однако предложенная выше книга Кузнецова PHP, Народные советы, очень близка к этому, я бы с неё начал.

    ПыСы – и читай Шублог, тут для новичков много полезного =)

  13. И все-таки ни одна блокнотина кроме SciTE еще не научилась сохранять файл «по потере фокуса». А ведь это офигительно удобно при локальной отладке – Alt-Tab или клик по браузеру а файл уже сохранён. Я пхпДизайнер крутил-крутил, да никак не могу на него полностью перейти – каждый раз чертыхаясь переключаюсь обратно в него чтобы Ctrl+S прессануть.

    PS Или я не умею пхпДизайнер настраивать? ;)

  14. Подскажите, можно ли браться за изучение Javascript, если html и CSS уже освоены, и даже создан сайт.(т.е минуя php) И можно ли построить сайт используя JQuery, html и css без знаний Javascript.

  15. Ответ на первый вопрос однозначен – можно. А на второй – тоже можно, НО. Для начала я бы взял книжку по яваскрипту и проштудировал её. Я указывал книгу – “Рева. О. Н. JavaScript в кармане”. Там базово всё толково рассмотрено. КНига небольшая, этих основ хватит. А после я бы купил книгу по жкьюри и её стал бы уже штудировать. Освоив это, можно качать примеры и скрипты из инета и исправлять под свои нужды, ну, или порой изобретать велосипед. В любом случае знания и те, и те не лишни – пригодятся. Тем более освоить азы жабы – дело пары плодотворных дней.
    Но потом, если зотите делать сайты, от языков программирования типа пхп и асп не деться. Но это совсем другая история =)

  16. Спасибо за ответ. Начну изучать php, а уж потом за остальное примусь.

  17. Рад был помочь!

  18. Могу порекомендовать еще одну систему для создания сайтов infora.com.ua/xtms-landing-page

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

  19. хм, любопытный ресурс. на досуге поковыряю ради интереса.
    спасибо за линк! =)

  20. Андрей
    15/09/2012 at 17:55 Постоянная ссылка Цитировать

    Александр, извини если отвлекаю от повседневных дел. Ты писал что Adobe Dreamweaver сам тебя как-бы вел и показывал код, когда ты начинал осваивать вёрстку + один хороший автор. Мог бы ты сказать какого автора автора ? если не для рекламы то на почту. Спасибо.

  21. Александр Шуйский
    16/09/2012 at 9:29 Постоянная ссылка Цитировать

    Так вон в тексте статьи есть и название, и автор, буквально первым же пунктом в блоке “Литература” =)

Добро пожаловать, коллега! Вы можете оставить свой отзыв:





Допустимые XHTML-теги:

<a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

Подписка на комментарии