sábado, 26 de enero de 2013

Descargar Juegos para PS2

En este artículo les enseñaré a descargar juegos de forma segura.

Hoy en día existen sitios que ofrecen descarga gratuita pero lamentablemente la mayoría vienen con virus, para ser más exactos, troyanos. Esto se puede evitar si descargamos desde un sitio de confianza porque sabemos que tienen sus propias herramientas de detección de virus al subir y compartir el juego en línea.

Si no saben en dónde descargar, aquí pasaré una lista:

Paso 1.- Ir a la página de descarga de Bittorrent, un protocolo diseñado para el intercambio de archivos peer-to-peer en Internet: http://www.bittorrent.com/intl/es/bittorrent-free. Al terminar la descarga, instale el programa.

Si no saben instalar el programa de Bittorrent, sigue este corto tutorial en video y cuando termines de instalar, siga al siguiente paso: https://www.youtube.com/watch?v=aDNTmkSpxag

Paso 2.- Ahora que tenemos instalado el Bittorrent, pasaremos a descargar juego en alguno de los sitios que recomendé arriba.

Una vez que hayas elegido un juego en algún sitio recomendado, descargue el juego, no necesariamente será  pesado como indica en su descripción del juego, ya que en este paso sólo estaremos descargando un fichero con la que podamos descargar el juego en Bittorrent.

Al finalizar la descarga del juego, abran el archivo descargado en Bittorrent y luego el programa de Bittorrent os indicará la carpeta a donde quieren guardar el juego para luego grabarlo.

Paso 3. Ahora que tenéis descargado el juego en formato .ISO, pasaremos a grabar el juego, si ya sabes cómo grabar, omite este paso y ya habremos finalizado el tutorial. 

En caso contrario sigamos, yo recomiendo grabar con el programa Alcohol 120%, seguro os gustará el nombre del programa xD! Sigan con las instrucciones que viene en el archivo del programa. Si tienen problemas con las instrucciones, ya sabes dónde escribirme xD!

Y aquí les paso el tutorial en video de cómo grabar juegos en formato .ISO: https://www.youtube.com/watch?v=WsJa-RCoG28

Eso es todo!

miércoles, 23 de enero de 2013

Multimedia

Existen tres tipos principales de multimedia en la web: Imágenes, audio y video. HTML5 tiene tres etiquetas para incluir o incrustar estos elementos en una página web:

  • <img>
  • <audio>
  • <video>

Imágenes

La etiqueta de imagen <img> tiene un atributo obligatorio y varios atributos opcionales. La etiqueta de imagen se requiere un atributo de origen de la imagen para estar presente. También es importante saber que las imágenes también proporcionan texto alternativo para que todos los usuarios puedan conocer el contenido de la imagen.
<img src="http://example.com/image.webp" alt="Example image." />

Las imágenes pueden tener atributos adicionales, incluyendo la anchura, altura y un par de atributos relacionados con mapas de imagen (imágenes con áreas interactivas específicas).

Los formatos abiertos imagen incluyen PNG, JPEG, y WebP.

El GIMP es una herramienta de manipulación de foto gratis que puede utilizar para crear y editar imágenes para páginas web e incluso crear diseños web. Inkscape es un ilustrador de gráficos (por ejemplo, SVG) vectorial que se puede utilizar para crear imágenes, páginas web, diseños y otros proyectos de vectoriales.

Audio

La etiqueta <audio> es nueva en HTML5. Da a los diseñadores una forma estándar para incluir audio en una página. La etiqueta <audio> tiene varios parámetros de la más importante de las cuales es fuente:
<audio src="file.ogg">Texto para los navegadores que no admitan la etiqueta de audio.</audio>

Ogg Vorbis es un formato abierto de audio web y es compatible con Mozilla Firefox, Google Chrome y Opera.

Varias herramientas gratis existen con soporte para audio Ogg Vorbis:

Video

La etiqueta <video> también es nuevo en HTML5. Ahora podemos insertar vídeo en una página web sin necesidad de plugins de terceros! El atributo de origen es la clave para la etiqueta de video:
<video src="video.ogv">Texto para navegadores sin soporte para la etiqueta de video.</video>

Otros atributos de la etiqueta de <video> incluyen audio, reproducción automática, controles, altura, lazo, cartel, precarga y ancho.

Ogg Theora y WebM son formatos abiertos de video por Internet, tanto de los cuales trabajan en Mozilla Firefox, Google Chrome, Chromium, Konqueror y Opera. Varias herramientas gratis existen para convertir el vídeo nuevos y existentes a Ogg Theora y / o WebM incluyendo:
Es posible ofrecer formatos alternativos para los navegadores que no soportan Ogg Theora o WebM. Para ello, se anidan varias etiquetas de <source> dentro de una etiqueta <video> como tal:
<video>
  <source src="file.ogv" type="video/ogg" />
  <source src="file.webm" type="video/webm" />
  <source src="file.mp4" type="video/mp4" />
  El texto o las marcas que se mostrará si el vídeo no se reproduce.</video>

También hay varios videos de  comunidades de alojamiento/streaming que soportan formatos abiertos:
Más información:

martes, 22 de enero de 2013

Tablas

Hay momentos en los que queremos mostrar los datos que se ordenan en columnas y filas. Esto se conoce como datos tabulares y HTML tiene una etiqueta <table> y elementos secundarios para la organización de tales datos.Por ejemplo, una tabla de comparación de vegetales pueden ser nombres de vegetales y su color correspondiente o el valor nutritivo. Vamos a construir una tabla simple.

Para empezar, abrimos la etiqueta <table>:

<table>


Inmediatamente después de la etiqueta <table>, podemos incluir una etiqueta <caption> para informar rápidamente al lector el propósito de la tabla.

<caption>Una tabla de colores vegetales.</caption>


Las tablas se componen de filas y columnas. La fila de la tabla de etiqueta <tr> se utiliza para separar las filas de la tabla, mientras que la tabla de datos <td> se ajusta a cada fila.

También tenga en cuenta que la primera fila de esta tabla se reservará para la tabla de encabezados <th>.  Los encabezados dejan que un lector sepa lo que cada columna o fila de una tabla representa.

<tr>

  <th>Nombre de vegetal</th>

  <th>Color</th>
</tr>


La tabla adicional de filas <tr> y tabla de datos <td> seguirá el mismo formato que los encabezados de tabla <th>, es decir, que se escribe en el mismo orden.

<tr>

  <td>Zanahoria</td>

  <td>Naranja</td>
</tr>
<tr>

  <td>Espárragos</td>

  <td>Verde</td>
</tr>


Por último, vamos a cerrar la etiqueta de tabla.

</table>

Recursos externos

Hackbook: Tables

lunes, 21 de enero de 2013

Juega con HTML: 3. Enlace con el mundo

Crear un hipervínculo desde su página a una página de wikipedia



La Web no sería una web sin las conexiones que van de una página a otra: los hipervínculos. Ahora creará su primer hipervínculo. Para hacer esto tienes que decidir dos cosas, en primer lugar:



  1. ¿Qué texto se debe mostrar para el enlace? (Este es el texto que normalmente aparece subrayado y en azul cuando miras una página web)
  2. ¿Qué página web debe ir al enlace?
Para responder a la segunda cuestión necesitas la dirección de la página web. Esta dirección se denomina URL ("Uniform Resource Locator"). Simplemente vaya a la página web que desee y copie la URL en la barra de direcciones de su navegador.

Aquí hay un ejemplo:

  1. Quiero que el texto diga: La Web fue inventada por Tim Berners-Lee
  2. El vínculo debe ir a la página de Wikipedia sobre él, http://en.wikipedia.org/wiki/Tim_Berners_Lee
Para hacer esto, primero escriba en el texto
La Web fue inventada por Tim Berners-Lee
A continuación, añade la etiqueta de <a> al texto del enlace.
La Web fue inventada por <a>Tim Berners-Lee</a>
Y por último, añadir la URL de esta manera:
La Web fue inventada por <a href="http://en.wikipedia.org/wiki/Tim_Berners_Lee">Tim Berners-Lee</a>
Pruébelo en su jsfiddle ahora!

Los Enlaces sólo van en una dirección: desde su página a otra parte. Para crear un enlace desde la página de otro que apunta de nuevo a su página tendrías que editar la otra página ... si tiene permiso/capacidad para hacerlo.


Juega con HTML: 2. Algunas estructuras para tu página

Con sólo dos etiquetas HTML vas a construir gran una página web.

Escribir una página web es muy sencillo: Sólo tiene que escribir el texto que desea ver en su página, por ejemplo:

Esta es mi página
Me gusta
Con este texto, entonces vamos a añadir un poco de "etiquetas" que le indican al navegador web cómo estructurar y visualizar el texto.

<h1>Esta es mi página</h1>
<p>Me gusta</p>
Como se puede ver, las etiquetas van entre los signos de "menor que" y "mayor que" <gusta> <esto>. La mayoría de las etiquetas vienen en pares: <h1> y </ h1> van de la mano, la primera es la etiqueta inicial, la segunda, con la "barra" es la etiqueta final. El texto entre h1 y </ h1> aparecerá como encabezado - bold, big, important.

La etiqueta <p> es para marcar un párrafo - un bloque de texto que debe estar unido.

Pruébelo en su jsfiddle ahora!

Escribir un texto (o copiar un texto de una página de wikipedia) y darle estructura con etiquetas de <h1> y <p>.


Juega con HTML: 1. Abre un Jsfiddle

Sigue adelante y juega con un poco de HTML simple. Un desafío simple ha sido creado para ayudar hacerle más fácil adentro a HTML usando un simple editor de HTML online.

Visite el reto de Juega con HTML y complete los tres pasos

Una vez que haya completado los pasos, serás recompensado con una insignia para demostrar su habilidad!



Abra una nueva ventana de su navegador para trabajar.

Para este desafío vamos a utilizar el sitio http://jsfiddle.net/

Puedes escribir primero el código HTML allí y ver los resultados inmediatamente, sin necesidad de instalar ningún programa u otra preparación.



  1. Abre la http://jsfiddle.net/ en una segunda ventana del navegador en estos momentos.
  2. El área en la cuarta parte superior izquierdo de la pantalla se encuentra el HTML-Input-Window. Escriba "Hello World" en el HTML-Input-Window.
  3. El área en el cuarto inferior derecho de la pantalla es el Result-Window. Al pulsar "play" se pueden ver los resultados de tu código ahí.
  4. Pulse el botón "Save" para guardar el trabajo
  5. Después de guardar, su trabajo tiene su propia dirección donde se puede encontrar de nuevo. Mire la barra de dirección de su navegador - que comenzará con http://jsfiddle.net/ seguido de algunas letras sin sentido. Anótelo o guardarlo como un favorito!
Hay una cosa más pequeña que hay que hacer: encontrar la opción "Normalized CSS" en la barra lateral de la izquierda y desactívelo. Guardar nuevamente.

Esto es lo que su fiddle debe ser similar ahora:


Felicitaciones: ahora tiene un lugar en la web para probar HTML.
Sólo recuerde qué tratar!

domingo, 20 de enero de 2013

Elementos de bloque

Hay varios elementos de bloques primarios utilizados en HTML5. Vamos a ver algunas etiquetas nuevas y antiguas que complementan el dúo de <head> y <body>.

  • <header>
  • <nav>
  • <article>
  • <aside>
  • <footer>
  • <blockquote>

<header>

La etiqueta <header> es un contenedor para materiales de introducción de un documento o de la sección. <header> puede ser utilizado varias veces en un documento y por lo general contiene al menos un  elemento <h1>-<h6> (con el fin de validar).
<header>
  <h1>Cabecera del documento</h1>
  <p>Una breve descripción de este documento</p>
</header>

Para leer más:

<nav>

La etiqueta <nav> es utilizado para demarcar una sección que contiene los anclajes de navegación (enlaces) a otros contenidos o secciones. Los anclajes se pueden anidar dentro de una lista, como una lista desordenada <ul>.
<nav>
  <h1>Navegación</h1>
  <ul>
    <li><a href="#home">Inicio</a></li>
    <li><a href="#contact">Contacto</a></li>
  </ul>
</nav>

Para leer más:

<article>

La etiqueta <article> designa una región de un documento que es auto-contenido. <article> puede ser un artículo, entrada de blog, noticia, etc.
<article>
  <img src="imagen.webp" alt="Una imagen." />
  Este es el contenido del artículo.</article>

Para leer más:

<aside>

La etiqueta <aside> contiene información que está tangencialmente relacionado con el contenido primario. Algunos ejemplos pueden incluir anécdotas, barras laterales, enlaces externos, definiciones de palabras clave, etc.
<article>
  <p>Este es un artículo HTML5</p>
  <aside>
    HTML5 se utiliza a menudo en conjunción con CSS y JavaScript.
  </aside>
</article>

Para leer más:

<footer>

El elemento <footer> se encuentra al final de una sección de contenido, como <html>, y contendrá la información incluyendo detalles de licencias, direcciones e información de contacto y enlaces a todo el sitio, documentos como un community aggreement.
<html>
  <article>Contenido del artículo.</article>
  <footer>
  Creative Commons license.
  </footer>
</html>

Para leer más:

<blockquote>

La etiqueta <blockquote> es usado para indicar una cita o una citación. El atributo de citar es utilizado dentro de una etiqueta <blockquote> para hacer referencia al origen de la cita.
<blockquote cite="Yuichi">en el ultimo elemento te aparece 'bockquote', debe ser blockquote</blockquote>

Para leer más:

  1. Armar un reportaje con cada una de las etiquetas anteriores y con cualquier etiquetas descritas en las tareas anteriores.
  2. Enviar un enlace a su artículo de noticias en el área de discusión a continuación.
  3. Asegúrese de revisar los artículos de los demás noticias y comentarios sobre las técnicas y contenido que se desea :-)

Sugerencia: Utilice el siguiente diagrama como un ejemplo de cómo los elementos de bloque se anidan.

Nota: Se requiere CSS para obtener el diseño en el siguiente diagrama.


sábado, 19 de enero de 2013

Elementos inline

Objetivos

  • Describir 'inline' en el contexto de un documento de hipertexto.
  • Elige un sitio web público y varios elementos de la etiqueta inline.
  • Escoge dos de los elementos HTML inline y describa el uso común para cada elemento.
  • Demostrar el uso apropiado de por lo menos 3 diferentes elementos HTML inline.

Materiales de trabajo

El HTML utiliza los elementos inline para marcar los datos como las citas, códigos informáticos, imágenes y enlaces. Los elementos inline no pueden colocar directamente en el <body> pero deben estar anidados dentro de un elemento de bloque, tales como <p>.

Ya hemos cubierto la etiqueta de anclaje <a>, que es uno de los elementos inline, en la sección anterior. Hay muchos otros elementos inline de uso común. Los elementos inline pueden dividirse en dos tipos generales:
  • Elementos de frase que actúan para marcar una palabra o frase.
  • Los elementos de presentación que afectan a la visualización del elemento.
Aunque hay elementos de presentación de marcado, es aconsejable utilizar CSS para la presentación y se basan en HTML específicamente para el marcado semántico.

Elementos de frase

<em> y <strong>

Los énfasis de intensidad <em> y importancia <strong> se usan para indicar énfasis. El énfasis de intensidad es recomendado como un indicador para el texto que se indica con énfasis lingüístico (como la tasa de expresión o entonación). Use <strong> para el texto con gran importancia, donde un altavoz no puede alterar su voz.
<p>Los frijoles son <em>realmente</em> buenos para ti. Estos son ideales para su <strong>corazón y el alma</strong>.</p>

<cite>

A menudo es necesario citar <cite> la fuente de una declaración o idea. Las fuentes para la etiqueta <cite> suelen ser literario, como un libro, juego, sitio web, prensa, artículo, etc
<p>Ideas geniales son aquellas de las que lo único que nos sorprende es que no se nos hayan ocurrido antes.<cite>Noel Clarasó</cite></p>

<q>

Las citas inline pueden ser marcados con la etiqueta <q>. Estas citas generalmente involucran personas en lugar de las obras literarias.
<p>Marqués de Vauvenargues <q>Para llevar a cabo grandes empresas hay que vivir como si nunca se hubiera de morir.</q></p>

<dfn>

A veces tenemos que ofrecer una definición para un término. La etiqueta <dfn> se utiliza para este propósito.

<address>

Usamos las etiquetas <address> cuando se muestra una dirección física tales como una dirección de correo.
<address>
Simón Bolívar 133<br/>
Lima<br/>
</address>

<del>

La etiqueta <del> se utiliza para mostrar el texto que ya no es relevante en un documento sin quitar realmente el texto. Esto se consigue normalmente a través de una línea "strike through" trazada a través del texto.

<p>Los gatos son grandes animales domésticos. A los gatos les gusta el <del>queso</del>.</p>

Para leer más

Hay varios elementos HTML inline. Los siguientes sitios ofrecen más detalles:

Listas y enlaces

Objetivos

  • Organizar varios elementos en una lista desordenada.
  • Organizar varios elementos en una lista ordenada.
  • Distinguir listas ordenadas y desordenadas.
  • Describir las similitudes entre listas ordenadas y desordenadas.
  • Crear un hipervínculo a una sección dentro de su documento.
  • Enlace el documento al contenido externo.
  • Resumir el propósito de hipervínculos (etiquetas delimitadoras).
  • Crear un diagrama que representa dos documentos con hipervínculos.
  • Compartir tu diagrama con este grupo de estudio.

Materiales de trabajo

Listas

Vamos a echar un vistazo a la manera de detallar las listas, enlaces a otros documentos, y insertar multimedia  en nuestras páginas.

Las listas vienen en dos tipos: Ordenadas y desordenadas. Las listas ordenadas fluye en secuencia mientras que en las listas desordenadas no se requieren el orden. Por ejemplo, una lista de la compra se puede considerar como una lista desordenada, ya que no tienen que ver con el orden en que se encuentran los artículos de la tienda.

La etiqueta <ol> es usado para crear listas ordenadas mientras que la etiqueta <ul> denota listas desordenadas.

Vamos a crear dos listas: Una lista de compras o una lista de instrucciones que describe la forma de salida en el mercado.

Lista desordenada

Primero la lista de la compra. Crear una lista desordenada dispone de tres pasos:
  1. Abra la lista desordenada: <ul>.
  2. Rodear los elementos de la lista con la etiqueta <li>.
  3. Cerrar la lista desordenada: </ul>.
Veamos una lista desordenada en su totalidad:
<ul>
  <li>Camiseta</li>
  <li>Zapatillas</li>
  <li>Balón</li>
</ul>

Lista ordenada

Segundo, haremos una lista de los pasos que finaliza la compra.
  1. Abra la lista ordenada: <ol>.
  2. Inserte los pasos como elementos de lista: <li>.
  3. Cerrar la lista ordenada: </ol>.
<ol>
  <li>Descargue su cesta de la compra</li>
  <li>Salude al cajero</li>
  <li>Sonríe a la linda bebé al lado de usted en línea</li>
  <li>Pague al cajero</li>
  <li>Reúna sus provisiones y salir.</li>
</ol>

Hipervínculos

Los hipervínculos son las interconexiones entre las páginas y recursos en el World Wide Web. La creación de hipervínculos se requiere otro aspecto de las etiquetas HTML llamados atributos. Los atributos son elementos de texto descriptivos dentro de las cajas de etiquetas HTML (el < y >). Los atributos están asociados con los valores. Por ejemplo:
<tag attribute="value">

La etiqueta de anclaje <a> es así como crear vínculos tanto dentro de un documento y de los recursos externos. Una etiqueta de anclaje tiene un atributo llamado 'href' que significa referencia de hipertexto.  La referencia de hipertexto es el elemento interno o externo a la que apunta el enlace. Por ejemplo:
<a href="http://p2p4-html5yuichi.blogspot.com/">Introducción de HTML5</a>

Este enlace apunta a http://p2p4-html5yuichi.blogspot.com/ con el texto de ayuda de enlace "Introducción de HTML5".


martes, 15 de enero de 2013

Basic Markup

Objetivos

  • Describir la estructura general de un documento. Es decir, cuáles son algunos de los elementos comunes que se encuentran en un artículo de revista, página de un periódico u otro material impreso común.
  • Identificar claves estructurales, o semántico, elementos de varios documentos comunes.
  • Etiquetar una página impresa o artículo con elementos relacionados con HTML.
  • Memorice el tipo de documento Doctype HTML5.
  • Memorice el tipo de caracteres UTF-8 meta tag.
  • Crear un esquema de página con etiquetas HTML.
  • Distinguir marcado contenido de la presentación.

Materiales de trabajo

Las etiquetas HTML se utilizan para marcar elementos estructurales de una página. Los elementos estructurales incluyen párrafos, encabezamientos, artículos, imágenes, y otros aspectos de documentos de hipertexto.

Etiquetas HTML están rodeados por carácteres de menor que (<) y mayor que (>).  Es típicamente una etiqueta de apertura y cierre que rodea el contenido de la página correspondiente. Por ejemplo, para referirse a un documento HTML que rodean toda la página con la apertura y cierre de etiquetas HTML:
<html>
... Page content ...</html>

La única diferencia entre muchas etiquetas de apertura y cierrees es que las etiquetas de cierre tienen una barra inclinada (/) que precede al texto de etiqueta. Como acotación al margen, algunas etiquetas son de cierre automático. Las etiquetas de cierre automático tienen este aspecto:
<br />

Vamos a echar un vistazo a varios elementos básicos del HTML. Vamos a empezar por la creación de un resumen simple u otro documento de su elección. Los elementos se inician con:

  • <! DOCTYPE html>
  • <head>
  • <meta>
  • <body>
  • <h1>, <h2>, etc
  • <p>
Con este conjunto limitado de elementos, podemos empezar a construir nuestro propio resumen en HTML.

Para comenzar, cree un nuevo archivo de texto vacío en el equipo local o en HTML Pad.

Una vez que tenga un documento en blanco, añada un DOCTYPE al principio del documento. Doctype es la abreviatura de "Declaración de tipo de documento" y se asocia un documento en particular con una marca definida formalmente por definición. El tipo de documento es HTML. Cuando un navegador, como Mozilla Firefox, analiza un documento, la declaración de tipo de documento describe las posibles etiquetas que el navegador pueda encontrar. El tipo de documento HTML5 es el siguiente:
<!DOCTYPE html>

Después de que el tipo de documento ha sido declarada, podemos seguir adelante y abrir nuestra etiqueta <html>, que contendrá los sub-elementos del documento:
<html>

Asegúrese de no cerrar la etiqueta <html>, sin embargo, vamos a colocar la etiqueta </ html> al final del documento.

Ahora vamos a colocar la cabecera del documento con una etiqueta <head>. La etiqueta <head> es un contenedor para elementos como el título de la página, CSS para el diseño y JavaScript para elementos dinámicos. Este curso no cubre esos temas, pero hay grupos de estudio que forman en la School of Webcraft.
<head>

Podemos insertar el título de la página <title> dentro de la <head> de este modo:

Nuestro documento contendrá caracteres codificados, en nuestro idioma nativo, que los navegadores web tendrán que mostrar. Es importante para nosotros para decirle al navegador qué codificación de caracteres a utilizar. El Unicode (UTF-8) estándar contiene más de un millón de caracteres de idiomas en todo el mundo. Fijamos nuestra codificación de caracteres como UTF-8 mediante la etiqueta <meta>.
<meta charset="UTF-8" />

A continuación cerrar la etiqueta head:

</head>



En un documento HTML, el <body> normalmente se encuentra por debajo de la <head>. El body es un contenedor para la mayor parte de su contenido. Permite abrir el contenedor del cuerpo de la página.



En el body suele tener secciones de página y párrafos de contenido. Las secciones están generalmente separados por cabeceras. Vamos a crear un par de secciones de cabecera:

<h1>Header 1</h1>
<h2>Header 2 (sub-sección)</h2>


Las cabeceras son jerárquicas y  de niveles más altos de números de cabecera que son generalmente sub-secciones de las cabeceras más bajas numeradas. En este ejemplo, la <h2> es una subsección del elemento <h1>.

La etiqueta <hgroup> se utiliza para cuando se utilizan etiquetas <H> consecutivamente uno después de otro.

El último paso de este viaje corto a través de las etiquetas HTML es el uso frecuente de la etiqueta de párrafo <p>. Las etiquetas de párrafo se utiliza para designar los párrafos de un documento. Por ejemplo:
<p>The quick brown fox jumped over the lazy dog.</p>

Al final del documento, asegúrese de cerrar la <body> y la <html> con:
</body>
</html>

Como se puede ver, los elementos HTML están diseñados para ser fácilmente comprendido por los seres humanos, así como la analizan por las computadoras.

Tareas

Por favor enviar en línea un documento de trabajo de HTML. Puede hacerlo mediante la publicación en HTML pad, pastebin, o cualquier otro código en línea web pasting/hosting. Si usted tiene sus propias web hosting no dude en enviar sus archivos HTML allí, o en cualquier otro lugar razonable que usted sepa.


Introducción


Objetivos


  • Identificar las características deseables en un editor HTML.
  • Comparar dos o más editores de HTML.
  • Reportar su comparación con los demás participantes de esta clase
  • Seleccionar un editor HTML para su uso personal
  • Resumir el motivo(s) que te llevó a elegir su editor específico.
  • Use su editor para producir una página HTML simple

Materiales de Trabajo


Para este curso es necesario una herramienta de edición HTML. Hay muchos para elegir. No necesitamos muchas características avanzadas para este curso básico así que escoja un simple editor de texto con resaltado de sintaxis.

Editores de HTML online


Hay varios editores de HTML que puedes usar en tu navegador web:
  • Mozilla Thimble - Recomendado para utilizar en este curso. Recomendado para utilizar en este curso. Proporciona retroalimentación visual directa, resaltado de sintaxis, y la edición sencilla.
  • Aloha (Editor HTML5 en línea)
  • HTML Pad (Mozilla online HTML editor)
  • JS Fiddle (JavaScript, CSS, y Editor HTML online)
  • Maqetta (Herramienta de diseño de interfaz HTML5)

Editores de texto gratis


Los editores de texto siguientes tienen el resaltado de sintaxis y son herramientas gratuitas:

  • Bluefish (GNU/Linux, Mac OSX, Microsoft Windows)
  • BlueGriffon (GNU/Linux, Mac OSX, Microsoft Windows)
  • Geany (GNU/Linux, Microsoft Windows)
  • gEdit (GNU/Linux, Mac OSX, Microsoft Windows)
  • jEdit (GNU/Linux, Mac OSX,Microsoft Windows)
  • Notepad++ (Microsoft Windows)

Entorno de desarrollo integrado (IDEs)