"Escucho con atencion a la gente que tiene la razón y prefiero seguir a los que tienen los resultados "

Soy una persona apasionada por todo lo que tiene que ver con Internet y las nuevas tecnologías. Soy autodidacta, y me encanta impartir clases...


Diseño y maquetacion Web 1

Martes 14 de Septiembre de 2010

HTML Y CSS
Autor: César Cancino
Categoría: HTML Y CSS
Etiquetas Programación, php, mysl
Comentarios 58

Nuestro amigo Domingo Uribe ha puesto a disposición de la comunidad una serie de videos de maquetación..Vamos a alentarlo que nos siga ayudando. Desde ya muchas gracias amigo.
Hola, este es el primer video de una serie dedicada a la creación de un blog, partiendo de su diseño en PhotoShop, y pasando por su marcado en código XHTML, (válido) y la creación de sus hojas de estilos CSS para la presentación en el navegador del diseño original. El codigo será desarrollado pensando en una futura etapa de programación del mismo.

¿Qué te gustaría compartir con nosotros?

Compartir

58 Comentarios

  1. Alejandro
    Sábado 29 de Junio de 2013

    Recomiendo al autor (y a todos) que no utilice colores grises claros en el texto de los sitios web. Sé que los diseñadores ven el tema por el lado estético, pero para la gente con problemas a la vista, y con los monitores que se degradan y pierden el contraste, ese mal hábito del diseño web se ha convertido en una rotunda molestia a la hora de leer muchos sitios. Privilegia la funcionalidad, el texto debe ser legible. Nunca uses un texto más claro que #333 con un fondo blanco. Saludos.

  2. Sergio Garre
    Sábado 07 de Mayo de 2011

    Hola, hoy mismo he empezado con los videotutoriales de maquetación y diseño web. Actualmente estoy estudiando PHP y MySQL para el desarrollo de mi propia página y me preguntaba si sería posible adaptarlo al CSS y XHTML aquí expuesto. De ser así desarrollaría el aspecto gráfico gracias a tu trabajo y la codificación PHP y MySQL gracias a César. Un saludo.

  3. mariosequeda
    Lunes 20 de Diciembre de 2010

    Hola muchas gracias ya solucione el problema utilizando el archivo que viene con el VT es que en la pagina de Grid 960 lo actualizaron y ya no viene así pero en todo caso gracias Domingo por tus excelentes aportes muchas bendiciones desde Colombia.

  4. mariosequeda
    Lunes 20 de Diciembre de 2010

    Saludos primero felicitar a Domingo por tan excelente material y a ver quien me puede ayudar cuando descargo la plantilla desde Grid 960 y la abro con photoshop no me aparece en carpetas como en el VT es mas ni si quiera me aparece la que dice layer muchas gracias.

  5. mariosequeda
    Domingo 19 de Diciembre de 2010

    Saludos Domingo excelente tus VT para los que como yo no sabemos mucho de diseño pero fíjate que tengo un pequeño problema y es que cuando descargo el archivo de 960 grid y lo abro con photoshop no lo puedo manejar como lo haces tu o sea que aparezcan las carpetas es mas la carpeta que dice layer ni me aparece tal vez sea un error que este cometiendo yo pero la verdad no manejo mucho el photoshop ojala puedas ayudarme la versión que utilizo es la CS4, muchas bendiciones desde Colombia.

  6. neorevolutions
    Domingo 12 de Diciembre de 2010

    genial aporte!!! se agradece mucho el material aportado. saludos desde argentina

  7. Luis
    Miércoles 10 de Noviembre de 2010

    Hola1! Amigo, te saludo desde Panamá, buscando tutoriales para aprender PHP encontre los que haz publicado y me parecen favulosos. Inicié desde el 1 para llevar la secuencia y no perder detalles.

  8. Luis Cerrud
    Miércoles 10 de Noviembre de 2010

    Saludos! Amigo, buscando video tutoriales para aprender php he encontrado los que haz publicado y me parecen Excelentes. Estoy iniciando desde los primeros para no perder detalles.

  9. Angel
    Viernes 29 de Octubre de 2010

    Excelente, simplemente exceleten, sigue asi amigo.

  10. Daniel
    Miércoles 27 de Octubre de 2010

    Órale, saludos desde el Sur de México. No puedo creer lo que estoy leyendo en la descripción. Muchísimas Gracias por este video, lo voy a descargar y lo veré una otra vez para no perderme nada. Yo estoy practicando en PhotoShop así que la sorpresa de tu apoyo para la gente que como yo quiere aprender es mucha :D. Pues a ver el video y estaremos comentándolo.

  11. jonathan
    Jueves 16 de Septiembre de 2010

    muy bueno tu VT domingo, espero que sigas adelante con más videos.

  12. Jorge Armando
    Jueves 16 de Septiembre de 2010

    felicitaciones un uevo miembro se une al equipo por excelencia bienvenido seas Domingo y gracias por tu aportes

  13. lester288
    Jueves 16 de Septiembre de 2010

    Hola amigo Domingo, que bueno el videotutorial que compartes con nosotros,para mì el tema de diseño, maquetaciòn siempre me ha dado un dolor de cabeza, con estos videos tuyos espero aprender mucho, Saludos

  14. Emerson
    Mi?rcoles 15 de Septiembre de 2010

    Gracias amigo Domingo, lo estaba necesitando,para poder complementar con el codigo de programacion y crear asi por fin una pagina web completa muchas gracias animo, que todos estamos anciosos en seguir aprendiendo.

  15. Jose Miguel Guimera
    S?bado 18 de Septiembre de 2010

    Es muy importante el aporte que estan Uds. aportando a la comunidad de la computacion a nivel mundial de habla hispana, estan liberando al mundo del monopolio y la mediocridad. Por lo tanto mas que felicitarlos debemos estar todos muy agradecidos de la bondad y desinteres que dan Uds. al enseñarnos a pescar, en vez de vendernos el pescado. Microsoft igual a venta de pescado y hoy por hoy no solo no es fresco sino que viene putrefacto y fallando mas que escopeta de feria. Enhorabuena!!

  16. Miguel Angel
    Lunes 11 de Octubre de 2010

    Desde España.... muchas felicidades por este video tutorial. Excelente.

  17. roberto
    Lunes 20 de Septiembre de 2010

    domingo..excelnte curso que vas hacer........yo no soy diseñador pero me gustaria serlo....espero que sigas subiendo mas videos..........gracias.

  18. valerio waldo
    Jueves 16 de Septiembre de 2010

    Excelente video, simplemente te comento algo, la resolucion que utilizas es muy baja y por eso no se ve bien el video, gracias

  19. Alex Rivera
    Jueves 16 de Septiembre de 2010

    Hola a todos: Muchas gracias Domingo Uribe por el gran aporte que estas haciendo con este curso, en realidad este tipo de temas son de mucho interes y valor para personas que como yo, deseamos aprender... Dios te bendiga... Saludos a todos desde El Salvador...

  20. Pepe
    Jueves 16 de Septiembre de 2010

    Justo lo que todo diseñador y programador desea aprender, este es el santo grial

  21. Domingo Uribe
    Jueves 16 de Septiembre de 2010

    Saludos amigos... Gracias por todos los comentarios nuevamente. Justamente estoy estudiando la manera de mejorar la imagen de la grabación de la pantalla. Agradecería sugerencias prácticas de quién domine el tema del uso de Camtasia o similares, temas de resolucion... etc. Ahora bien, para codificar sí es necesario cambiar la resolucion a una mayor como hace César, pero pa diseñar es casi imposible. Saludos desde Santiago de Chile!!! :P

  22. Roberto
    Jueves 16 de Septiembre de 2010

    Muchas Gracias Excelente aporte.

  23. Frank Zane
    Jueves 16 de Septiembre de 2010

    Muchas gracias, exelente tutorial

  24. pepe
    Viernes 17 de Septiembre de 2010

    Gracias, esperando proximos videoss

  25. pepe
    Viernes 17 de Septiembre de 2010

    Gracias, esperando proximos videoss

  26. Domingo Uribe
    Domingo 19 de Septiembre de 2010

    Hola amigos, saludos a todos y muchas gracias por el apoyo. Espero les sea de utilidad este, y el proximo, con el que estoy luchando, pa poder transformar, jejej. Esta es mi primera experiencia con software de captura de pantalla. Espero este online mañana lunes 20. Saludos amigos!!!

  27. Andres
    Domingo 19 de Septiembre de 2010

    Amigo Uribe el video de maquetacion estuvo muy bueno para aquellos qeu estamos aprendiendo espero nos sigas enseñando un poco mas y gracias... te felicito

  28. fran
    Domingo 19 de Septiembre de 2010

    muchas gracias, por la informacion.Mis felicitaciones

  29. Armando
    Mi?rcoles 15 de Septiembre de 2010

    Domingo felicidades muy buen trabajo, saludos desde México y seguimos en espera del segundo tutorial...muchas gracias por compartir tus conocimientos.

  30. Veimar Rivas
    Mi?rcoles 15 de Septiembre de 2010

    Bien compañero un muy buen comienzo para una serie de tus tutoriales, te felicito y estaremos en contacto. Nos vemos

  31. alexander
    Mi?rcoles 15 de Septiembre de 2010

    te felicito por este vt me há parecido excelente justo lo que estaba buscando gracias por compartir tus conocimientos y esperamos pronto el nuevo vt gracias

  32. JuanOrtiz
    Mi?rcoles 15 de Septiembre de 2010

    HAHAH man BUENA ese vídeo...todos estábamos buscando esto...y ps vamos con toda pal blog!!

  33. Ismael
    Mi?rcoles 15 de Septiembre de 2010

    muchas gracias por los videos y a todos en esta web me parece muy interesante en particular porque me gusta el legunaje php y quiero aprender todo lo que sea necesario de el

  34. SJENERT
    Mi?rcoles 15 de Septiembre de 2010

    Muchas gracias Domingo Uribe por empezar esta serie de videotutoriles que nos caerán muy bien.

  35. Domingo Uribe
    Mi?rcoles 15 de Septiembre de 2010

    Muchas gracias a amigos por los comentarios, es muy motivante leer que es de utilidad. Así es que prepárense para codificar el diseño que hemos creado en el video 1!!

  36. jb
    Mi?rcoles 15 de Septiembre de 2010

    se agradece el tiempo y esfuerzo que dedicaste para realizar este videotutorial, y esperamos sean muchos mas, felicidades te quedo excelenete. saludos!

  37. Matias Panaino
    Mi?rcoles 15 de Septiembre de 2010

    Acabo de terminar de ver el videotuto, muy bueno!! Esperando con ansias el 2... Saludos desde argentina!

  38. Jhaksson Miller Cuesta
    S?bado 18 de Septiembre de 2010

    Gracias por este tutorial esta muy bien explicado te felicito

  39. kapry
    Viernes 17 de Septiembre de 2010

    Es excelente tu video! Que pena que yo no tengo ningún conocimiento sobre photoshop u otra aplicación parecida. Muchas gracias por compartir tu conocimiento ;) Esperare el proximo tuto Saludos

  40. renato
    Viernes 17 de Septiembre de 2010

    Gracias, lo que se busca y un poco dificil de encontrar........................ sigan asi, graciasssssssssssssss

  41. kevin
    Martes 14 de Septiembre de 2010

    que bien Domingo ha emprendido hacer este video tutoriales, por eso mis felicitaciones te lo agradezo por compartir tu conocimiento un saludo espero que sigas elaborando mas video, Dios te bendiga.. bye..

  42. Mariano
    Martes 14 de Septiembre de 2010

    Muchas Gracias Domingo por compartir tus conocimientos y tu tiempo realizando este videotutorial saludos desde Buenos Aires

  43. Gonzalo
    Martes 14 de Septiembre de 2010

    Que tal Domingo, jeje ya empezo.. ya lo voy ver.. que alegria que ya esta compartiendo tus conociemientos... saludos..

  44. Tavo-kun
    Martes 14 de Septiembre de 2010

    pss hola domingo soy tavo-kun el creador de los tutoriales de vb.net te felicito por querer aportar a la web de cesar y espero que recibas la misma acogida que yo recibo con mis videos tutoriales, y pss felicitarte por este primer video tutorial XD

  45. Idelvis Parra
    Martes 14 de Septiembre de 2010

    Este material me caera como anillo al dedo, lo necesitaba urgente, como le comente a Cesar hoy en Facebook

  46. Dostin Baez
    Martes 14 de Septiembre de 2010

    de verdad hermano graias por compartir tu trabajo... yo voy allenar mis huecos con tigo jejejeje gracias de verdad...

  47. Estudiante
    Martes 14 de Septiembre de 2010

    Gracias Por Esto Tan Anelado Y Esperado Para MI

  48. Sergio
    Martes 14 de Septiembre de 2010

    Querido amigo Domingo Uribe. Me atrevo a jurar que sin tan siquiera reproducir tu trabajo es un excelente trabajo. Felicidades a ti y esta comunidad.

  49. Juan Jose
    Viernes 17 de Septiembre de 2010

    Excelente video y sobretodo muy bien explicado, lamentablemente mis conocimiento de PhotoShop son muy limitado. Como comenta lester288 desde Nicaragua, maquetación y diseño me complican la vida pero me gusta. Gracias por tu aporte y espero el siguiente VT.

  50. Angel
    Martes 21 de Septiembre de 2010

    Saludos Domingo excelente aporte para toda las personas que estan en este mundo de la web. Esperando con anciedad las proximos videos sobre maquetación. Muchas Graciasss...

  51. Omar
    Mi?rcoles 22 de Septiembre de 2010

    -muy buen APORTE salu2 Domingo sigue asi

  52. Alejandro
    Mi?rcoles 22 de Septiembre de 2010

    ;) felicitaciones Domingo muy buen trabajo

  53. carlos
    Lunes 27 de Septiembre de 2010

    Hola, muchísimas gracias por el video tutorial, hace mucho tiempo que quería aprender como maquetar con photoshop para web y no encontraba nada, ni siquiera un buen libro. He seguido este primer videotutorial con muchísima atención, lo he hecho todo paso a paso, mañana me pongo con la segunda parte :)

  54. Ivan2k2
    Viernes 24 de Septiembre de 2010

    Muchas gracias ando estudiando diseño web y ahora me gustaria hacer un master por si habria futuro en esta rama ¿Algun consejo?. he echo alguna pagina basica sencilla pero de maquetacion poco me han enseñado q me aconsejas y gracias por esto videotutoriales, sigue asi

  55. Ivan2k2
    Viernes 24 de Septiembre de 2010

    Muchas gracias ando estudiando diseño web y ahora me gustaria hacer un master por si habria futuro en esta rama ¿Algun consejo?. he echo alguna pagina basica sencilla pero de maquetacion poco me han enseñado q me aconsejas y gracias por esto videotutoriales, sigue asi

  56. Domingo Uribe
    Viernes 24 de Septiembre de 2010

    Hola amigos, este domingo 26 se viene la continuacion de la serie, en donde concluiremos el traspaso del diseño en "Fotoxó" a código Web. Amigo Ivan, es bueno que puedas poner Online tus trabajos para ver el código y por supuesto te hecho una mano. Otra sugerencia es, que si tienes algun tiempo, entres a nuestro chat, en donde además de aprender y colaborarnos unos a otros, la pasamos re bien, jeje. Saludos!!

  57. Domingo Uribe
    Miércoles 13 de Octubre de 2010

    Hola jmrr: Sobre el problema con los acentos, se debe a una desconfiguracion del idioma del teclado en Windows. Revisa este articulo:
    http://espanol.answers.yahoo.com/question/index?qid=20060809170049AAIPbm3
    Ahora, no recuerdo bien, pues el problema es en XP, y estoy usando otro OS ahora, es que ciertas teclas, como Shift, o Bloq Mayus sirven desafortunadamente para alternar entre Inglés y Español el teclado y sin querer las presionamos. Ya sabes... errores de Winbug. Saludos

  58. jmrr
    Martes 12 de Octubre de 2010

    Muchas gracias por este buen trabajo. Una voz muy agradable. Empecé por casualidad por el 3 y viendo lo interesante y la calidad me vine al primero que he seguido hasta el final aunque esta parte ha sido más de repaso. No sé por qué en mi photoshop al rato de trabajar comienzan a funcionar mal los acentos y se soluciona cerrando y volviendo abrir aunque enseguida vuelve a modificarse para volver a salir mal (')(Creo que la tecla Alt significa alternativa) Un saludo y muchas gracias de nuevo.