Los mejores programas para diseñar sitios web

No hay modo de obviarlo: el diseño efectivo de sitios web puede ser una tarea compleja, difícil y larga. Afortunadamente, las herramientas de software de diseño de sitios web pueden hacer el proceso mucho más fácil. Cuando se trata de diseño de sitios web, incluso los expertos utilizan software de diseño web, en lugar de diseñar desde cero. Es más fácil, uno se ahorra tiempo y lo típico es que así se logre un mejor resultado.

Pero si no eres un experto en diseño de sitios web, no te preocupes. Por fortuna, hay un buen número de programas de diseño de sitios web de WYSIWYG (What You See Is What You Get) que pueden hacer que el diseño de un sitio sencillo sea un trabajo increíblemente fácil. Sin embargo, incluso con los programas de WYSIWYG,  es una buena idea tener al menos un conocimiento básico de programación. Si tus habilidades de programación son muy flacas, vale la pena aprender un poco sobre el tema, especialmente HTML.

En todo caso, hay una variedad de herramientas disponibles, que han sido diseñadas para adaptarse a varios niveles diferentes niveles de habilidad. Echemos un vistazo a algunas de las mejores herramientas de software para el diseño de sitios web.

1. Adobe Dreamweaver

Dreamweaver tiende a ser el software de diseño de sitios web elegido por muchos diseñadores con experiencia moderada y también por expertos. Definitivamente, es mucho más que un editor de HTML, Dreamweaver logra integrar completamente el diseño visual con las herramientas de codificación. También es compatible con una variedad de diferentes lenguajes de scripting, incluyendo PHP, ASP y CSS.

Dreamweaver proporciona a los usuarios un alto nivel de control a lo largo de todo el proceso de diseño. El nivel de personalización que ofrece el software es prácticamente inigualable. Dreamweaver te permite crear funciones interactivas avanzadas, como menús desplegables, imágenes de sustitución,  diseños de la red de fluidos, aplicaciones sencillas para dispositivos móviles y paneles plegables.

Gracias a la avanzada capacidad de WYSIWYG, la creación de un sitio web sencillo con Dreamweaver es, en realidad, bastante fácil. Dreamwaver desarrollará código HTML por ti; también otros programas de software WYSIWYG lo harán por ti, por lo que no tienes que ser un genio de la codificación para crear un sitio web. El Design View de Dreamweaver te proporcionará  el editor de WYSIWYG más avanzado disponible en el mercado hoy.

Debido a que Dreamweaver ofrece edición híbrida, si tienes conocimientos de codificación, puedes trabajar en un entorno de doble panel  y así aprovechar la codificación de WYSIWYG  y la codificación manual al mismo tiempo. Y si ya eres un experto en codificación, puedes trabajar exclusivamente en código, sólo  haciendo el cambio a modo visual para ver el producto final. Para terminar, Dreamweaver es compatible con docenas de plug-ins, por lo que el diseño web resulta aún más fácil.

Pero, por favor, ten en cuenta que  Dreamweaver es un programa muy complejo, sobre todo si apenas estás empezando con el diseño de sitios web. Si eres un principiante, te convendría tomar un curso acerca de Dreamweaver. También puedes instruirte en otras herramientas de diseño de Adobe en este curso acerca de Adobe Muse.

2. Microsoft Expressions Web

Igual que Dreamweaver, el ‘Microsoft Expressions Web program’  tiene funciones de edición híbrida en una configuración de doble panel, lo que permite a los usuarios trabajar en WYSIWYG y con el código manual al mismo tiempo. ‘Microsoft Web Expressions’ viene con plantillas web integradas que hacen el diseño web más fácil. Pero esto no significa necesariamente que el programa es para principiantes, ya que no existen herramientas de dibujo, ni colocación a través de la herramienta de “arrastrar y soltar”. Así que si estás luchando con los conceptos básicos de diseño de páginas web, asegúrate de revisar  un curso como este y así poner al día tus habilidades.

Microsoft Expressions Web es también notable por sus funciones de SEO, cosa que resulta de gran valor cuando se trata de crear un sitio web efectivo. El programa ofrece consejos e ideas sobre cómo optimizar tu sitio para obtener mejor rastreo y mejor posición en el ranking de los motores de búsqueda.

3. Coda 2

Coda es un programa de software de diseño web exclusivo para Mac. Fue lanzado por primera vez en 2007 y una versión actualizada se publicó en 2012. El programa cuenta con una interfaz de usuario increíblemente conveniente. Toda la idea de Coda es “el diseño web de una sola ventana,” lo que significa que no tendrá que cambiar entre programas o aplicaciones durante el proceso de diseño. Y la interfaz Coda 2 es aún más fácil de usar que la versión original. Cuenta con una “Súper Barra lateral”, que tiene una serie de herramientas básicas para facilitar el acceso.

Coda podrá no tener las características de diseño visual que ofrece Dreamweaver, pero ofrece un entorno de codificación de primer nivel para HTML y CSS, incluyendo sugerencias para el código, validación y depuración. Las herramientas de creación CSS son especialmente notables pues permiten a los diseñadores de sitios web controlar las hojas de estilo desde una interfaz visual.

4. Amaya

Amaya es una herramienta gratuita y de código abierto  de WYSIWYG. Su propósito es una creación de sitios web que es ejecutable en Linux,  en Mac y en Windows. Amaya ha existido entre las opciones disponibles por un buen tiempo; apareció por primera vez en 1996 y fue actualizada por última vez en enero de 2012. Es ideal para principiantes  sin mucha experiencia de codificación, esta herramienta de WYSIWYG  es compatible con HTML, CSS y XML.

5. Bluefish

Bluefish es un editor de texto avanzado gratuito y de código abierto. Es compatible con múltiples plataformas, incluyendo Linux, Solaris y Mac OS X y Windows. Es muy versátil y flexible; ofrece una variedad de herramientas para la programación en general y permite el desarrollo de HTML, XHTML, CSS, XML, PHP, C, C + +, JavaScript, Java, Google Go, Vala, Ada, C, SQL, Perl, ColdFusion, JSP, Python, Ruby y concha, entre otros. Sin embargo, es un programa de software “codificación inteligente”, no es un WYSIWYG; así que sí hace falta saber codificar.

Bluefish es una de las mejores herramientas gratuitas de diseño de sitios web que se encuentran disponibles para todos. Y, entre las herramientas gratuitas, esta es una  que es especialmente útil para el diseño web dinámico. Una página web dinámica  es una página con contenido que cambia para adaptarse a los parámetros proporcionados por un usuario específico, o por un programa. Es especialmente útil cuando se trata de diseño web para móviles, que se está haciendo cada vez más importante, a medida que más y más personas utilizan sus dispositivos móviles para acceder a Internet. ¡Aprende más sobre el diseño de página web dinámica en este curso!

1. Adobe Kuler

Si necesitas crear una paleta de color para tu proyecto Adobe Kuler es tu solución. Una aplicación de internet de Adobe gratuita, que te permitirá crear y buscar combinaciones de colores. Para hacer uso de esta aplicación deberás estar registrado como usuario en la página de Adobe, y con tu usuario y password podrás tener acceso a él.

2. Typecast

Esta aplicación te permite trabajar con mas de 5.000 fuentes desdeTypekit, Fontdeck, Fonts.com y Google Web Fonts en un solo panel de control.

El objetivo es poder decidir la tipografía que utlizarás en los textos que publicarás en la web de forma sencilla y rápida, de la misma forma que lo hacemos con los editores de texto y fotografía tradicionales. Puedes crear columnas de contenido y alterar la tipografía usada, escogiendo en el menú lateral el proveedor de las fuentes y escribiendo cualquier tipo de texto para ver los resultados directamente en la web.

Además podrás obtener el código CSS para poder utilizar esas fuentes en tus páginas web, con la total certeza de de que tus usuarios cargarán la fuente y verán el mismo resultado que tu.

3. Mockflow

Te permite montar un prototipo en cuestión de minutos, online y para multitud de plataformas diferentes: Android, iPhone, WordPress, Joomla, Drupal, Facebook… Es muy intuitiva ya que es tan fácil como hacer drag and drop con los componentes que te proporciona paraconstruir tu wireframe.

La versión gratuita sólo permite un proyecto con 4 páginas, pero puedes descargarlas en diversos formatos y borrarlas conforme las dejes de necesitar.

4. GuideGuide

Es una extensión de Adobe Photoshop con la que preparar tu documento para comenzar a diseñar tus webs será cuestión de minutos. Un plugin que se ha convertido en un imprescindible dada la importancia de las guías para conseguir diseños web perfectos. Una vez que la instales no vas a querer dejar de usarla.

5. Layervault

Seguro que más de una vez hemos tenido dificultades para gestionar dentro de un proyecto las últimas versiones de los archivos. Sobre todo cuando un mismo archivo va siendo editado por varias personas a la vez.

Layervault es una aplicación web que te permitirá controlar y gestionar todos los aspectos de tu proyecto (comunicación con compañeros, gestión de archivos, etc.) desde una misma interfaz.

Puedes añadirla a la barra de tareas, lo que te permitirá ir guardando de forma automática a través de la sincronización cualquier cambio, archivo, carpeta, etc. en el directorio de LayerVault. Así tus compañeros de proyecto irán recibiendo actualizaciones para estar informados de qué aspectos del trabajo se actualizan o cambian, y también recibiremos dichas notificaciones en nuestros otros dispositivos si también los sincronizamos.

6. Invision

Esta herramienta ha revolucionado el mundo de las aplicaciones de representación de prototipados. Esta herramienta transforma tus diseños rápidamente en prototipos interactivos con transiciones y animaciones web dotando de gran realismo a tus mockups. Te permite compartir un mismo proyecto con cuanta gente se desee (entre ellas el cliente) por lo que resulta muy práctica a la hora de que este puedaprevisualizar e interactuar con el diseño de su web antes de comenzar con su desarrollo.

7. Codekit

Es una herramienta que te ayuda a construir webs de manera más rápida y más ordenada. Además te permite compilar Sass y Less y optimiza tus archivos.

Con Codekit podrás importar tus frameworks de manera que si haces uninclude de algún archivo lo buscará primero en el proyecto concreto en el que estés trabajando y, si no lo encuentra, recorrerá tus frameworks para incluirlo.

8. Proto-io

Si lo que estás diseñando es una aplicación proto.io es una de lasherramientas más potentes de prototipado que ofrece el mercado de las apps hoy en día.

Ofrece un entorno de creación de prototipos que podrás usar para crear y presentar el diseño de tu futura aplicación.

Posee multitud de opciones para incluir y configurar nuevos componentes, así como definir los agentes (iPhone y iPad, de momento) que deberán acceder al proyecto creado.

También te permite decidir si la aplicación será mostrada en posición horizontal o vertical, por ejemplo, así como incluir botones, formularios, código html, barras, textos, listas, menús, etc., todo sobre una pantalla dividida en zonas para facilitar la posición correcta de cada componente.

La versión gratuita está limitada a un proyecto y un agente, permitiendo guardarlo dentro del subdominio que decidamos.

Estas herramientas que te hemos mostrado es una pequeña recolección de las más aceptadas y utilizadas por los diseñadores web hoy en día y que mejor te pueden funcionar.

9. Sublime text

Para aquellos diseñadores que decidan sumergirse en la primera fase desarrollo de la web Sublime Text es un editor de código multiplataforma, ligero y con pocas concesiones a las florituras. Es una herramienta concebida para programar sin distracciones y bastante intuitiva.

Sublime Text te permite tener varios documentos abiertos mediante pestañas, e incluso emplear varios paneles para aquellos que utilicen más de un monitor. Dispone de modo de pantalla completa, para aprovechar al máximo el espacio visual disponible de la pantalla.

A partir de ahora diseñar un proyecto web perfecto de principio a fin será una tarea mucho más fácil e intuitiva y tus clientes estarán mucho más satisfechos.

 Configurar página

Cuando estamos escribiendo en un documento Word es como si lo hiciéramos en una hoja de papel que luego puede ser impresa. Por lo tanto, existe un área en la cual podemos escribir y unos márgenes los cuales no podemos sobrepasar.

Estos márgenes se definen en la pestaña Diseño de página, en el grupo de herramientasConfigurar página, donde también podremos encontrar herramientas para seleccionar laOrientación, Saltos de página, Tamaño, Números de línea, Columnas y Guiones.

Al hacer clic sobre el botón Márgenes, aparecen unos márgenes predeterminados. Si ninguno nos sirve, podremos definir unos desde la opción Márgenes Personalizados.

BLOGS

WIKIS

Blogspot.com:Con un estilo similar al de WordPress.com pues de hecho su código se basa en tal CMS -las diferencias están en el precio de las funciones Premium-, Blog.com nos ofrece un fascinante sitio optimizado para los motores de búsqueda, rápido, estable, con un diseño espectacular, manejo de widgets, un dominio del tipohttp://tusitio.blog.com y un límite de 2 GB gratuitos para su alojamiento. Blogetery:También está basado en WordPress pero a diferencia de su versión online, cuenta con decenas de plugins para escoger al instante. Otras de sus más llamativas características se ven en el alojamiento, los temas, la optimización para un rápido posicionamiento y la posibilidad de monetizar el contenido rápidamente con servicios como Google AdSense.http://tusitio.blogetery.com será la estructura que llevará tu nueva dirección. Blogger.com :es un popular sistema de plublicación de blogs creado por Pyra Labs, pero comprado por Google en 2003. Su popularidad radica en su facilidad de uso y los numerosos servicios que entrega a los usuarios. Se ha ubicado dentro de los 16 dominios con más visitantes únicos en Internet. Tumblr :Quien se lleva todos los elogios respecto a minimalismo, elegancia y simplicidad en la actualización al estilo microbloggingespecialmente para la publicación de imágenes, audio y otro contenido multimedia. Las categorías por temáticas, la sincronización con Facebook y Twitter, la integración con los servicios de Google y su sistema para compartir los posts entre usuarios, son de lo más destacado.

PBworks:Tienes acceso a la mayoría de las funciones de PBworks en su nivel de servicio gratis por un período ilimitado de tiempo. El inconveniente es que puedes tener un máximo de tres usuarios que están autorizados a editar el wiki, y el wiki se mantiene con anuncios. Además, algunos cosas buenos, como 'búsqueda' y 'analítica no están disponibles en su nivel de servicio gratuito. Dispone de mucha personalización. El acceso individual puede ser controlado en múltiples niveles, desde el nivel de carpeta hasta el nivel de página. Tú obtienes todas las características estándar de wiki: revisión de control, notificaciones de cambios de página vía RSS / correo electrónico, pueden aplicarse HTML / CSS a las plantillas, editor WYSIWYG de páginas, facilidad para hacer copias de seguridad en zip. Wetpaint:Altamente recomendable, sencillo, potente y muy atractivo. Te ofrece muchas plantillas a elegir y un montón de opciones o funciones integradas con posibilidad de dejarlo abierto para que cualquiera pueda editarlo o cerrado sólo para determinadas personas.  Crear, contribuir, conectar. Este es el nuevo mantra para el recientemente lanzado Wetpaint, un nuevo servicio wiki, que le permite crear, editar y colaborar en contenido web privado o público con una simplicidad y facilidad de uso sin precedentes. Esto es realmente como los wiki deberían haber sido siempre, ya que mientras que los wikis han nacido para hacer extremadamente sencillo e inmediato para muchas personas colaborar y editar contenido online, por demasiadas razones los primeros productos y servicios comerciales ofreciendo tales capacidades fallaron en hacer la interfaz suficientemente buena para el usuario casual no-geek. Wikispace: Wikispaces es probablemente el mejor wiki para un principiante y es una plataforma capaz para organizaciones más grandes también. Es intuitivamente fácil de configurar y personalizar. Y si tienes problemas, la comunidad ofrece una gran cantidad de apoyo y el equipo de Wikispaces está disponible a través de correo electrónico. Hoy por hoy es la más empleada en el ámbito educativo. Al igual que PBWorks, la versión gratuita se mantiene con publicidad. Sin embargo, carece de algunas de la flexibilidad de los demás examinados aquí. Tanto en la versión gratuita como en la de pago tienes las características wiki estándares: control de revisión, notificaciones por RSS / correo electrónico de los cambios de la página, editor WYSIWYG de páginas, copias de seguridad en zip. La personalización de las plantillas mediante HTML / CSS sólo está disponible para las soluciones pagadas. Wikispaces no ofrece funciones de control de acceso al contenido hasta que actualices a una de las etiquetas privadas. Mediawiki:Mediawiki porque está realizado bajo licencia GPL (de uso libre), programado en PHP utilizando MySQL. Fue desarrollado originalmente para la Wikipedia, de ahí la similitud del término. Destacan sus características para establecer permisos para separar páginas de distintos tipos, tener una página de discusión propia, hacer un seguimiento del cambio que experimenta la página, admitir diferentes grados de usuarios así como la capacidad de bloquearlos, permitir poner los nombres a los artículos de forma más natural, capacidad para manejar diferentes formatos de imagen, traducido a diferentes idiomas, soporta plantillas que permiten darle un estilo diferente, etc.

Taller 5.2

Los blogs, weblogs o bitácoras son el fenómeno de mayor actualidad en la Red, son sitios web donde se recopilan cronológicamente mensajes de uno o varios autores sobre una determinada temática. Puede tratarse de un diario íntimo, un diario comunitario, de actualidad o un diario de clase en los que su autor publica artículos que pueden contener texto, imágenes, vídeos, sonidos, ... Hay blogs para todos los los gustos y sobre todos los temas, y lo más importante es que cualquiera puede publicar uno.
Desde un punto de vista estructural, un blog consiste en una serie de artículos (también llamados entradas o posts) clasificados por fechas. El artículo más reciente es el primero de la lista. Además de los artículos la mayoría de los blogs aportan funciones adicionales como clasificación de los artículos por categorías, buscador de contenidos, soporte multiusuario (varios autores pueden publicar artículos en el blog), generación de RSS para la sindicación de contenidos, gestión de comentarios, etc.

Diferencias entre un sitio web y un blog

Hay cuatro diferencias básicas:

• La facilidad con que se añaden contenidos a los blogs. El autor no necesita ningún conocimiento técnico y la elaboración de los artículos y su publicación es cuestión de minutos.

• El trabajo en colaboración. Un blog puede ser personal, pero a menudo son varios los autores que colaboran, sin contar los comentarios a los artículos publicados. También es habitual encontrar muchos enlaces entre blogs, formando una auténtica comunidad: la Blogosfera. 

• La frecuencia de actualización: debido a los dos factores anteriores: facilidad y colaboración; los blogs suelen actualizarse muy frecuentemente, algunos varias veces al día.

• En su contra, está su estructura rígida. Basada en la publicación cronológica de artículos.

                               

Seguro que muchos se habrán preguntado sobre la viabilidad de crear y mantener su propio blog en una red cada vez dominada por las grandes redes sociales. Sin embargo, me atrevo a decir que los blogs están más vivos que nunca y que Facebook, Twitter, Google+ y las demás, lo único que han hecho es potenciarlos: llevar el contenido a mucha más gente, conseguir más específicos lectores, establecer relaciones con otros bloggers de una manera más sencilla, obtener más y mejores comentarios, etc.

Lo mejor de todo esto es que lo único necesario para crear un blog es una idea y las ganas de ponerla en práctica, pues respecto a gestión del contenido y almacenamiento las opciones gratuitas abundan. Como ejemplo los siguientes 10 ítems, 10 grandes plataformas online para armar un espacio de calidad literalmente en segundos. Gracias a Six Revisions por enunciarlos.

PAGINAS QUE AYUDAN A CREAR PAGINAS WEB,BLOGS, WIKIS

1.    Blogetery

2.    BLOG.COM

3.    Weebly

4.    WIX.COM

5.    BLOGGER

2. punto

 

La mejor pagina para crear wikis seria para nosotros Wikipedia aunque no es muy autónoma porque se puede dar información pero no se puede trabajar por completo y para crear blogs es blogger nos permite crear un blog muy completo sin necesidad de ser programador.

 

PASOS PARA CREAR UN BLOG

Paso 1:

Ingresa a la página web: http://blogger.com. Si ya tienes una cuenta creada en Gmail,Youtube o algunos de los servicios de Google, sólo tienes que escribir en los campos de Inciar sesión  tu nombre de usuario y contraseña y omite los pasos que siguen.

Paso 2:

Cuando estés allí, haz clic en el botón Crear cuenta de la parte superior derecha.

Paso 3:

Verás que aparece un formulario. Diligéncialo con tus datos personales en las casillas correspondientes.  

Paso 4:

No te olvides de leer cuidadosamente y señalar la casilla Acepto las condiciones del servicio y la política de seguridad de Google.

Paso 5:

Cuando hayas terminado, haz clic en el botón Siguiente paso de la parte inferior del formulario.  

Paso 6:

Aparecerá una nueva página que contiene tus datos de perfil y la opción para que cambies tu foto. Cuando lo hayas hecho, selecciona el idioma en la parte superior y haz clic en el botón Continuar en Blogger de la esquina inferior.

Biografia

http://www.gcfaprendelibre.org/tecnologia/curso/crear_un_blog_en_internet/crear_un_blog_con_blogger/1.do

trabajo hecho por martin Jaramillo y Sergio valencia 10c