1. ¡OFERTA! con cupón "DIRVPS": hosting por $0,01 y también VPS Linux y Windows por $0,01 el primer mes por Interserver ← publi
    Descartar aviso
Descartar aviso
Al usar este sitio web, aceptas que nosotros y nuestros socios podamos establecer cookies para fines tales como personalizar el contenido y la publicidad. Más información.

Diseño y Maquetado Web xHTML y CSS con Adobe Photoshop CS3

Tema en 'Tutoriales Desarrollo Web' iniciado por elQuique, 4 Abr 2007.

  1. elQuique

    elQuique Usuario activo

    Estoy terminando estas cosillas atrasadas :) en la semana lo publico.
     
  2. Sebastian.

    Sebastian. Guest

    no quiero sonar molesto, pero....y la segunda entrega? :(
     
  3. elQuique

    elQuique Usuario activo

    Estaba esperando a que llegara a 1000 visitas, pero bueno ya que hay 5341 lo haré igual :p

    Gracias por pedirlo, estas cosas las tengo pronta pero como no había feedback pensé que no interesaba :)
     
  4. decacross

    decacross Nuevo usuario

    <!--quoteo(post=230667:date=Jun 26 2007, 06:25 PM:name=elQuique)--><div class='quotetop'>CITA(elQuique @ Jun 26 2007, 06:25 PM) [snapback]230667[/snapback]</div><div class='quotemain'><!--quotec-->
    Estaba esperando a que llegara a 1000 visitas, pero bueno ya que hay 5341 lo haré igual :p

    Gracias por pedirlo, estas cosas las tengo pronta pero como no había feedback pensé que no interesaba :)
    <!--QuoteEnd--></div><!--QuoteEEnd-->


    Hola amigo.. yo segui un tutoria muy parecido a este.. aqui te dejo el link... de hecho el tuyo esta perfecto pero lo encontre despues--

    esa es la direccion esta en la seccion de utilidades para tu web-- y ahi dice en tres partes aqui estan los links


    bien mi problema es en la segunda parte. ahi no explicaba como dividir en cs3 pues es con una version anterior. asi que use tu tuto y al momento de guardar--- me dice algo asi.


    " guardar para web y dispositivos"
    algunos nombres de archivos contienen caracteres no latinos
    estos nombres no sera compatibles con algunos servidores y navegadores...

    luego dice no volver a mostrar y ok-

    ahora el problema es que.. efectivamente en firefox no se visualiza el sitio..
    mientras q en internet explorer si
    help y de ante mano te admiro.. eres un gran master en esto..

    desde el salvador saludos.
     
  5. elQuique

    elQuique Usuario activo

    decacross, bienvenido al foro.

    Edite tus links porque ese tutorial es una copia del mio, realizado con otro color como acostumbran a copiarnos en varias webs.

    No explica como dividir en CS3 porque este tutorial yo no lo había hecho en CS3, por tanto no me lo pudieron copiar jajaja. La parte de CS3 esta formada por 3 entregas, una es la que tu viste, y las otras 2 no las he publicado aun.

    Te aconsejo estar atento a la próxima entrega donde explico lo que preguntas :)

    Y trata de navegar por webs de contenido original no copiado jajaaj sin autorización de los autores.
     
  6. Pedri

    Pedri Nuevo usuario

    jajajaja
    Quique. Soy yo el que te copia, buaaaaabuaaaabuaaaajajjaaaaa!!!
    :lol:
     
  7. alvlin

    alvlin Nuevo usuario

    Ah, claro, qué casualidad, ¿cómo sabemos que sos el autor original y no uno más de los que copia el "contenido original"?
    Yo he visto el mismo tutorial en muchas webs.

    ...
     
  8. Pedri

    Pedri Nuevo usuario

    Bienvenido alvlin

    Eso se sabe por fechas de publicación, ficheros, etc...
     
  9. elQuique

    elQuique Usuario activo

    alvlin, mi tutorial fue hecho en el año 2002 cuando solo había 3 webs en español, 2 que ya no están mas y queda solophotoshop.com jaja, y la fecha de publicación de la primer parte de ese tutorial es 1 mes después de que yo reflote el tutorial en el año 2006, y la segunda parte es 15 días después, y la tercera 10 días después.

    Hace un mes publique la actualización a Photshop CS3, la cual todavía no tienen.

    Otra forma de saber si el autor es el original es bien sencillo, podes mirar al autor de ese tutorial cuantos post responde sabiendo sobre webs y diseño, y puedes mirar el autor de este otro y algun que otro post ha contestado jaja y algun que otro tutorial ha hecho.

    También puedes fijarte si ese autor hizo alguna web, y si este otro lleva mas de 600 hecha en su vida jajaja.

    avlin, bienvenido al foro aunque sea solo para pelear jaja, ponete a trabajar !!
     
  10. alvlin

    alvlin Nuevo usuario

    Quique:
    Tus argumentos no me parecen concluyentes, no por participar más tenés más conocimiento.
    Yo solo llevo 2 mensajes en este foro, ¿quiere decir eso que todo lo que escribí en alvlin.blogcreativo.com es copiado de otros lugares?

    Y en cuanto a la cantidad de webs, pues lo mismo, yo solo he hecho 2 y <b>no por eso dejás de preguntarme por msn cuando algo de PHP no te sale... :lol: </b>
     
  11. elQuique

    elQuique Usuario activo

    jaja :)

    Lastima te prives de photoshop por usar linux jaja.
     
  12. alvlin

    alvlin Nuevo usuario

    uuuu empiezan los golpes bajos? si empezamos esa discusión me vas a terminar baneando...
     
  13. decacross

    decacross Nuevo usuario

    <!--quoteo(post=235524:date=Jul 16 2007, 04:09 PM:name=elQuique)--><div class='quotetop'>CITA(elQuique @ Jul 16 2007, 04:09 PM) [snapback]235524[/snapback]</div><div class='quotemain'><!--quotec-->
    jaja :)

    Lastima te prives de photoshop por usar linux jaja.
    <!--QuoteEnd--></div><!--QuoteEEnd-->


    Hey amigos. siento que la discucion comenzo luego de mi post en verdad no era esa mi intencion. y lo siento mucho porque yo no sabia q era una copia...

    tengo una duda. este turoria que dice es nuevo y ya cs 3 esta hecho en cs3?? es q hay una parte q dice

    Hasta aquí llega "Photoshop" pero toma su lugar el Hermano Menor "Image Ready", pero eso sera en la próxima entrega ;)

    entre aqui
    <a href="http://www.tallerwebmaster.com/Tutorial-Disenio-Web-con-Adobe-Photoshop-CS3-y-HTML-c-97.html" target="_blank">http://www.tallerwebmaster.com/Tutorial-Di...-HTML-c-97.html</a>

    y ahi hay una parte q dice...
    Para dibujar este diseño, pueden usar nuestro tutorial en la Parte 1, Parte 2, Parte 3 y Parte 4, o pueden descargar el archivo acá: Dibujo sin Cortes


    entre ahi y lo q no entiendo es porq luego salen en 10 partes...
    y lo q me confunde es que dice en la numero 10
    "Hasta aquí llega "Photoshop" pero toma su lugar el Hermano Menor "Image Ready", pero eso sera en la próxima entrega ;)"
     
  14. elQuique

    elQuique Usuario activo

    No te preocupes que no hay discusión alvlin no tiene hijos y yo si, cuando el los tenga sabrá como los padres los reconocemos a ojos cerrados jaja.


    Este tutorial lo había publicado en el año 2002, y constaba desde el dibujo hasta el corte de las partes en ImageReady y luego el armado del html en FrontPage y en Dreamweaver.

    Hoy día, nadie usa FrontPage si se quiere llamar diseñador o webmaster jaja es como usar un word y para eso hay que ser secretaria y depilarse las piernas jaja.

    Por tanto nos queda que el editor mas utilizado es Dreamweaver y el mas completo, y en la versión CS3, desapareció, no existe mas el ImageReady ok ??

    Bien, entonces hace poco mas de un mes, hice un resumen del tutorial, que lo puedes ver acá:

    Diseño Web con Adobe Photoshop CS3
    <a href="http://www.tallerwebmaster.com/Tutorial-Disenio-Web-con-Adobe-Photoshop-CS3-c-96.html" target="_blank">http://www.tallerwebmaster.com/Tutorial-Di...p-CS3-c-96.html</a>

    Y luego publique Diseño Web con Adobe Photoshop CS3 y HTML
    <a href="http://www.tallerwebmaster.com/Tutorial-Disenio-Web-con-Adobe-Photoshop-CS3-y-HTML-c-97.html" target="_blank">http://www.tallerwebmaster.com/Tutorial-Di...-HTML-c-97.html</a>

    Que es la que realiza el corte utilizando Adobe Photoshop CS3 y NOO !! el ImageReady porque este no existe más, pero en vez de hacer desde cero el tutorial, aclare que para aprender a dibujarlo puede mirar la parte 1, 2, 3 y 4, o sea estas:

    <b>Diseño y Maquetado Web 1 - Preparar el Ambiente de trabajo</b>
    Se plantean esquemáticamente los elementos de la Web, se comienza a preparar el Photoshop posicionando las líneas guías, se dibujan algunos elementos de la Web.
    <a href="http://www.tallerwebmaster.com/Tutorial-Disenio-y-Maquetado-de-Plantillas-WEB-1-c-14.html" target="_blank">http://www.tallerwebmaster.com/Tutorial-Di...WEB-1-c-14.html</a>

    <b>Diseño y Maquetado Web 2 - Dibujando nuestro Diseño</b>
    Se dibuja el header, explicado paso a paso la técnica a usar, se aconseja el uso de Capas para organizar el diseño, y se realiza todo el dibujo plano del diseño.
    <a href="http://www.tallerwebmaster.com/Tutorial-Disenio-y-Maquetado-de-Plantillas-WEB-2-c-15.html" target="_blank">http://www.tallerwebmaster.com/Tutorial-Di...WEB-2-c-15.html</a>

    <b>Diseño y Maquetado Web 3 - Aplicando efectos al Diseño</b>
    Se muestra como darle un aspecto tridimensional, con sombras y biseles, dándole un mejor aspecto.
    <a href="http://www.tallerwebmaster.com/Tutorial-Disenio-y-Maquetado-de-Plantillas-WEB-3-c-16.html" target="_blank">http://www.tallerwebmaster.com/Tutorial-Di...WEB-3-c-16.html</a>

    <b>Diseño y Maquetado Web 4 - Mejorando el Aspecto Visual</b>
    Se termina con el diseño y los aspectos visuales. En esta versión 2001 del Tutorial terminaba el trabajo de Photoshop.
    <a href="http://www.tallerwebmaster.com/Tutorial-Disenio-y-Maquetado-de-Plantillas-WEB-4-c-17.html" target="_blank">http://www.tallerwebmaster.com/Tutorial-Di...WEB-4-c-17.html</a>

    No repetí esto, porque se hace exactamente igual en la versión 6 del año 2002 y en la versión CS3 del año 2007, pero !!! hay que tener en cuenta que luego en vez de seguir con la parte numero 5 del viejo tutorial (que usa ImageReady), debes usar esta ultima de Adobe Photoshop CS3, o sea esta:

    <a href="http://www.tallerwebmaster.com/Tutorial-Disenio-Web-con-Adobe-Photoshop-CS3-y-HTML-c-97.html" target="_blank">http://www.tallerwebmaster.com/Tutorial-Di...-HTML-c-97.html</a>

    Y te recuerdo, esta todo clarito y explicado si lees acá el resumen:
    <a href="http://www.tallerwebmaster.com/Tutorial-Disenio-Web-con-Adobe-Photoshop-CS3-c-96.html" target="_blank">http://www.tallerwebmaster.com/Tutorial-Di...p-CS3-c-96.html</a>
     
  15. decacross

    decacross Nuevo usuario

    GRacias amigo...

    Tengo una duda.. tu dices en el tutorial. en cierta parte...

    que no le pongamos las letras en photoshop q se las pongamos en html. me refiero al menu y a la informacion de la pagina.. pero mi pregunta es ¿ como se puede hacer eso? siempre me lo e preguntado..

    me enseñaron q una forma era poner de fondo la imagen en la celda. y escribir el texto.. pero que me dicen??

    gracias a todos los masters saludos.
     
  16. elQuique

    elQuique Usuario activo

    Si bien puedes hacerlo con Photoshop e incluso elegir una fuente distinta y bonita, mi consejo es escribir el texto en Dreamweaver, por ejemplo en un botón escribir.

    <a href="galeria.html">Galería</a>

    y si es necesario a la <a> asignarle una imagen de fondo, pero ese texto llamado galería, el google por ejemplo lo encontrara y seguirá indexando todas tus paginas :), en cambio si la imagen dice galería, no sabrá leerla.
     
  17. carolagria

    carolagria Guest

    muchas gracias Quique! Muy útil! :aplausos:
     
  18. elQuique

    elQuique Usuario activo

    Me alegro que así sea carolagria, hoy estuve preparando la siguiente entrega donde vemos como optimizar mas el html y las imágenes generadas.
     
  19. jokser

    jokser Nuevo usuario

    Quique, espero impaciente esa entrega, gracias por tu trabajo.
     
  20. elQuique

    elQuique Usuario activo

    jokser, bienvenido al foro :)
     


Alojamiento web, Hosting Reseller, Servidores Dedicados - All in Hosting


    
    
    
    
Blog · Sitios amigos: GuiaHosting · Unidominios · Interalta ·