Html y css social

Barra social from Abdel Suarez

Entrega Final( grupo lunes 7am)

Fecha. 30 De Noviembre de 2015 Hora y lugar: salón 202 9am Tema: Sitio web tema libre Presentación: Cd con label En el cd deben estar todos los archivos del sitio para su lectura. Archivos .html y .css (opción 2 Adobe Muse) Criterios: Navegación adecuada Información clara.

¿Que es Javascript?

javascript

recursos para el ejercicio

Muchas veces los desarrolladores pueden quedarse en un punto de confort donde sienten que ya saben todo lo que necesitan para hacer cierto trabajo, sin embargo este es un punto muy peligroso ya que puede hacer que te quedes atrás con respecto a la tecnología, esto no es ajeno a los desarrolladores web por lo que deben estar atentos a estos errores que suelen cometer.

Escribir código HTML viejo

Antes el código HTML era muy limitado, pero ahora no es así, se que dejar los antiguos hábitos es difícil pero es mejor comenzar ahora. Si usas tablas para hacer layouts, span y div en vez de elementos semánticos más apropiados como header o footer o peor aun elementos deprecados como center o font entonces estas haciendo las cosas mal.

Deja de usar tablas para los layouts, usa css para hacer que el contenido se vea de forma correcta y utiliza elementos que describan el propósito del contenido, de esta forma tu HTML será más legible y correcto.

Crear código que "debería" funcionar

Es muy importante que no se coloque código que "debería" funcionar, en ves de eso debe probarse muy bien en código y asegurarse de que funciones, de otra manera los errores terminarán apareciendo al usuario final de una manera muy fea, errar es de humanos, sin embargo en la programación hay maneras de manejar esos errores por esto si un programa falla hacer un catch, por ejemplo, puede ser una buena forma de evitar un bochorno.

Escribir código separado

Sabemos que es importante hacer que las cosas funcionen en todos los navegadores o al menos la mayoría, pero no debemos hacer código para cada uno de esos navegadores, la razón es muy sencilla, los navegadores van a seguir cambiando por lo que vas a tener que ir cambiando tu código con ellos, lo mejor es cambiar la detección de navegadores por la detección de características. Librerías como Modernizr te permiten hacer esto y ahorrar una gran cantidad de código, ya sabes en vez de programar para internet explorer mejor detecta si el navegador tiene la característica que necesitas como el text-shadow.

Diseño irresponsable

Crear web pensando en la resolución de pantalla del desarrollador/diseñador es un trabajo completamente irresponsable, que va a pasar cuando ese contenido se vea en dispositivos móviles. Sea responsable y use responsive desing, librerías como boostrap hacen este trabajo mucho más sencillo, por lo que no hay excusas.

Trabajar de más

Si un desarrollador tarda demasiado creando contenido web es porque esta haciendo trabajo de más con tareas repetitivas, o escribiendo demasiado. Es importante no trabajar de más ya que otros desarrolladores no lo están haciendo y eventualmente tendrás menos trabajo porque más tiempo implica más costos. Considere usar nuevas herramientas, nuevas técnicas de desarrollo, invierta un poco de su tiempo en leer un poco de documentación que le permita ahorrar algunas horas.

fuente:http://www.webbizarro.com/tutoriales/2041/errores-que-comenten-los-desarrolladores-web/

Ejercicio 1

imagen1

Imagen2

tercer corte

css

Css 3 from abdelare

maqueta html

Maqueta from abdelare

ejercicio completo

Ejercicio from abdelare

Nuevo navegador de microsoft

Comprobar compatibilidad con navegadores

Con esta aplicación puedes verificar que navegadores son compatibles con una determinada propiedad de css, elemento html o método js. Para facilitarnos este engorroso procedimiento, disponemos de esta pagina web muy útil

diseño del header y slideshow

Ejercicio from abdelare

generador de gradientes css

notepad ++

Este programa les servirá a los que no puedan trabajar en Dreamweaver.Es Gratis

herramienta 960 grid system

Esta herramienta te permite generar maquetación para una pagina de 960 px y puedes encajar muy bien todas las opciones de diseño para tu pagina.

Ejercicio grupo martes 6:15 pm

Hola jóvenes el ejercicio debe contener las siguientes características y debe ser entregado hasta el día miércoles 1ero de abril de 2015 hasta las 8pm: -utilizar logo propio -contenido real todo relacionado con su profesión -header -nav -3 artículos y tres secciones -2 aside -footer -debe contener todos los formularios vistos -cada párrafo utilizado debe tener :2modificaciones de fuente,2 de color de texto, 2 de tamaño, 2 teletipos, 2 enlaces cada uno con color diferente. -5 imágenes como enlaces del mismo tamaño-debe estar el archivo enlazado para trabajarlo en css y desde el css colocar el color de fondo, 3 cambios de tipografia, 3cambios de enlaces ya sea color, tamaño o fuente. Bonus:integrar un video! Suerte.

Ejercicio#2 segundo corte grupo lunes 7am

Hola jóvenes el ejercicio debe contener las siguientes características y debe ser entregado hasta el día miércoles 1ero de abril de 2015 hasta las 8pm: -utilizar logo propio adecuado a la temática -contenido real -header -nav -3 artículos y tres secciones -2 aside -footer -debe contener todos los formularios vistos -cada párrafo utilizado debe tener :2modificaciones de fuente,2 de color de texto, 2 de tamaño, 2 teletipos, 2 enlaces cada uno con color diferente. -2 imágenes como enlaces -debe estar el archivo enlazado para trabajarlo en css y desde el css colocar el color de fondo y 2 cambios de fuente. Todo el contenido centrado y justificado , fondo con imagen fija, temática : el diseño gráfico en colombia Suerte.

Introducción css

Css intro from abdelare

ejercicio grupo lunes 7am

Hola jóvenes el ejercicio debe contener las siguientes características y debe ser entregado hasta el día miércoles 25 de marzo de 2015 hasta las 8pm: -utilizar logo propio -contenido real todo relacionado con su profesión -header -nav -3 artículos y tres secciones -2 aside -footer -debe contener todos los formularios vistos -cada párrafo utilizado debe tener :2modificaciones de fuente,2 de color de texto, 2 de tamaño, 2 teletipos, 2 enlaces cada uno con color diferente. -2 imágenes como enlaces -debe estar el archivo enlazado para trabajarlo en css y desde el css colocar el color de fondo. Bonus:integrar un video! Suerte.

Header

Estructura from abdelare

La imagen de recurso

Parcial 1er corte

Listas y formularios

Listas from abdelare

Ejercicio

un bonus en la etiqueta de cuerpo el atributo bgproperties y el valor fixed para fijar la imagen!

Recursos ejercicio1 Html

Los detalles en este video están enfocados en su proceso de filmación. Por ejemplo, ¿sabías que Keanu Reeves no tenía permitido patear durante la filmación de la película debido a que se recuperaba de una cirugía, o que él fue el último de una larga lista de actores para interpretar a Neo?

Debajo les dejo una lista con los siete puntos que se mencionan. Puedes ver el video (en inglés) al final de estas líneas.

1. En la escena en la que Neo camina por fuera del edificio de su trabajo huyendo de los agentes, Keanu Reeves no usó un doble.

2. Los hermanos Wachowski querían que Johnny Depp interpretara a Neo. Por otro lado, Warner tenía los ojos en Brad Pitt o Val Kilmer. Después de que ellos y Tom Cruise, Will Smith, Ewan McGregor, Leonardo DiCaprio y Nicolas Cage rechazaran el papel, Keanu se quedó con él.

3. Para la escena del entrenamiento, utilizaron muchos pares de gemelos. Esto porque tenían en mente que la Matrix fuera un programa que se repitiera constantemente. En lugar de usar dobles o efectos especiales, decidieron hacerlo de esta manera.

4. El club en el que grabaron la escena donde Neo conoce a Trinity es real. Todas las personas ahí son asistentes comunes que acostumbran usar trajes de látex.

5. Muchos de los edificios en Matrix fueron usados también en otra película de ciencia ficción llamada Dark City. Lograron reducir el presupuesto al reutilizar estos sets.

6. La secuencia de la batalla en el lobby tomó 10 días de filmación. Esto porque todos los efectos son reales. Lo único que se hizo de manera digital fue remover las cuerdas que sostenían a Trinity y a Neo en sus escenas de vuelo.

7. Justo antes de empezar a filmar, Keanu Reeves fue sometido a una cirugía de columna vertebral. Como parte de su recuperación, tenía prohibido patear. Sus coreografías tuvieron que adaptarse a esta situación y es la razón por la vemos a Neo combatir mejor con las manos que con los pies.

¡25 errores a evitar en un sitio web!

26 Items que debes tener en cuenta antes de crear un sitio web.

Historia del diseño web!

Etiquetas