¿Que programas necesito para diseñar y desarrollar un sitio web?

Hace unos días recibí un twitt de un familiar, que me preguntaba que programas eran necesarios para diseñar y desarrollar un sitio web.

Aquí esta la respuesta, basada en los elementos que yo utilizo.

El diseño y desarrollo de un sitio web se basa en una serie de items que son importantes además de la estrategia, el plan de mercadeo digital y el posicionamiento web.

Herramientas para diseño y manejo fotográfico.

Adobe Creative Suite

La suite creativa de adobe es tal vez un de las herramientas más completas para el diseño gráfico y web en el mundo, ya que integran todo lo necesario para lograr resultados óptimos y de gran calidad.

• Ilustrator.El uso de ilustrator ayuda el diseño de sitios vectoriales de gran calidad. En este programa el diseñador puede plasmar un buen diseño web basado en wideframes o mocups que han sido planeados con anticipación y definir todos los estándares necesarios basándose en tendencias web y el manual de identidad corporativa de la marca o producto.

• Photoshop.El retoque digital de imágenes es un punto vital para la estética visual del sitio, pero también para la parte funcional del mismo;  Ya que una imagen muy pesada puede tardar mucho tiempo en cargar y afectar directamente el rendimiento del servidor y el posicionamiento orgánico.
  “Recomendaciónes en photoshop: guardar todas las imágenes a 72 dpi (Aunque ya no es tan relevante), para web en formato jpg o png-8 si los colores de la imagen no supera los 256, en caso contrario guardar como png-24.”

• Fireworks (Q.E.P).El fallecido fireworks en la versión Creative Cloud para equipos de adobe y al cual no se le brindara más soporte, es tal vez una de las mejores herramientas para el manejo de imágenes y diseño de templates web sobre el planeta tierra, debido a que fue concebido en su totalidad para la manipulación de imágenes y contenido web.Tal vez esta herramienta sea sustituida en su totalidad por la opción “Guardar para web” de photoshop e ilustrator.

• Flash
  Aunque Flash viene incluido en Creative Suite de Adobe, este no sirve para diseñar sitios web.

Herramientas de video

• Adobe after efects
  Este programa que también pertenece a Adobe, es en mi concepto el más integral para editar y producir vídeo de gran calidad para la web, además permite crear una gran cantidad de efectos y manejos técnicos para el mundo exigente de hoy a nivel de video.

• Camtasia estudio 8
  aun que es considerado como un complemento más que otra cosa, este programa permite la grabación y edición de la pantalla del computador o ordenador y es muy utilizado más que todo para la grabación de video tutoriales para youtube.

Aplicaciones para diseñar y desarrollar sin saber programar

• Adobe Muse
  Es la apuesta que ha hecho Adobe, para las personas que saben diseñar,no tienen idea de como programar y deciden diseñar un sitio web.
  Funciona de una manera muy intuitiva con herramientas similares a las de ilustrator y exporta el codigo en HTML5.Conozca adobe muse en el video de adobexpert

• Google web designer
  El nuevo juguete que Google pone a disposición de los diseñadores y desarrolleres web, y funciona bajo el mismo concepto de muse: “Diseñe y desarrolle sin saber codigo”, se encuentra en versión beta y en las primeras impresiones funciona de una manera muy optima descarguelo aquí.

  

 
[lista]
Herramientas para desarrollo

• Sublime text 2 – Recomendado – Descargelo aquí
  Este editor de texto que se puede utilizar de manera libre, o con una donación de $50 US para su desarrollador, se ha convertido en una herramienta de desarrollo web profesional muy utilizado a nivel mundial, debido a que integra todo lo necesario para realizar la web de una manera sencilla, rápida y con excelentes resultados.
  Requisitos: Saber HTML al menos (Aprender con Code Academics).

• Coda2
  Es otro editor de texto bastante poderoso y flexible que le permite al desarrollador generar código de una manera fácil y eficiente.

• Dreamweaver
  Es un editor de texto que funciona bajo el modelo why you see why you get (WYSIWYG) – Lo que vez es lo que obtienes, donde el desarrollador puede ir viendo el funcionamiento del código sin necesidad de probarlo directamente en el navegador. Aunque parece ideal es un software muy pesado y que cada vez va perdiendo más popularidad entre los desarrolladores.

Existen muchos más ¿Ustedes cual usan?.

Bonús

Complementos para el código web

Con el auge del HTML5 y la creación de nuevas tendencias web, donde se pueden desarrollar sitios móviles y aplicaciones se han creado una serie de librerías y frameworks que le hacen la vida mucho más fácil al desarrollador web, solo voy a mencionar algunos:

• Jquery: Uso de javascript de una manera más sencilla y rápida
• JqueryUI: Uso de javascript para móviles
• Raphael: Animación de canvas
• Modernizr: Integración de HTML5 para navegadores no compatibles
• CSS3PIE: Bodes y sombras de HTML5 para navegadores viejos (IE6,IE7,IE8).

CMS

El uso de Content Management System(cms) – Generadores de contenido, es tal vez una de las tendencias más usadas en el mundo para complementar el diseño y el desarrollo web. Debido a la facilidad que brinda a las personas que no entran dentro del proceso de diseño y desarrollo para generar contenido constantemente de manera facil.

los más usados:

• WordPress
• Joomla
• Drupal
• Magento
• Prestashop
• Thumblr

Y existen muchos más dependiendo la necesidad y objetivos del sitio.