SlideShare una empresa de Scribd logo
1 de 10
Sabe que es un pagina web Una página web, también conocida como una página de Internet. es decir un documento adaptado para la Web pero normalmente forma parte de un lugar web.Su principal característica son los hipervinculos de una pagina, siendo esto el fundamento de la Web. Una página web está compuesta principalmente por información (sólo texto o módulos multimedia) así como por hiperenlaces; además puede contener o asociar datos de estilo para especificar cómo debe visualizarse, y también aplicaciones embebidas para hacerla interactiva. Las páginas web son escritas en un lenguaje de marcado que provea la capacidad de manejar e insertar hiperenlaces, generalmente HTML. El contenido de la página puede ser predeterminado ("página web estática") o generado al momento de visualizarla o solicitarla a un servidor web ("página web dinámica"). Las páginas dinámicas que se generan al momento de la visualización se hacen a través de lenguajes interpretados, generalmente JavaScript, y la aplicación encargada de visualizar el contenido es la que debe generarlo. La páginas dinámicas que se generan al ser solicitadas son creadas por una aplicación en el servidor web que alberga las mismas. Respecto a la estructura de las páginas web, algunos organismos, en especial el W3C, suelen establecer directivas con la intención de normalizar el diseño, para así facilitar y simplificar la visualización e interpretación del contenido. Una página web es en esencia una tarjeta de presentación digital, ya sea para empresas, organizaciones, personas, etc. Así mismo, la nueva tendencia orienta a que las páginas web no sean solo atractivas para los internautas, sino también optimizadas para buscadores a través del código fuente. Forzar esta doble función puede, sin embargo, crear conflictos respecto de la calidad del contenido.
Sabes que programas usar para las paginas web?
    DIFERENCIAS ENTRE FRONTPAGE Y DREMWAER
Que son editores HTML? Los editores de HTML pueden ser de dos tipos, como veremos, unos permiten codificar las páginas utilizando el propio lenguaje HTML, a base de etiquetas y otros nos permiten diseñar una página web, como si estuviésemos escribiendo con un editor de texto avanzado, sin tener que escribir el código con las etiquetas. Esta última vertiente, que podemos llamar editores en modo diseño, presenta una facilidad adicional para las personas que no deseen complicarse la vida con el lenguaje HTML, porque no tengan tiempo de aprenderlo o porque se sientan incapaces de hacerlo. Los editores en modo diseño nos permiten crear la página como si estuviéramos escribiendo un documento con un editor del tipo de Word. El editor de HTML es el encargado de vérselas con el lenguaje y programar internamente la página con el código HTML, según lo que nosotros estamos diseñando.  Con el editor HTML en vista diseño podemos colocar imágenes, definir estilos, utilizar negritas o cursivas, etc. sin preocuparnos de las etiquetas correspondientes a cada estilo o elemento. Es el editor el que conoce estas etiquetas y las utiliza convenientemente. Este tipo de editores HTML en modo diseño se denominan, en lenguaje técnico WYSIWYG (WhatYouSeeIsWhatYouGet) porque cuando trabajas con ellos lo que ves que estás creando con el editor es lo que obtienes luego cuando grabas la página.
Clases de editores Existen dos tendencias, por tanto, entre los desarrolladores que se dedican a realizar páginas web. Por un lado tenemos a las personas que prefieren crear las páginas programando el HTML y por otro las personas que utilizan editores HTML en modo diseño. Algunas diferencias entre hacerlo de un modo u otro son las siguientes:
Editores HTML modo diseño WYSIWYG En el mercado existen multitud de editores de HTML WYSIWYG, es importante elegir un editor bueno porque nuestros trabajos van a depender de sus resultados. Actualmente el rey de los editores y el que os aconsejaríamos sin duda es el Dreamweaver, fabricado por Adobe. Otras posibilidades son editores como  Kompozer, una opción gratuita  Frontpage, aunque lo desaconsejamos.
Algunos editores Usar un editor visual de HTML (WYSIWYG) Algunos editores muy conocidos son Dreamweaver, Go Live o NVU. Son software especializado en la creación de sitios web, construidos para crear y modificar el código HTML, CSS, PHP, etc. de tus páginas web. Tienen funciones muy útiles para un diseñador web, como el editor gráfico, que te permite crear webs con pocos conocimientos de HTML ya que se asemeja a un procesador de textos. Otras funciones muy interesantes de estos programas son el permitir remplazar código de múltiples páginas a la vez, la comprobación de errores de programación en el código, previsualizar las páginas en diferentes navegadores, etc. En esta misma web hay un manual de Dreamweaver para que aprendas a manejarlo. Lo más interesante sin duda para una persona que está aprendiendo a hacer webs es el editor gráfico. Tú creas la página como si del Word se tratara; escribes el texto, los títulos, pones las imágenes, eliges los colores, etc. y el programa te guarda la página con el código HTML listo. Es lo que se llama WhatYouSeeIsWhatYouGet (WYSIWYG), lo que ves es lo que obtienes. Se les llama así con razón, puesto que utilizandolos no es necesario escribir nada de código HTML para crear una página web. La desventaja que tienen estos programas es que si no sabes nada de HTML el diseño de tu página va a estar algo limitado, porque con el editor gráfico se pueden hacer cosas básicas o intermedias, pero para funciones más complicadas es muy recomendable saber un poco de HTML.
Editores de texto preparados para escribir código HTML Las personas que después de estas líneas han decidido aprender el lenguaje HTML también tienen herramientas muy interesantes para aumentar su productividad sin dejar de escribir ellos mismos el HTML que desean. Se trata de unos editores de texto, como cualquier otro, que están preparados para escribir HTML y por lo tanto ofrecen multitud de ayudas a los diseñadores: Pueden tener abiertos y editar varios ficheros a la vez  Colorean los códigos de las páginas para hacerlos más comprensibles  Suelen soportar otros lenguajes de programación con los que podemos llegar a trabajar en el desarrollo de páginas web.  Ofrecen ayudas a la programación, que muchas veces son contextuales y se activan a medida que vamos realizando las páginas.  Y además muchos de ellos tienen herramientas integradas para hacer cosas tan variadas como la generación de código, asistentes, módulos de conexión por FTP con el servidor, etc.  Dependiendo del programa escogido tendremos unas herramientas y ayudas u otras. Simplemente es elegir el que más se adapte a nuestras necesidades. Algunos ejemplos son: Notepad++, gratuito y código libre.  Home Site, que estaba bien, aunque Adobe hace años que no lo actualiza.  UltraEdit, que es un editor para programadores de los más populares.  Arachnophilia, que funciona en todos los sistemas operativos.  Si nos decidimos por escribir el código fuente en HTML será muy recomendable utilizar cualquiera de estos programas, para sentirnos más a gusto al programar las páginas y poder hacerlas más rápido. No obstante cabe recordar que cualquier editor de textos serviría para hacer páginas web, incluso el Block de notas, que es el editor más sencillo que existe para texto plano, pero utilizar un programa de estos será imprescindible con el tiempo. En la sección de programas de desarrolloweb tenemos descripciones de algunos editores de HTML, tanto en modo diseño como escribiendo el código.
Usar un editor de textos o de HTML Si sabes HTML una buena opción es programar tú mismo todo el código de tu web mediante editores de código fuente como el Block de notas de Windows (no está diseñado para eso pero puede usarse), o algunos un poco más especializados como Notepad. Éste último te colorea el código de diferentes tonos según el tipo de código que tenga la página, lo cual resulta muy útil para buscar fragmentos de un vistazo. Los editores de texto son programas simples pero muy eficaces que permiten guardar documentos de texto sin formato. Al no ofrecer ningún tipo de guía visual, al contrario que los editores HTML o WYSIWYG, son los más complicados de utilizar para los que empiezar a hacer páginas web.  Los editores de HTML son básicamente editores de texto diseñados específicamente para hacer páginas web, por tanto traen incorporadas funcionalidades que no tienen los editores de texto genéricos, y que facilitan mucho las cosas.  Otros recursos para hacer tus webs
Otros recursos para hacer tus webs Usar plantillas prefabricadas (templates) Una plantilla prefabricada (o template) es un diseño ya hecho listo para que lo personalices y adaptes a tu web. En realidad el diseño ya está hecho, osea que no tendrás que “hacer la web” literalmente, pero en tus manos está adaptarlo exáctamente a lo que quieras. Obviamente para adaptarlo a tus necesidades tendrás que utilizar un editor WYSIWYG o HTML, según tus gustos. Algunos ejemplos de plantillas web (templates) disponibles en Internet: Las plantillas web se pueden encontrar en varios formatos, como Photoshop o HTML. En la mayoría de los casos, estos templates son compatibles con los editores web más conocidos, como Dreamweaver o FrontPage, por lo que pueden modificarse tranquilamente. Las plantillas web son una forma de conseguir un diseño atractivo sin necesidad de tener muchos conocimientos de desarrollo de páginas web, o también una forma de inspirarte para crear tu propio diseño (mirando lo que han hecho otros pueden surgirte ideas). Algunos sitios de templates bastante populares son: TemplateMonster, Open Source Web Design o TemplateWorld.

Más contenido relacionado

La actualidad más candente

La actualidad más candente (19)

Páginas web definición y classificación
Páginas web definición y classificaciónPáginas web definición y classificación
Páginas web definición y classificación
 
Diseño pagina web- html
Diseño pagina web- html Diseño pagina web- html
Diseño pagina web- html
 
Tipos de página web
Tipos de página webTipos de página web
Tipos de página web
 
Ppt construcción de un sitio web
Ppt construcción de un sitio webPpt construcción de un sitio web
Ppt construcción de un sitio web
 
Tipos de pagina web
Tipos de pagina webTipos de pagina web
Tipos de pagina web
 
Tipos o clases de páginas web
Tipos o clases de páginas webTipos o clases de páginas web
Tipos o clases de páginas web
 
Actividad de la 1 hasta la 5
Actividad de la 1 hasta la 5Actividad de la 1 hasta la 5
Actividad de la 1 hasta la 5
 
Diseño de páginas Web
Diseño de páginas Web Diseño de páginas Web
Diseño de páginas Web
 
1 5
1 51 5
1 5
 
Paginas web
Paginas webPaginas web
Paginas web
 
Diseño de paginas y buscadores
Diseño de paginas y buscadores Diseño de paginas y buscadores
Diseño de paginas y buscadores
 
Elementos básicos de un sitio web
Elementos básicos de un sitio webElementos básicos de un sitio web
Elementos básicos de un sitio web
 
Que es una pagina web
Que es una pagina  webQue es una pagina  web
Que es una pagina web
 
Internet Y Pag Web 2º Eso
Internet Y Pag Web 2º EsoInternet Y Pag Web 2º Eso
Internet Y Pag Web 2º Eso
 
Presentación1
Presentación1Presentación1
Presentación1
 
Relatoria
RelatoriaRelatoria
Relatoria
 
Pagina web
Pagina webPagina web
Pagina web
 
Que es Diseño web
Que es Diseño webQue es Diseño web
Que es Diseño web
 
Pagina web Yessika Morales Bueno
Pagina web Yessika Morales BuenoPagina web Yessika Morales Bueno
Pagina web Yessika Morales Bueno
 

Similar a Diapositivas

Similar a Diapositivas (20)

Programas web
Programas webProgramas web
Programas web
 
Programas web
Programas webProgramas web
Programas web
 
Editor de páginas web
Editor de páginas webEditor de páginas web
Editor de páginas web
 
Pagina web angie sanchez 11
Pagina web angie sanchez 11Pagina web angie sanchez 11
Pagina web angie sanchez 11
 
Trabajo dreamweaver
Trabajo dreamweaverTrabajo dreamweaver
Trabajo dreamweaver
 
Trabajo dreamweaver (1)
Trabajo dreamweaver (1)Trabajo dreamweaver (1)
Trabajo dreamweaver (1)
 
Trabajo dreamweaver (1)
Trabajo dreamweaver (1)Trabajo dreamweaver (1)
Trabajo dreamweaver (1)
 
Diseño de Páginas Web
Diseño de Páginas WebDiseño de Páginas Web
Diseño de Páginas Web
 
Presentación sobre conceptos de Dw
Presentación sobre conceptos de DwPresentación sobre conceptos de Dw
Presentación sobre conceptos de Dw
 
OAs editores
OAs editoresOAs editores
OAs editores
 
Juan pablo 903
Juan pablo 903Juan pablo 903
Juan pablo 903
 
Dreamwever en powerpoint[1]
Dreamwever en powerpoint[1]Dreamwever en powerpoint[1]
Dreamwever en powerpoint[1]
 
Dreamwever
DreamweverDreamwever
Dreamwever
 
Dreamwever
DreamweverDreamwever
Dreamwever
 
Dreamwever en powerpoint[1]
Dreamwever en powerpoint[1]Dreamwever en powerpoint[1]
Dreamwever en powerpoint[1]
 
HTML 5
HTML 5HTML 5
HTML 5
 
Mario marinez (paginas web)
Mario marinez (paginas web)Mario marinez (paginas web)
Mario marinez (paginas web)
 
Que son los editores WYSIWYG ? ,
Que son los editores WYSIWYG ? , Que son los editores WYSIWYG ? ,
Que son los editores WYSIWYG ? ,
 
Manual html-actualizaasddo
Manual html-actualizaasddoManual html-actualizaasddo
Manual html-actualizaasddo
 
Editor de paginas web
Editor de paginas webEditor de paginas web
Editor de paginas web
 

Último

Mapa Mental de estrategias de articulación de las areas curriculares.pdf
Mapa Mental de estrategias de articulación de las areas curriculares.pdfMapa Mental de estrategias de articulación de las areas curriculares.pdf
Mapa Mental de estrategias de articulación de las areas curriculares.pdfvictorbeltuce
 
Tema 8.- Gestion de la imagen a traves de la comunicacion de crisis.pdf
Tema 8.- Gestion de la imagen a traves de la comunicacion de crisis.pdfTema 8.- Gestion de la imagen a traves de la comunicacion de crisis.pdf
Tema 8.- Gestion de la imagen a traves de la comunicacion de crisis.pdfDaniel Ángel Corral de la Mata, Ph.D.
 
Día de la Madre Tierra-1.pdf día mundial
Día de la Madre Tierra-1.pdf día mundialDía de la Madre Tierra-1.pdf día mundial
Día de la Madre Tierra-1.pdf día mundialpatriciaines1993
 
IV SES LUN 15 TUTO CUIDO MI MENTE CUIDANDO MI CUERPO YESSENIA 933623393 NUEV...
IV SES LUN 15 TUTO CUIDO MI MENTE CUIDANDO MI CUERPO  YESSENIA 933623393 NUEV...IV SES LUN 15 TUTO CUIDO MI MENTE CUIDANDO MI CUERPO  YESSENIA 933623393 NUEV...
IV SES LUN 15 TUTO CUIDO MI MENTE CUIDANDO MI CUERPO YESSENIA 933623393 NUEV...YobanaZevallosSantil1
 
PROGRAMACION ANUAL DE MATEMATICA 2024.docx
PROGRAMACION ANUAL DE MATEMATICA 2024.docxPROGRAMACION ANUAL DE MATEMATICA 2024.docx
PROGRAMACION ANUAL DE MATEMATICA 2024.docxEribertoPerezRamirez
 
CIENCIAS NATURALES 4 TO ambientes .docx
CIENCIAS NATURALES 4 TO  ambientes .docxCIENCIAS NATURALES 4 TO  ambientes .docx
CIENCIAS NATURALES 4 TO ambientes .docxAgustinaNuez21
 
PLANIFICACION ANUAL 2024 - INICIAL UNIDOCENTE.docx
PLANIFICACION ANUAL 2024 - INICIAL UNIDOCENTE.docxPLANIFICACION ANUAL 2024 - INICIAL UNIDOCENTE.docx
PLANIFICACION ANUAL 2024 - INICIAL UNIDOCENTE.docxJUANSIMONPACHIN
 
libro para colorear de Peppa pig, ideal para educación inicial
libro para colorear de Peppa pig, ideal para educación iniciallibro para colorear de Peppa pig, ideal para educación inicial
libro para colorear de Peppa pig, ideal para educación inicialLorenaSanchez350426
 
Estrategia de Enseñanza y Aprendizaje.pdf
Estrategia de Enseñanza y Aprendizaje.pdfEstrategia de Enseñanza y Aprendizaje.pdf
Estrategia de Enseñanza y Aprendizaje.pdfromanmillans
 
c3.hu3.p1.p2.El ser humano y el sentido de su existencia.pptx
c3.hu3.p1.p2.El ser humano y el sentido de su existencia.pptxc3.hu3.p1.p2.El ser humano y el sentido de su existencia.pptx
c3.hu3.p1.p2.El ser humano y el sentido de su existencia.pptxMartín Ramírez
 
Instrucciones para la aplicacion de la PAA-2024b - (Mayo 2024)
Instrucciones para la aplicacion de la PAA-2024b - (Mayo 2024)Instrucciones para la aplicacion de la PAA-2024b - (Mayo 2024)
Instrucciones para la aplicacion de la PAA-2024b - (Mayo 2024)veganet
 
PPT_Formación integral y educación CRESE (1).pdf
PPT_Formación integral y educación CRESE (1).pdfPPT_Formación integral y educación CRESE (1).pdf
PPT_Formación integral y educación CRESE (1).pdfEDILIAGAMBOA
 
Uses of simple past and time expressions
Uses of simple past and time expressionsUses of simple past and time expressions
Uses of simple past and time expressionsConsueloSantana3
 

Último (20)

Mapa Mental de estrategias de articulación de las areas curriculares.pdf
Mapa Mental de estrategias de articulación de las areas curriculares.pdfMapa Mental de estrategias de articulación de las areas curriculares.pdf
Mapa Mental de estrategias de articulación de las areas curriculares.pdf
 
Tema 8.- Gestion de la imagen a traves de la comunicacion de crisis.pdf
Tema 8.- Gestion de la imagen a traves de la comunicacion de crisis.pdfTema 8.- Gestion de la imagen a traves de la comunicacion de crisis.pdf
Tema 8.- Gestion de la imagen a traves de la comunicacion de crisis.pdf
 
Día de la Madre Tierra-1.pdf día mundial
Día de la Madre Tierra-1.pdf día mundialDía de la Madre Tierra-1.pdf día mundial
Día de la Madre Tierra-1.pdf día mundial
 
Sesión La luz brilla en la oscuridad.pdf
Sesión  La luz brilla en la oscuridad.pdfSesión  La luz brilla en la oscuridad.pdf
Sesión La luz brilla en la oscuridad.pdf
 
IV SES LUN 15 TUTO CUIDO MI MENTE CUIDANDO MI CUERPO YESSENIA 933623393 NUEV...
IV SES LUN 15 TUTO CUIDO MI MENTE CUIDANDO MI CUERPO  YESSENIA 933623393 NUEV...IV SES LUN 15 TUTO CUIDO MI MENTE CUIDANDO MI CUERPO  YESSENIA 933623393 NUEV...
IV SES LUN 15 TUTO CUIDO MI MENTE CUIDANDO MI CUERPO YESSENIA 933623393 NUEV...
 
La luz brilla en la oscuridad. Necesitamos luz
La luz brilla en la oscuridad. Necesitamos luzLa luz brilla en la oscuridad. Necesitamos luz
La luz brilla en la oscuridad. Necesitamos luz
 
PROGRAMACION ANUAL DE MATEMATICA 2024.docx
PROGRAMACION ANUAL DE MATEMATICA 2024.docxPROGRAMACION ANUAL DE MATEMATICA 2024.docx
PROGRAMACION ANUAL DE MATEMATICA 2024.docx
 
CIENCIAS NATURALES 4 TO ambientes .docx
CIENCIAS NATURALES 4 TO  ambientes .docxCIENCIAS NATURALES 4 TO  ambientes .docx
CIENCIAS NATURALES 4 TO ambientes .docx
 
PPTX: La luz brilla en la oscuridad.pptx
PPTX: La luz brilla en la oscuridad.pptxPPTX: La luz brilla en la oscuridad.pptx
PPTX: La luz brilla en la oscuridad.pptx
 
PLANIFICACION ANUAL 2024 - INICIAL UNIDOCENTE.docx
PLANIFICACION ANUAL 2024 - INICIAL UNIDOCENTE.docxPLANIFICACION ANUAL 2024 - INICIAL UNIDOCENTE.docx
PLANIFICACION ANUAL 2024 - INICIAL UNIDOCENTE.docx
 
libro para colorear de Peppa pig, ideal para educación inicial
libro para colorear de Peppa pig, ideal para educación iniciallibro para colorear de Peppa pig, ideal para educación inicial
libro para colorear de Peppa pig, ideal para educación inicial
 
Estrategia de Enseñanza y Aprendizaje.pdf
Estrategia de Enseñanza y Aprendizaje.pdfEstrategia de Enseñanza y Aprendizaje.pdf
Estrategia de Enseñanza y Aprendizaje.pdf
 
c3.hu3.p1.p2.El ser humano y el sentido de su existencia.pptx
c3.hu3.p1.p2.El ser humano y el sentido de su existencia.pptxc3.hu3.p1.p2.El ser humano y el sentido de su existencia.pptx
c3.hu3.p1.p2.El ser humano y el sentido de su existencia.pptx
 
TL/CNL – 2.ª FASE .
TL/CNL – 2.ª FASE                       .TL/CNL – 2.ª FASE                       .
TL/CNL – 2.ª FASE .
 
Instrucciones para la aplicacion de la PAA-2024b - (Mayo 2024)
Instrucciones para la aplicacion de la PAA-2024b - (Mayo 2024)Instrucciones para la aplicacion de la PAA-2024b - (Mayo 2024)
Instrucciones para la aplicacion de la PAA-2024b - (Mayo 2024)
 
PPT_Formación integral y educación CRESE (1).pdf
PPT_Formación integral y educación CRESE (1).pdfPPT_Formación integral y educación CRESE (1).pdf
PPT_Formación integral y educación CRESE (1).pdf
 
Aedes aegypti + Intro to Coquies EE.pptx
Aedes aegypti + Intro to Coquies EE.pptxAedes aegypti + Intro to Coquies EE.pptx
Aedes aegypti + Intro to Coquies EE.pptx
 
VISITA À PROTEÇÃO CIVIL _
VISITA À PROTEÇÃO CIVIL                  _VISITA À PROTEÇÃO CIVIL                  _
VISITA À PROTEÇÃO CIVIL _
 
Earth Day Everyday 2024 54th anniversary
Earth Day Everyday 2024 54th anniversaryEarth Day Everyday 2024 54th anniversary
Earth Day Everyday 2024 54th anniversary
 
Uses of simple past and time expressions
Uses of simple past and time expressionsUses of simple past and time expressions
Uses of simple past and time expressions
 

Diapositivas

  • 1. Sabe que es un pagina web Una página web, también conocida como una página de Internet. es decir un documento adaptado para la Web pero normalmente forma parte de un lugar web.Su principal característica son los hipervinculos de una pagina, siendo esto el fundamento de la Web. Una página web está compuesta principalmente por información (sólo texto o módulos multimedia) así como por hiperenlaces; además puede contener o asociar datos de estilo para especificar cómo debe visualizarse, y también aplicaciones embebidas para hacerla interactiva. Las páginas web son escritas en un lenguaje de marcado que provea la capacidad de manejar e insertar hiperenlaces, generalmente HTML. El contenido de la página puede ser predeterminado ("página web estática") o generado al momento de visualizarla o solicitarla a un servidor web ("página web dinámica"). Las páginas dinámicas que se generan al momento de la visualización se hacen a través de lenguajes interpretados, generalmente JavaScript, y la aplicación encargada de visualizar el contenido es la que debe generarlo. La páginas dinámicas que se generan al ser solicitadas son creadas por una aplicación en el servidor web que alberga las mismas. Respecto a la estructura de las páginas web, algunos organismos, en especial el W3C, suelen establecer directivas con la intención de normalizar el diseño, para así facilitar y simplificar la visualización e interpretación del contenido. Una página web es en esencia una tarjeta de presentación digital, ya sea para empresas, organizaciones, personas, etc. Así mismo, la nueva tendencia orienta a que las páginas web no sean solo atractivas para los internautas, sino también optimizadas para buscadores a través del código fuente. Forzar esta doble función puede, sin embargo, crear conflictos respecto de la calidad del contenido.
  • 2. Sabes que programas usar para las paginas web?
  • 3. DIFERENCIAS ENTRE FRONTPAGE Y DREMWAER
  • 4. Que son editores HTML? Los editores de HTML pueden ser de dos tipos, como veremos, unos permiten codificar las páginas utilizando el propio lenguaje HTML, a base de etiquetas y otros nos permiten diseñar una página web, como si estuviésemos escribiendo con un editor de texto avanzado, sin tener que escribir el código con las etiquetas. Esta última vertiente, que podemos llamar editores en modo diseño, presenta una facilidad adicional para las personas que no deseen complicarse la vida con el lenguaje HTML, porque no tengan tiempo de aprenderlo o porque se sientan incapaces de hacerlo. Los editores en modo diseño nos permiten crear la página como si estuviéramos escribiendo un documento con un editor del tipo de Word. El editor de HTML es el encargado de vérselas con el lenguaje y programar internamente la página con el código HTML, según lo que nosotros estamos diseñando. Con el editor HTML en vista diseño podemos colocar imágenes, definir estilos, utilizar negritas o cursivas, etc. sin preocuparnos de las etiquetas correspondientes a cada estilo o elemento. Es el editor el que conoce estas etiquetas y las utiliza convenientemente. Este tipo de editores HTML en modo diseño se denominan, en lenguaje técnico WYSIWYG (WhatYouSeeIsWhatYouGet) porque cuando trabajas con ellos lo que ves que estás creando con el editor es lo que obtienes luego cuando grabas la página.
  • 5. Clases de editores Existen dos tendencias, por tanto, entre los desarrolladores que se dedican a realizar páginas web. Por un lado tenemos a las personas que prefieren crear las páginas programando el HTML y por otro las personas que utilizan editores HTML en modo diseño. Algunas diferencias entre hacerlo de un modo u otro son las siguientes:
  • 6. Editores HTML modo diseño WYSIWYG En el mercado existen multitud de editores de HTML WYSIWYG, es importante elegir un editor bueno porque nuestros trabajos van a depender de sus resultados. Actualmente el rey de los editores y el que os aconsejaríamos sin duda es el Dreamweaver, fabricado por Adobe. Otras posibilidades son editores como Kompozer, una opción gratuita Frontpage, aunque lo desaconsejamos.
  • 7. Algunos editores Usar un editor visual de HTML (WYSIWYG) Algunos editores muy conocidos son Dreamweaver, Go Live o NVU. Son software especializado en la creación de sitios web, construidos para crear y modificar el código HTML, CSS, PHP, etc. de tus páginas web. Tienen funciones muy útiles para un diseñador web, como el editor gráfico, que te permite crear webs con pocos conocimientos de HTML ya que se asemeja a un procesador de textos. Otras funciones muy interesantes de estos programas son el permitir remplazar código de múltiples páginas a la vez, la comprobación de errores de programación en el código, previsualizar las páginas en diferentes navegadores, etc. En esta misma web hay un manual de Dreamweaver para que aprendas a manejarlo. Lo más interesante sin duda para una persona que está aprendiendo a hacer webs es el editor gráfico. Tú creas la página como si del Word se tratara; escribes el texto, los títulos, pones las imágenes, eliges los colores, etc. y el programa te guarda la página con el código HTML listo. Es lo que se llama WhatYouSeeIsWhatYouGet (WYSIWYG), lo que ves es lo que obtienes. Se les llama así con razón, puesto que utilizandolos no es necesario escribir nada de código HTML para crear una página web. La desventaja que tienen estos programas es que si no sabes nada de HTML el diseño de tu página va a estar algo limitado, porque con el editor gráfico se pueden hacer cosas básicas o intermedias, pero para funciones más complicadas es muy recomendable saber un poco de HTML.
  • 8. Editores de texto preparados para escribir código HTML Las personas que después de estas líneas han decidido aprender el lenguaje HTML también tienen herramientas muy interesantes para aumentar su productividad sin dejar de escribir ellos mismos el HTML que desean. Se trata de unos editores de texto, como cualquier otro, que están preparados para escribir HTML y por lo tanto ofrecen multitud de ayudas a los diseñadores: Pueden tener abiertos y editar varios ficheros a la vez Colorean los códigos de las páginas para hacerlos más comprensibles Suelen soportar otros lenguajes de programación con los que podemos llegar a trabajar en el desarrollo de páginas web. Ofrecen ayudas a la programación, que muchas veces son contextuales y se activan a medida que vamos realizando las páginas. Y además muchos de ellos tienen herramientas integradas para hacer cosas tan variadas como la generación de código, asistentes, módulos de conexión por FTP con el servidor, etc. Dependiendo del programa escogido tendremos unas herramientas y ayudas u otras. Simplemente es elegir el que más se adapte a nuestras necesidades. Algunos ejemplos son: Notepad++, gratuito y código libre. Home Site, que estaba bien, aunque Adobe hace años que no lo actualiza. UltraEdit, que es un editor para programadores de los más populares. Arachnophilia, que funciona en todos los sistemas operativos. Si nos decidimos por escribir el código fuente en HTML será muy recomendable utilizar cualquiera de estos programas, para sentirnos más a gusto al programar las páginas y poder hacerlas más rápido. No obstante cabe recordar que cualquier editor de textos serviría para hacer páginas web, incluso el Block de notas, que es el editor más sencillo que existe para texto plano, pero utilizar un programa de estos será imprescindible con el tiempo. En la sección de programas de desarrolloweb tenemos descripciones de algunos editores de HTML, tanto en modo diseño como escribiendo el código.
  • 9. Usar un editor de textos o de HTML Si sabes HTML una buena opción es programar tú mismo todo el código de tu web mediante editores de código fuente como el Block de notas de Windows (no está diseñado para eso pero puede usarse), o algunos un poco más especializados como Notepad. Éste último te colorea el código de diferentes tonos según el tipo de código que tenga la página, lo cual resulta muy útil para buscar fragmentos de un vistazo. Los editores de texto son programas simples pero muy eficaces que permiten guardar documentos de texto sin formato. Al no ofrecer ningún tipo de guía visual, al contrario que los editores HTML o WYSIWYG, son los más complicados de utilizar para los que empiezar a hacer páginas web. Los editores de HTML son básicamente editores de texto diseñados específicamente para hacer páginas web, por tanto traen incorporadas funcionalidades que no tienen los editores de texto genéricos, y que facilitan mucho las cosas. Otros recursos para hacer tus webs
  • 10. Otros recursos para hacer tus webs Usar plantillas prefabricadas (templates) Una plantilla prefabricada (o template) es un diseño ya hecho listo para que lo personalices y adaptes a tu web. En realidad el diseño ya está hecho, osea que no tendrás que “hacer la web” literalmente, pero en tus manos está adaptarlo exáctamente a lo que quieras. Obviamente para adaptarlo a tus necesidades tendrás que utilizar un editor WYSIWYG o HTML, según tus gustos. Algunos ejemplos de plantillas web (templates) disponibles en Internet: Las plantillas web se pueden encontrar en varios formatos, como Photoshop o HTML. En la mayoría de los casos, estos templates son compatibles con los editores web más conocidos, como Dreamweaver o FrontPage, por lo que pueden modificarse tranquilamente. Las plantillas web son una forma de conseguir un diseño atractivo sin necesidad de tener muchos conocimientos de desarrollo de páginas web, o también una forma de inspirarte para crear tu propio diseño (mirando lo que han hecho otros pueden surgirte ideas). Algunos sitios de templates bastante populares son: TemplateMonster, Open Source Web Design o TemplateWorld.