martes, 15 de octubre de 2013

PES 14 Vs. FIFA 14

FIFA 14: El cambio,los jugadores se mueven lentísimos y los cracks no son capaces de hacer una filigrana en condiciones.No estoy pidiendo que sea un "correcalles",pero la fluidez que tenia se ha perdido y eso afecta muy negativamente a la jugabilidad. La cámara se ha alejado mas,por mucho zoom que le metamos los jugadores se ven mas pequeños,¿por que?ellos sabrán,pero debería ser un opción,no una imposición. El sistema de red de ojeadores me parece muy pesado,deberían haberlo simplificado un poco,aunque me parece bueno que no den valor medio ni precio para hacerlo mas real. En su favor diré que el rimo de juego es bueno y te obliga a jugar mas al toque y buscar la jugada mas elaborada para marcar,pero el tema de la pésima fluidez le quita puntos,llegando a desesperar muchas veces. No tenían que haber hecho un cambio tan brusco,con unos retoques en el ritmo,en el sistema de colisiones,mas animaciones,sumado a un par de cosas mas hubieran bastado.Es como empezar de cero en algo que solo tenían que pulir.Este año no han dado con la tecla,cosa que si hicieron todos estos años.Para mi,el peor fifa desde hace un par de años,no porque sea un mal juego,sino porque han deshecho cosas que ya funcionaban.

PES 14: A Menudo, fanboys los fans de pes que no miran la realidad que su juego es un fracaso yo soy fan de pes pero me cansa que pelotuodos defensores se pongan jalando que pes gana siempre fifa Cada año es lo mismo que licencias que los estadios que los gráficos no acaban convenciendo,las criticas no lo apoyan,las ventas no superan a fifa,falta de publicidad y ligas de algunos países el motor gráfico se esperaba mas aunque es mejor que los de fifa pero los rostros son coreanos de la mayoria. Sobre valoran mucho el PES y acaba siempre en la misma historia, tampoco no es una obra maestra de los juegos de futbol.



Otros programas para crear páginas web

Los programas mas recomendados son:

  • Dreamweaver
  • Web Fácil PRO
  • Publisher
  • Frontpage
  • WebSite X5 v8
  • NVU
  • Visual Estudio
  • Expression Web/Studio
  • Visual Web Developer Express
  • Flash
  • Fireworks
  • Photoshop
  • Obten tu web
  • Kompozer
  • Seamonkey
  • WYSIWYG
  • Pain Shop Pro
  • Wordpress
  • Joomla
  • Drupal

lunes, 14 de octubre de 2013

Etiquetas para insertar imagenes y tablas en HTML

Una tabla bàsica.

Las tablas se usan con profusión en las páginas Web, muchas veces debido a que son el único instrumento con el que se cuenta, para asegurarse que las cosas estarán en su sitio. Para definir una tabla se usan las etiquetas:

<TABLE> y </TABLE> son las etiquetas donde está contenida la tabla

<TR> y </TR> son las etiquetas que indican el comienzo y fin de una fila (<th> y </th> si es una fila de cabecera)

<TD> y </TD> señalan una celda.

La tabla se va definiendo declarando una fila y a continuación las celdas que contiene esa fila, luego otra fila y sus celadas, etc. No es necesario que todas las filas contengan el mismo número de celdas.

La tabla (2x2) más sencilla que podemos hacer es la siguiente
Escribimos:Visualizamos
<TABLE >
     <TR>
          <TD>1 </TD> <TD> 2 </TD>
     </TR> <TR>
          <TD>3 </TD> <TD> 4</TD>
</TR>
</TABLE>
12
34
 
El resultado no es muy brillante, pero vamos a ir viendo las distintas posibilidades que tenemos para mejorarlo.
 Atributos de la etiqueta TABLE

Todos los atributos son opcionales

BORDER="4". Indica el tamaño del borde en píxels, en este caso 4. Si no se indica nada carece de borde

WIDTH="5" o WIDTH="50%". Es el ancho de la tabla, puede especificarse en valor absoluto (5 píxels) o como un porcentaje (50% del ancho disponible)

CELLSPACING="2". Es el espacio entre las celdas, por defecto es 2

CELLPADDING="5". Es el espacio entre el contenido de las celdas y el borde de las mismas, por defecto es 1

ALIGN=" left", "right", "center". Alinea la tabla a la izquierda , derecha o en el centro.
Otro ejemplo
Escribimos:Visualizamos
<TABLE BORDER="3" CELLSPACING="5" WIDTH="150">
     <TR>
          <TD>1 </TD> <TD> 2 </TD>
     </TR> <TR>
          <TD>3 </TD> <TD> 4</TD>
</TR>
</TABLE>
12
34

Atributos de las etiquetas de fila y celda

Las etiquetas que soportan las filas y las celdas son
WIDTH="30". Ancho de toda la fila o celda. También se puede dar en %
ALIGN=" left", "right", "center". Alinea el contenido a la izquierda, derecha o centro
VALIGN="top" , "middle" o "bottom". Alinea el contenido verticalmente arriba, en medio o abajo 
BGCOLOR="#AACCEE". Pone un fondo del color especificado a la celda o fila
COLSPAN=3. Especifica el número de columnas que abarca la fila 
ROWSPAN=2. Especifica el número de filas que abarca la columna
Tercer ejemplo. Fijate en la etiqueta TH, que sustituye a TR, resalta su contenido con negrita, por eso se usa para los títulos
Escribimos:Visualizamos
<TABLE BORDER="3" CELLSPACING="5" WIDTH="200">
<TH COLSPAN=2 BGCOLOR="#6D8FFF> Este es el título</TH>
<TR align="center">
<TD>Esta es la celda de la 1ª fila y de la 1ª columna</TD>
<TD> Esta es de la 1ª fila y de la 2ª columna</TD>
</TR>
<TR BGCOLOR="#6D8FFF>
<TD>Esto está con un fondo azul</TD>
<TD align="right" valign="bottom">Y esto también</TD>
</TR>
</TABLE>
Este es el título
Esta es la celda de la 1ª fila y de la 1ª columnaEsta es de la 1ª fila y de la 2ª columna
Esto está con un fondo azulY esto también
Como ves, se pueden ir modificando los comandos básicos para obtener la tabla que deseemos.

Una imàgen bàsica

Sin duda uno de los aspectos más vistosos y atractivos de las páginas web es el grafismo. La introducción en nuestro texto de imágenes puede ayudarnos a explicar más fácilmente nuestra información y darle un aire mucho más estético. El abuso no obstante puede conducirnos a una sobrecarga que se traduce en una distracción para el navegante, quien tendrá más dificultad en encontrar la información necesaria.
El uso de imágenes también tiene que ser realizado con cuidado porque aumentan el tiempo de carga de la página, lo que puede ser de un efecto nefasto si nuestro visitante no tiene una buena conexión o si es un poco impaciente. Por ello es recomendable siempre optimizar las imágenes para Internet, haciendo que su tamaño en bytes sea lo mínimo posible, para facilitar la descarga, pero sin que ello comprometa mucho su calidad.
En este capitulo no explicaremos como crear ni tratar las imágenes, únicamente diremos que para ello se utilizan aplicaciones como Paint Shop Pro, Photoshop o Gimp. Tampoco explicaremos las particularidades de cada tipo de archivo: GIF, JPG o PNG y la forma de optimizar nuestras imágenes. Un capitulo posterior al respecto será dedicado a este menester: Formatos gráficos para páginas web.
Las imágenes son almacenadas en forma de archivos, principalmente GIF (para dibujos) o JPG (para fotos). Estos archivos los podemos obtener desde diversas vías, como por ejemplo nuestra cámara digital, aunque también pueden ser creados por nosotros mismos con algún editor gráfico o pueden ser descargados gratuitamente en sitios web especializados.
Así pues, en estos primeros capítulos nos limitaremos a explicar como insertar y alinear debidamente en nuestra página una imagen ya creada.
La etiqueta que utilizaremos para insertar una imagen es <img> (image). Esta etiqueta no posee su cierre correspondiente y en ella hemos de especificar obligatoriamente el paradero de nuestro archivo gráfico mediante el atributo src (source).
La sintaxis queda entonces de la siguiente forma:
<img src="camino hacia el archivo">
Para expresar el camino, lo haremos de la misma forma que vimos para los enlaces. Las reglas siguen siendo las mismas, lo único que cambia es que, en lugar de una página destino, el destino es un archivo gráfico.
Aparte de este atributo, indispensable obviamente para la visualización de la imagen, la etiqueta <img> nos propone otra serie de atributos de mayor o menor utilidad, que listamos a continuación:
Atributo alt
Atributos height y width
Atributo border
Atributos vspace y hspace
Atributo lowsrc


Truco: Utilizar imagenes como enlaces
Ejemplo práctico

  • Una de las veces que salga debe mostrarse con su tamaño originar y con un borde de 3 pixeles.
  • En otra ocasión la imagen aparecerá sin borde, con su misma altura y con una anchura superior a la original
  • También mostraremos la imagen sin borde, con su misma anchura y con una altura superior a la original
  • Por último, mostraremos la imagen con una altura y anchura mayores que las originales, pero proporcionalmente igual que antes.
Vamos a utilizar esta imagen para hacer el ejercicio:
Las dimensiones originales de la imagen son 28x21, así que este sería el código fuente:
<br> 
<br> 
<img src="img1.gif" width="68" height="21" alt="Achatada" border="0"> 
<br> 
<br> 
<img src="img1.gif" width="28" height="51" alt="Alargada" border="0"> 
<br> 
<br> 
<img src="img1.gif" width="56" height="42" alt="Doble grande" border="0">

Dentro de las comillas de este atributo colocaremos una brevísima descripción de la imagen. Esta etiqueta no es indispensable pero presenta varias utilidades.
Primeramente, durante el proceso de carga de la página, cuando la imagen no ha sido todavía cargada, el navegador mostrara esta descripción, con lo que el navegante se puede hacer una idea de lo que va en ese lugar.
Esto no es tan trivial si tenemos en cuenta que algunos usuarios navegan por la red con una opción del navegador que desactiva el muestreo de imágenes, con lo que tales personas podrán siempre saber de qué se trata el gráfico y eventualmente cambiar a modo con imágenes para visualizarla.
Además, determinadas aplicaciones para discapacitados o teléfonos vocales que no muestran imágenes ofrecen la posibilidad de leerlas por lo que nunca esta de más pensar en estos colectivos.
En general podemos considerar como aconsejable el uso de este atributo salvo para imágenes de poca importancia y absolutamente indispensable si la imagen en cuestión sirve de enlace.
Definen la altura y anchura respectivamente de la imagen en píxeles.
Todos los archivos gráficos poseen unas dimensiones de ancho y alto. Estas dimensiones pueden obtenerse a partir del propio diseñador grafico o bien haciendo clic con el botón derecho sobre la imagen vista por el navegador para luego elegir propiedades sobre el menú que se despliega.
El hecho de explicitar en nuestro código las dimensiones de nuestras imágenes ayuda al navegador a confeccionar la página de la forma que nosotros deseamos antes incluso de que las imágenes hayan sido descargadas.
Así, si las dimensiones de las imágenes han sido proporcionadas, durante el proceso de carga, el navegador reservara el espacio correspondiente a cada imagen creando una maquetación correcta. El usuario podrá comenzar a leer tranquilamente el texto sin que este se mueva de un lado a otro cada vez que una imagen se cargue.
Además de esta utilidad, el alterar los valores de estos dos atributos, es una forma inmediata de redimensionar nuestra imagen. Este tipo de utilidad no es aconsejable dado que, si lo que pretendemos es aumentar el tamaño, la perdida de calidad de la imagen será muy sensible. Inversamente, si deseamos disminuir su tamaño, estaremos usando un archivo más grande de lo necesario para la imagen que estamos mostrando con lo que aumentamos el tiempo de descarga de nuestro documento innecesariamente.
Es importante hacer hincapié en este punto ya que muchos debutantes tienen esa mala costumbre de crear gráficos pequeños redimensionando la imagen por medio de estos atributos a partir de archivos de tamaño descomunal. Hay que pensar que el tamaño de una imagen con unas dimensiones de la mitad no se reduce a la mitad, sino que resulta ser aproximadamente 4 veces inferior.
Definen el tamaño en píxeles del cuadro que rodea la imagen.
De esta forma podemos recuadrar nuestra imagen si lo deseamos. Es particularmente útil cuando deseamos eliminar el borde que aparece cuando la imagen sirve de enlace. En dicho caso tendremos que especificar border="0".
Sirven para indicar el espacio libre, en pixeles, que tiene que colocarse entre la imagen y los otros elementos que la rodean, como texto, otras imágenes, etc.
Con este atributo podemos indicar un archivo de la imagen de baja resolución. Cuando el navegador detecta que la imagen tiene este atributo primero descarga y muestra la imagen de baja resolución (que ocupa muy poco y que se transfiere muy rápido). Posteriormente descarga y muestra la imagen de resolución adecuada (señalada con el atributo src, que se supone que ocupará más y será más lenta de transferir).
Este atributo está en desuso, aunque supone una ventaja considerable para que la descarga inicial de la web se realice más rápido y que un visitante pueda ver una muestra de la imagen mientras se descarga la imagen real.
Ni que decir tiene que una imagen, lo mismo que un texto, puede servir de enlace. Vista la estructura de los enlaces podemos muy fácilmente adivinar el tipo de código necesario:
<a href="archivo.html"><img src="imagen.gif"></a>
Resultará obvio para los lectores hacer ahora una página que contenga una imagen varias veces repetida pero con distintos atributos.

<img src="img1.gif" width="28" height="21" alt="Tamaño original" border="3"> 
<br> 
<br> <img src="img1.gif" width="68" height="21" alt="Achatada" border="0"> <br> <br> <img src="img1.gif" width="28" height="51" alt="Alargada" border="0"> <br> <br> <img src="img1.gif" width="56" height="42" alt="Doble grande" border="0">


Insertar una imagen en una tabla

Para insertar una imagen, simplemente usas la misma etiqueta que en cualquier otra parte
<table>
- <tr>
- - <td><img alt="Imagen" src="imagenes/imagen.png" /></td>
- </tr>
</table>

Si te refieres a una imagen de fondo, hazlo por CSS.
<html>
<head>
<style>
table { background: url(tabla.png) } /* toda la tabla */
caption { background: url(titulo.png) } /* título de la tabla */
thead { background: url(encabezado.png) } /* encabezado de la tabla */
tr { background: url(fila.png) } /* una fila entera */
th { background: url(celda_encabezado.png) } /* las celdas de encabezado */
tbody { background: url(cuerpo.png) } /* cuerpo de la tabla */
td { background: url(celda.png) } /* celda de contenido */
tfoot { background: url(pie.png) } /* pie de la tabla */
</style>
</head>

<body>
- <table>
- <caption>Mi tabla</caption>
- <thead>
- - <tr>
- - - <th>Encabezado 1</th>
- - - <th>Encabezado 2</th>
- - </tr>
- </thead>
- <tbody>
- - <tr>
- - - <td>Celda 1</td>
- - - <td>Celda 2</td>
- - </tr>
- </tbody>
- <tfoot>
- - - <td>Pie 1</td>
- - - <td>Pie 2</td>
- </tfoot>
- </table>
</body>

</html>





Diferencia entre etiquetas y atributos en HTML


  • 1. Etiquetas y atributos.
  • 2. Estructura básica de un HTML<!DOCTYPE html><html lang="es"> <head> </head> <body> </body></html>
  • 3. Recordando las reglas de HTML• Toda etiqueta debe cerrarse.• Mantener una indentación correcta.• Los caracteres especiales se colocan con código.• NO SE DEFINEN ESTILOS EN HTML
  • 4. Recordando términos 1 2 3<p>Esto es un <strong>elemento</strong> com&uacute;n</p> 4 <img src="guitarra.png" alt="Imagen de guitarra" />
  • 5. <html><head> <body> <form> <div> <p> <ul> <strong> <em> <a> <li>
  • 6. Imágenes en HTML Formatos utilizadosJPG Imágenes grandes, fotografías, fondos Iconografía, imágenes con movimiento,GIF imágenes con transparenciaPNG Iconografía, imágenes con transparencia
  • 7. Comparación PNG y GIF en transparencia PNG GIF
  • 8. Comparación de peso PNG y JPGPNG - 64 Bit JPG – 50%Imagen 1024 x 768 Imagen 1024 x 768950 Kb 77 Kb
  • 9. Permite Límite de Permite Adecuado Uso transpa- color anima-ción para web rencia Iconografía y gráficos GIF con pocos colores 256 Fotografías e imágenes conJPG muchos colores y 16 millones detalle. Iconografía yPNG-8 gráficos con pocos 256 colores. Fotografías ePNG-2 imágenes con 16 millones 4 muchos colores y detalle.
  • 10. Imágenes en HTML<img src="guitarra.png" alt="Imagen de guitarra" />
  • 11. Imágenes EstilosCarpeta raíz Scripts
  • 12. Imágenes en HTML<img src="images/guitarra.png" alt="Imagen de guitarra" />
  • 13. Páginas Imágenes EstilosCarpeta raíz Scripts
  • 14. Imágenes en HTML<img src="../images/guitarra.png" alt="Imagen de guitarra" />
  • 15. Ligas en HTMLExternas <a href="http://www.google.com">Google<a/>Internas - otro archivo <a href="pagina.html">Mi p&aacute;gina<a/>Internas - mismo archivo <a href="#seccion">Mi secci&oacute;n<a/>
  • 16. Ligas en HTML Internas - mismo archivo<a href="#seccion">Mi secci&oacute;n<a/>....(Mucho contenido, mucho scroll)...<p id="seccion">Texto de secci&oacute;n</p>
  • 17. El atributo id• Identifica a una etiqueta como única • No puede repetirse en una página • No todas las etiquetas necesitan tener id• Se hace referencia a un elemento con su id precedido por un signo de #

miércoles, 9 de octubre de 2013

¿Qué es HTML?


Las siglas de HTML significan Hyper Text Markup Language, hace referencia al lenguaje de marcado para la elaboración de páginas web. 
Los códigos básicos en HTML son:
  • <html>: define el inicio del documento HTML, le indica al navegador que lo que viene a continuación debe ser interpretado como código HTML. Esto es así de facto, ya que en teoría lo que define el tipo de documento es el DOCTYPE, que significa la palabra justo tras DOCTYPE el tag de raíz.
  • <script>: incrusta un script en una web, o llama a uno mediante src="url del script". Se recomienda incluir el tipo MIMEen el atributo type, en el caso de JavaScript text/javascript.
  • <head>: define la cabecera del documento HTML; esta cabecera suele contener información sobre el documento que no se muestra directamente al usuario como, por ejemplo, el título de la ventana del navegador. Dentro de la cabecera <head> es posible encontrar:
  • <title>: define el título de la página. Por lo general, el título aparece en la barra de título encima de la ventana.
  • <link>: para vincular el sitio a hojas de estilo o iconos. Por ejemplo:<link rel="stylesheet" href="/style.css" type="text/css">.
  • <style>: para colocar el estilo interno de la página; ya sea usando CSS u otros lenguajes similares. No es necesario colocarlo si se va a vincular a un archivo externo usando la etiqueta <link>.
  • <meta>: para metadatos como la autoría o la licencia, incluso para indicar parámetros http (mediante http-equiv="") cuando no se pueden modificar por no estar disponible la configuración o por dificultades con server-side scripting.
  • <body>: define el contenido principal o cuerpo del documento. Esta es la parte del documento html que se muestra en el navegador; dentro de esta etiqueta pueden definirse propiedades comunes a toda la página, como color de fondo y márgenes. Dentro del cuerpo <body> es posible encontrar numerosas etiquetas. A continuación se indican algunas a modo de ejemplo:
    • <h1> a <h6>: encabezados o títulos del documento con diferente relevancia.
    • <table>: define una tabla.
      • <tr>: fila de una tabla.
      • <td>: celda de una tabla (debe estar dentro de una fila).
    • <a>: hipervínculo o enlace, dentro o fuera del sitio web. Debe definirse el parámetro de pasada por medio del atributo href. Porejemplo: <a href="http://www.example.com" 
    • title="Ejemplo" target="_blank" tabindex="1">
    • <div>: división de la página. Se recomienda, junto con css, en vez de <table> cuando se desea alinear contenido.
    • <img>: imagen. Requiere del atributo src, que indica la ruta en la que se encuentra la imagen. Por ejemplo: <img src="./imágenes/mifoto.jpg" />. Es conveniente, por accesibilidad, poner un atributo alt="texto alternativo".
    • <li><ol><ul>: etiquetas para listas.
    • <b>: texto en negrita (etiqueta desaprobada. Se recomienda usar la etiqueta <strong>).
    • <i>: texto en cursiva (etiqueta desaprobada. Se recomienda usar la etiqueta <em>).
    • <s>: texto tachado (etiqueta desaprobada. Se recomienda usar la etiqueta <del>).
    • <u>: Antes texto subrayado. A partir de HTML 5 define porciones de texto diferenciadas o destacadas del resto, para indicar correcciones por ejemplo. (etiqueta desaprobada en HTML 4.01 y redefinida en HTML 5)
  • La mayoría de etiquetas deben cerrarse como se abren, pero con una barra («/») tal como se muestra en los siguientes ejemplos:
    • <table><tr><td>Contenido de una celda</td></tr></table>.
    • <script>Código de un script integrado en la página</script>.

martes, 8 de octubre de 2013

Seguridad en internet

Las amenazas contra la seguridad basadas en la red han generado robos de identidad y fraudes financieros generalizados. El correo no deseado, los virus y el spyware causan grandes problemas a empresas y consumidores. Una infracción de seguridad puede causar un daño irreparable a la reputación o la marca de una empresa. En Estados Unidos, los problemas con la seguridad en Internet amenazan con retrasar la adopción a nivel nacional de un sistema de expedientes médicos electrónicos. En la Unión Europea, la desconfianza de los consumidores con respecto a la seguridad en Internet y la protección de datos constituyen una barrera para la expansión más rápida del comercio electrónico entre los estados miembros.
Hoy en día, los ataques contra la información son un negocio rentable y a menudo están controlados por el crimen organizado. Un creciente número de sofisticados modelos comerciales de delincuencia informática, incluido el surgimiento de empresas delictivas, se basa en la venta de herramientas y servicios para realizar ataques en la red, más que en la simple venta de la información obtenida mediante dichos ataques.
La tecnología de seguridad en Internet sigue progresando, y está evolucionando de un enfoque pasivo y puntual basado en productos, a enfoques activos de punta a punta basados en el reconocimiento, la contención y la cuarentena. Además, los proveedores de servicios de Internet (ISP) están compitiendo en seguridad y los ISP dirigidos a los consumidores ofrecen seguridad de Internet como parte de sus servicios.
Los legisladores del mundo entero están preocupados por el estado de la infraestructura informática. Desean asegurarse de que los usuarios de redes usen la tecnología más avanzada y los mejores procesos para que sus redes sean lo más seguras posibles. Los gobiernos y las empresas actualizan continuamente sus estrategias para prevenir ataques, y se han establecido asociaciones entre organismos públicos y privados para desarrollar estrategias de seguridad voluntarias basadas en el mercado.
  • Fomentar la conciencia entre consumidores y la industria sobre la importancia de la seguridad en la red
  • Educar a los usuarios acerca de las mejores prácticas
  • Usar las mejores prácticas para proteger sus propios sistemas
  • Financiar el desarrollo e investigación a largo plazo
  • Aplicar todo el peso de la ley a los delitos informáticos y perseguir a los delincuentes que utilizan o intentan usar la red para cometer robos, fraudes, extorsiones u otros tipos de delitos
  • Aumentar la cooperación a nivel internacional con otros gobiernos, organismos de seguridad y el sector privado para difundir las mejores prácticas y perseguir internacionalmente los delitos informáticos
Cisco no cree que los gobiernos deberían regular la seguridad. En general, la regulación:
  • Limita la innovación al preferir tecnologías específicas, en lugar de dejar que la competencia del mercado fomente el desarrollo de las mejores y más avanzadas soluciones
  • No avanza lo suficientemente rápido para mantenerse a la par con las necesidades de la industria y el surgimiento de nuevas amenazas
  • Incluso puede disminuir la seguridad en Internet al crear puntos específicos de fallas sistémicas

lunes, 7 de octubre de 2013

¿Quienes somos?

El nombre "AEA" viene de las iniciales de los creadores de este blog, "A" de Axel, "E" de Emiliano y "A" de Adàn.
Somos tres estudiantes del Centro Educativo "Juan Jacobo Rousseau", somos de Salina Cruz, Oax.
Nos empeñamos a este blog para dar a conocer nuestros avances en nuestro ciclo escolar.
Nos gustan los deportes, y como todo joven, los videojuegos.
Esperamos que disfruten este blog, cualquier duda, publiquen.