Diseño de una web desde cero con Photoshop

[thebestthereis55]

disculpe una pregunta todo eso que saco como el boton de buscar y lo que tiene el cuadro de usuarios de nombre y clave sirven osea si le pongo algo en buscar si lo busca o que se tiene que hacer y otra cosa yo todavia nose que estudiar y me gustaria si me dices que tipo de carrera lleva todo esto?

[ujglc]

DIJIMOS DESDE CERO NO?

[serviweb2007]

Muy buen tutorial aunque algo rápido

[DisenoWebBilbao]

El más rápido del Oeste.

[Silkon]

interesante!!

[positibasi]

asu muy muy buen video ;D

[SantiLlumihucci]

Es un excelente tutorial... Pero me gustaria que me ayuden a aprender como le doy vida a esa imagen hecha en Photoshop, es decir maquetarla a HTML y CSS, Ayudenme con un video donde explique eso... Se los agradesco mucho!!....

[LUISMAR2310]

oye donde puedo conseguir el video completo, apenas empiezo en esto y me gustaria contar con el video completo te lo agradeceria...

[isaky123]

Muy buen tutorial.

[tonito9mm]

DIOS MIO SI PUDIERAS HACERME UNA PLANTILLA DE CALL OF DUTY PARA MI CLAN,ESQUE ESTOY HACIENDO UNA WEB Y NO TENGO LA PLANTILLA IDEAL SI ALGUIEN ME AYUDARA QUE DIOS SE LO PAGUE Y LO BENDIGA,OJALA ALGUIEN SE OFRESCA ES PARA JOOMLA.

[abagab114]

You have a beautiful voice.

[VestaI21]

olle q mierda va mui rapido

[jgtconsulting]

Este video está muy bueno, interesante y explicativo, pero sigo pensando que el mejor sistema para alguien que quiera tener un sitio Web y diseñarlo el mismo sin tener que saber HTML, PSP, Photoshop ni ningún otro programa, es el sistema de GDI que nos proporciona la pagina Web y herramientas suficientes para diseñar un bonito sitio en menos de una hora sin tener que tener ningún conocimiento de programación. En mi canal tengo un tutorial que te enseña todo esto.

[joijas]

Este no es el tutorial como tal, en la explicación del video dice donde pueden ver el video normal con todo y explicación, por favor, lean antes de criticar y escribir tonterias, felicidades a desarrolloweb por su dedicación y continuen así a pesar de los trolls que ni siquiera saben leer ni escribir bien. 

[GalizerInSaNe]

Muy interesante!

[LeNtAoOMt2]

a esto lo llamas tutorial tio,joer vas super rapido...

[JBMrHACKER]

como se llama la cancion del fondo



[Puesna1]

NICE JOB MAN

[Luizastudillo]

exelente sin mas que decir

[zajifi]

hola amigo una pregunta no tenias un tuturial como hacer web stilo compraventa

[ecuapixel]

ESTA CHEVERE PERO SOLO PARA VER COMO EJEMPLO, MAS NO EXPLICAS PASO A PASO... DEBERIAS HACER MAS QUE SEA EN PARTES SALUDOS

[ecuapixel]

ESTA CHEVERE PERO SOLO PARA VER COMO EJEMPLO, MAS NO EXPLICAS PASO A PASO...

[lineage2c6]

que hermoso trabajo y que buen video y la musica hermosa quisiera los nombres , ahora mismo voy a intentar hacer esto pero diferente =) si tuviese q darte puntuacion no me alcansarian los puntos

[nniga91]

Exelente Tutorial Un Poco Rapido si sigue asi ;)

[nniga91]

te lo agradesco exelente Tutorial Un Poco rapido si xD Sigue asi ;) 5 Star

[mago1234567890]

buenas con que herramienta recortas las secciones que necesitas  y como la colocas en un nuevo pedazo de photoshop

[jinfatal]

seria mejor si divides el tutorial en videos y no como si se viera que lo haces en chinga

[herdilinger]

Hola, me gusto mucho el video. Estoy aprendiendo maquetacion ya que de Photoshop se muchisimo. Una consulta; la rejilla con las medidas se puede conseguir en algun lugar o debo hacerla yo? Me gustaria saber que se hace una vez terminada la maquetacion para entregar el diseño y terminar la web.

[desarrollowebcom]

@herdilinger mira los comentarios anteriores de este vídeo, que todo eso que planteas ya está respondido. Hay vídeos, manuales, de todo para aprender todo lo que necesitas en nuestra web y aquí en Youtube

[tonito9mm]

@herdilinger COMO ME GUSTARIA QUE ME HICIERAS UNA PLANTILLA DE CALL OF DUTY PARA MI WEB CLAN ESTOY USANDO JOOMLA PERO NO TENGO Y NO CONSIGO PLANTILLAS DE CALL OF DUTY GRATUITAS YA A QUE SOY S RECURSOS ECONOMICOS BUENO SI DIOS TE TOCA Y ME QUIERES DAR UNA MANO ME CONTESTAS OKK,OJALA YO APRENDA A USAR EL PHOTOSHOP ASI DE BIEN COMO USTEDES

[diezvaldes]

Un tutorial como dios man, Sonido Perfecto se entiende todo lo que dices :D

[spikeman316]

OK.

Entonces yo hago toda esta diagramación en photoshop y entonces....¿Cómo puedo hacer que sea HTML, que sea interactiva para colgarla en una website??

[MRKLEVEN]

Este video no ayuda para nada......este cuate solo esta haciendo publicidad a su producto. :(

[lavanguardiadelsol]

excelente, me voy a ver el resto de videos como se llama la musica que suena?

[jonaclub2010]

Oye cual es el atajo para hacercar y alejar como tu le haces

[skyniceboys]

EXCELENTE, EMTENDI ABSOLUTAMENTE TODO, A PESAR K ES EL PRIMER VIDEO RELACIONADO A CREACION DE PAGINAS WEB EN POTOSHOP, !!

[riperxx]

Men eres el puto amo, se salen tus vídeos, muchas gracias por compartir tus conocimientos con la comunidad de YouTubers. Saludos amigo.

[2583Miguel]

muy buen tutorial y es más el sonido de maravilla

podrias mostrar el archivo donde se encuentre para poder observarlo más lento.

[desarrollowebcom]

@2583Miguel fíjate en las respuestas en vídeo, enviadas al vídeo este del diseño web, donde encontrarás dos vídeos que aclararán perfectamente tu pregunta.

[yrzm1021]

Hola, como corto las imagenes para colocarlas en el html. Gracias

[desarrollowebcom]

@yrzm1021 eso está explicado en el manual de maquetación css de DesarrolloWeb [dot] com.

Además, en el canal de desarrollowebcom dentro de youtube podrás ver 3 vídeos que ocupan algo más de dos horas de taller de maquetación web con CSS, que se explica ese proceso al que llamas "cortar las imagenes".

Si quieres, también puedes buscar esos vídeos por palabras, con "maquetacion css 960 grid system".

[yrzm1021]

Hola, como corto las imagenes para colocarlas en el html. Gracias

[FREDYVIKY]

hola esta bueno tu tutorial pero si fuera con el fin d enceñar alos demas ,lo ubiese mas lento o como dices que tienes mas de una hora lo tendrias que hacer por lomenos en 11 parte y bien esplicado porque la verdad te digo no entendi nada gracias de igual manera tus intenciones son buenas y es lo que cuentas felicidades

[FREDYVIKY]

hola esta bueno tu tutorial pero si fuera con el fin d enceñar alos demas ,lo ubiese mas lento o como dices que tienes mas de una hora lo tendrias que hacer por lomenos en 11 parte y bien esplicado porque la verdad te digo no entendi nada gracias de igual manera tus intenciones son buenas y es lo que cuentas felicidades

[CodyAchter]

i wish i knew what he was saying

[DxotilegnA]

Excelente el video, pero mi pregunta es x que no colocan como pasar todo ese diceño a HTML

[hormiga420]

Muy mal partir de algo que ya has avanzado, de todas formas gracias por tus contribuciones

[edgaruap]

muy bueno eres un maestro

[flipando77]

velocidad de la luz, no me parece nada útil..

[guillermo6066]

Cual es el tema del video el primer tema!! la cancion, el track ?

[desarrollowebcom]

@guillermo6066 El artista es Roger Subirana y su música es copyleft, por lo que te la puedes descargar gratis. En el propio vídeo está la dirección de la página del músico.

[cabraniego]

buffff no me he enterado de nada...

vale lo del diseño, pero despues como haces que cada palabra la puedas vincular para abrir otra pagina??

[ruiloba9]

tu tuto esta de la verga we... jaja

[MsRyukk]

oye una preguntita los palo esos dodne se pueden encontrar?

[MsRyukk]

Impresionante!!! me suscribo ^^

[pcactivooficial]

como se supone que se va a editar el contenido fuera de Photoshop :S

[slmgrvbs]

pueden ver y entrar a del1al9.com

[12colli]

es cierto ke si hago una pagina web me cobran por mantenerlo en internet o por crearlo?

gracias espero tu respuesta

[desarrollowebcom]

@12colli cobran por ambas cosas, pero lo cierto es que depende mucho del profesional que te haga el trabajo. Conozco profesionales q cobran sólo por mantener el sitio, que cobran sólo por hacerlo y que cobran por ambas cosas.

Pero quédate que lo más normal que que todos cobren por crear el sitio, pues lleva bastante trabajo y que cada profesional decide si quiere o no ofrecer mantenimiento al cliente bajo una cuota periódica.

[MAF0111]

Esta bueno el tutorial, pero vas a las millassssssssssss....

[animee92]

xD muy rapido no entendi nada o.0

[tbarrakuda]

che muy interesante este video muy bueno

[breimel]

Gracias me dio la idea completa de como crear el diseño ahora voy por el mas detallado en la web!

[anjesenamen]

Lo siento yo asi no me entero de nada, necesito que vaya mas despacio( pero la música es buena!).

Además creo que los que no pilotamos tanto necesitamos una voz en off que nos vaya explicando todo paso paso. Ya que estoy aquí aprovecho para hacer una petición, necesito que alguien me explique como exportar una página web diseñada desde photoshop. Gracias!

[monagrillero]

Si no es un tutorial, entonces es un buen video...

[desarrollowebcom]

@monagrillero Hola!

No es un tutorial, como tú dices... pero si quieres el vídeo está publicado con explicaciones en la página web DesarrolloWeb [dot] com

Busca por diseño web photoshop en el buscador interno para encontrar bastantes referencias, no sólo el diseño explicado sino cómo implementarlo en HTML y maquetado con CSS.

[monagrillero]

@desarrollowebcom Hola que tal.

Muchas gracias por el dato.

[Genrry]

es buena pero como nesecitas ser mas detallado men

[mackaruchy]

me gusto mucho el video, dices que dura aprox 1 hora y lo aceleraste a 10 minutos... mejor hubiese sido y mas util si lo hubieras subido en 10 partes, nose mas entendible digo yo...

[locurasss]

no pudisteis haberlo dividido en partes de cada 9 minutos cada tutorial de tu pagina de dreamweaver?

[desarrollowebcom]

@locurasss esto lo hemos publicado con explicaciones en DesarrolloWeb:

desarrolloweb [dot] com/articulos/video-explicado-­diseno-web-photoshop.html

[locurasss]

vale gracias

[NEETBUS]

buenisimo el videO hee genial buen diseñadoR el k lo elavorO... xD

jeje xD

sale suscritO xD

[jrons25]

si estoi aqui es porque es desde 0 y ay que ir mas lento, no entendi nada,,,

[cronicasoscuras0]

primera imagen que esta dividida en columnas

como la creo o en que aplicacion se hace, espero y me puedan responder

se los agradeceria mucho

[desarrollowebcom]

@cronicasoscuras0 la primera imagen la hemos sacado del framework 960 grid system. Esto lo tenemos todo explicado en:

desarrolloweb [dot] com/articulos/video-diseno-web­-photoshop.html

También accede al vídeo pero con velocidad más lenta en

desarrolloweb [dot] com/articulos/video-explicado-­diseno-web-photoshop.html

[cronicasoscuras0]

@desarrollowebcom gracias yo soy medio amateur en esto se lo basico, y se que esto me servira

[TheG8Darkness]

eso lo hisiste imagenes y texto nada mas, eso no dan click -.- | mal hecho

[a1caro]

Me gusta la musica como se llama la cancion? el photoshop deberia tener una explicaciones escrita mientras avanza el video, asi uno lo puede seguir mejor..

[TheSeviche]

pinche mentiroso de mierda.

[isaky123]

@TheSeviche Eres un ignorante de mierda panchito cabron. Este hombre a hecho un tutorial igual de bueno que todos los otros. Así que si es mejor que tu haciendo tutos no te rabies. Mentiroso por que? Porque no te explica como subirlo a la web? Porque solo es una imagen? Porque solo es una imagen y tu ignorancia no sabe mirarse más tutos? Me sorprende que haya gente que postee esto. Deberían morir.

[nahudbz1]

Bueno amigo, te felicito y lo necesitava pero creo que deberias ir explicando mientras

[d4m14nF4814n]

Excelente material... Gracias y felicitaciones por el material.

[gadowebcom]

Muy bueno, felicitaciones

[pablo125125125]

habranlo con youtube en html5 y le disminuyen la velocidad, igual creo que este tutorial es muy bueno pero para que pudieran hacer una web funcional a partir de un "bosquejo" en photoshop deberían aprender html por lo menos para empezar

[alcampo22]

Muy buen tutorial y buena pagina de contenidos desarrolloweb

[elojovisor2009]

porque dices que desde cero si no desde cero , pinche mentiroso,!!!!

[palamanz]

lo hiciste muy rapido no lo crees...mejor haslo mas lento la procima vez

[crazyjhonj]

lea la info!

[MrVenomJ]

Buen Tuto!! .__.

Pero esparaba todo paso por paso (Algo mas lento)

5/5

[ACIDTOTAL]

esta en la pagina

[desarrollowebcom]

@MrVenomJ hemos publicado este mismo vídeo más lento y con explicaciones. Lo tienes en youtube [dot] com/watch?v=WYosaJ_2ZGY

[NainiGW]

Un Tutorial magnífico, me ha ayudado mucho en mi proyecto de web. Creo que la gente que se queja de la velocidad del video es porque no tienen ni idea de photoshop y creen que con un tutorial deben aprenderlo todo. Pienso que esto es una guía para gente que ya sabe hacer básicos diseños y quiere hacer algo de web. Para aprender a usar el Photoshop hay muchos otros tutoriales.

Es mi opinión. Y pienso seguir aprendiendo con el tutorial de vuestra web.

[nfajardom]

La música me recordó (guardando las proporciones por supuesto) a Koyaanisquatsi XD

[crstudio7]

wooww muy chullaaa me a encantado muy bueno un 100 de 10..

[kakaypeomix]

Muy Bueno,5.5, pero alguien me podria dar el tema de la cancion, osea como se llama.XDXDXD

[HazaelMx]

Hola, mi duda es como le hacen que para cuando montes la pagina web en el hosting no montes solo una iamagen de la plantilla, si no, que tenga secciones de texto, que se peudan subrayar (no solo ver como iamgen) y poder presioanr los botones y todo eso es lo que no entiendo

[zavaletaster]

haha buen video, muy interesante... cuanta gente comenta aqui idioteces sin saber... bueno queda muy bien la web, ahora me gustaria ver los demas pasos para pasarla a html con el css y todo

[MotifStudio1]

Lo haces un poco lento no crees porque no duplicas la velocidad pinche imbecil

[cesarglzm1994]

entonces esa pagina solo quedaria como una imagen??

[moshgrafart]

mmmm asi como sta hecho como va a entender nadie va todo demasiado rapido

[garzazu1]

creo que soy idiota y no lo entiendo xD, te quedo muy bien pero...¿que finalidad tiene hacer una página en photoshop si despues no la puedes usar porque solo es una imagen... O.o?

[samardj]

Todos los diseñadores de paginas web, entregan el archivo psd (photoshop), a los maquetadores css, estos cortan, las imagenes y extraen las capas del psd para formar la plantilla web, de ahi se la pasan al programador, esto se hace mas que todo en USA, en latinomaerica vemos que un solo individuo se encarga de todo.

[Sebazoldick]

Photoshop puede dar interactividad entre paginas sin problemas, el ideal es diseñar con photoshop y luego dar interactividad con Dreamweaver.

Saludos

[Norsfcw]

BUEN VIDEO.. SI LOS CALIFICARA LES PONDRIA UN 11  jeje

saludos

[guilleget]

como se llama esa cancion?

[GalernaSantander]

Buen video y gracias al equipo de Desarrollo Web por todos los contenidos que nos han servido de tanto a lo largo de los últimos años.

[thehardielgrande]

deve ser un estupido ingnorante que entienda esa cagada que ademas tiene el formato muy rapido.....

[gmcarloncho]

Para mi que esta pagina la diseño Flash

jajajajajajaja......

este video no es para principiantes, solo para aquellas personas que saben de programas para crear paginas Web...

yo si le entendi ps

jejeje.........

[h1984s]

va muy rápida la weá!!

[adserr123]

Pues si... tu video es muy bueno, pero comparto la opinion de todos, va muy rapido y no se puede apreciar bien lo q estas haciendo... si fuera posible que lo seccionaras en varios tutoriales a una velocidad normal, creo que mas de uno te lo agradeceriamos

[elneo3]

excelente pero si hay posibilidad de verlo en su formato original para poder prestar la atencion debida.

Gracaias

[elizaparra]

hola me gustaria la verdad q fuera mas despacio ....si esta muy rapido ....solo queria saber si tu me puedes ayudar con el diseño de una pagina ....porfa gracias .apesar de todo se ve muy bien .

[rafb6]

jajajaajjajajajaa acabo de ver el video y la neta yo si le entendí pero no le veo el por que compartirlo...

[Hannfer]

Y no era mas sencillo hacer varios tutoriales en vez de uno a semejante velocidad?

Nadie se ha enterado de nada y vosotros habeis perdido el tiempo en acelerarlo.

La pena es que tiene buena pinta el tutorial , en fin que se le va a hacer...

[RECSoldier]

Solo una persona de lo mas decerebrada le aumentaria la velocidad a esta clase de tutorial, si no desea que la gente aprenda entonces llevese su egoismo a otro lado y mejor no suba ningun video =)

[skybladezzard1]

Me gustaria que nos explicaras como hacer para activar las casillas, enlaces y demas...

[1988isabela]

q pedo buen video pero lo podrias subir por partes para ver q herramientas utilizas y todo el desmadre porfas no gracias

[lBlackRider]

no entiendo k son esas rayas de atras para k sirven ?

[nekobushi1978]

Deberías nombrar el video: "Como HICE una web en Photoshop" pedaso de pelotuo! Uno busca a modo de guía y tu sales con esta chorrada que me revienta las pelotas. Gilipollas!

[Featlinks]

y como se sube para la web??, contesta porfavor, gracias :)

[hrmza89]

esta chida la rla

[tekieromuchosito]

muy bueno pero si tan solo pudieras hacerlo mas lento para k todos puedan entender lo que estas haciendo seria mejor igual me gusto tu trabajo gracias ojala que puedas subir un video tutoreal explicando los pasos gracias.

[adriancitov7]

eres un makinas tio mas mas mas videoS!!!

[electronicabarrios]

gracias, pero me gustaria ver el video completo sin acelerar.

[googledance]

Excelente tutorial. Podrias decirme con que software has aumentado la velocidad?, es para saber si luego puedo reducir la velocidad

[pumaslp82]

Buen video, pero lo hubieras puesto mas despacio, ni siquiera se ve que herramientas vas usando.

[coyotekite]

el tema de roger subirana se llama Point of no return!! del disco del mismo nombre !

[avertencias]

K CRACK

[carlosmbrizuela]

muy buen video. Como se llama la musica de fondo?

[eriscae]

Entre el minutoi 0:17 y el 0:30 aparece la web del compositor

Si entraís en su página, en Discografía os podeís descargar el albúm completo. Es el del año 2008 y son los dos primeros temas.

Saludos

[elborto33]

Amigo como se llama la banda sonora, muy buena seleccion, gracias.

[bambanx]

Como se llama la musica de fondo me encantooooooooooo aaaaaaaaaaaaaaaaaaaaaaaaaaaaaa­a.

gracias ^^

[ekilogos]

good!

[eriscae]

si está subido a algun servidor ¿Podraís adjuntar el enlace del video original?

[remus0000]

Esta cojonudo es indiscutible, pero uan pregunta, luego para pasarlo a dramweaver  y editar el texto etc.. como se pasa..