PSD para XHTML

[paulo_roll 0]

E ae pessoal.

 

Estou querendo me tornar cada vez mais rápido para converter meus designs do Photoshop para

XHTML.

 

Achei interessante fazer o Design no Photoshop com o Blueprint.

Depois colocaria a biblioteca do Blueprint em uma pasta, exportaria somente as imagens

do Photoshop e faria o XHTML no Dreamweaver aplicando a estrutura que o Blueprint oferece.

 

Alguem tem uma maneira mais rapida de fazer isso e com código limpo?

Time is money e os clientes estão pagando pouco.

 

Parte pro Wordpress?

 

Mesmo que seja Wordpress existira essa parte da

conversão, ou seja Photoshop com Dreamweaver

[Ted k' 126]

O Wordpress é uma ferramenta de gerenciamento do sistema, não vai acelerar seu processo de front-end pois o WP é back-end então nada haver!

 

Sobre o que está usando no Photoshop eu não conhecia esse técnica, minha dica para "o cliente está pagando pouco" é:

 

Se ele paga pouco, o layout também não deve ter tantos detalhes, precisa ser algo mais simples e mais objetivo, assim você pode ser mais rápido na parte do front-end, com códigos limpos e objetivos, nada de muita animações em javascript, ou efeitos muito complicados no CSS.

[paulo_roll 0]

O Wordpress é uma ferramenta de gerenciamento do sistema, não vai acelerar seu processo de front-end pois o WP é back-end então nada haver!

 

Sobre o que está usando no Photoshop eu não conhecia esse técnica, minha dica para "o cliente está pagando pouco" é:

 

Se ele paga pouco, o layout também não deve ter tantos detalhes, precisa ser algo mais simples e mais objetivo, assim você pode ser mais rápido na parte do front-end, com códigos limpos e objetivos, nada de muita animações em javascript, ou efeitos muito complicados no CSS.

 

 

Por isso parti pra um esquema de cobrar pouco para fazer o site, porém manter um lucro

com mensalidades, o que torna nossos lucros bem mais previsíveis, sendo mais fácil de

convencer o cliente a fechar na negociação.

 

A curto prazo o lucro é pouco, mas com uma carteira de clientes, poderemos formar bons

salários tornando essa uma profissão interessante e rentável, já que muitos não souberam

cobrar ao longo dos anos. É assim que vi algumas agências crescendo. Fidelizando clientes

com mensalidades. Tem designer que não gosta de fazer isso. Azar de quem pensa assim.

 

Por isso não faço questão de fazer um Design simples para cliente que paga pouco, pois

não me ajudaria muito no portfolio.

 

O que seria interessante para todos, seria uma rápida velocidade de conversao PSD para

XHTML com designs arrojados. Quanto mais bonito nosso portfólio, mais mensalidades!

 

A técnica usando o Guide do Blueprint no Photoshop e depois aplicar o CSS do Blueprint

no Dreamweaver ajuda, porém estou atrás de uma técnica melhor. Já pensei em pagar aqueles

serviços de conversão que oferecem resultados profissionais, porém ficariam caros, já que

o site terá mais de uma página, claro.

 

Por enquanto ainda estou me matando pra desenhar e converter, estou atrás de técnicas

que me deêm uma conversao dentro dos padroes W3C em um prazo EASY & QUICK. Até achei

uns plugins pra Photoshop que exportam pra XHTML de acordo com os nomes das camadas, mas

ainda deixa a desejar no código.

 

Quanto a essa solução estou até disposto a pagar por um software profissional que faça

alguma conversão quase que instantânea.

 

Quem souber poste aí.

 

Obrigado pelo interesse em ajudar na busca dessa solução, Ted k'

 

Abraço.

[Ted k' 126]

Com certeza essas técnicas que você está usando vai deixar a desejar, não têm muito jeito, se quer colocar os padrões da W3C, cara, vai ter que desenvolver o front-end, validar o código é chato, você me disse que quer criar portfolio, pense bem, se o cliente paga pouco, precisa realmente fazer um serviço pouco, mas já que você quer fazer um mega design para seu portfolio, eu acho uma boa, parabéns por isso, mas o cliente vai ver o código também? Os futuros clientes também?

 

Pense bem,se você quer fazer tudo, design + front-end, uma coisa não vai sair muito bem, ninguém é um faz tudo 100%, invista no seu design, criei bom portfólio, e com o tempo você vai com calma organizando o código!

 

Quer fazer design + front-end em pouco tempo e sair 100%? Complicado, precisa de muita prática, tenha cuidado com isso!

 

Boa sorte em tudo :)

[William Bruno 1501]

seria uma rápida velocidade de conversao PSD para

XHTML com designs arrojados.

Desculpe a curiosidade, mas hoje com essa técnica. Qnto tempo você leva para recortar um layout ?(entregar o html dele, contando o tempo de usar o blueprint)

[paulo_roll 0]

Recortar um Layout de 1 página simples e converter para XHTML no bloco de notas, de 4 a 5 horas contando

todas as dores de cabeça do CSS.

 

No Blueprint ainda não cheguei a aplicar em um projeto, mas já analisei projetos prontos e esse tempo diminuiria

para umas 3 horas e um Design simples. Porem um sofisticado ia dar muita dor de cabeça.

 

Analisando as opções e como o Ted k' falou melhor não se preocupar muito com o código se for o caso para

ter um bom portfólio, porem sou preocupado com a indexação do google. Gostaria de colocar tudo dentro de suas

<h1> e <p>. Difícil é associar um código limpo em um design arrojado em um curto prazo.

[Ted k' 126]

Preocupado com o google, SEO / SEM ?

 

Melhor fazer na mão mesmo!

[paulo_roll 0]

Na mão foi o que sempre fiz, mas o tempo/valor não vale a pena.

 

Estou correndo atrás de alternativas que diminua para uma conversao aceitável de 20 minutos por página.

Parece milagorso, mas talvez o conjunto de técnicas ou ferramentas pode fazer isso acontecer. Estou correndo

atrás.

 

Achei uma página que já pode facilitar na criação da estrutura do código.

Voce ajustas os "quadradinhos" de acordo com seu layout, nomeia e ele gera as divs com os nomes. Acho que pode

ser uma das ferramentas que podem ajudar no processo.

http://constructyourcss.com/

 

Outra ferramenta é o PSD Breaker.

É um plugin para o Photoshop que exporta para XHTML criando divs com o nome das camadas.

Ainda não testei direito, mas a exportação parece que tem a identação meio suja (aceitavel), mas

parece que o plugin tem limitaçoes para versao nao paga.

http://psdbreaker.com/

 

Mais uma ferramenta é o Simple CSS.

Você tem uma tela onde atraves de uma interface cria classes e ids facilmente.

http://www.superdownloads.com.br/download/91/simple-css/

 

 

Estou sem tempo para testar isso, pois estou em um projeto pessoal, porém pretendo testar ou propor alguem

avaliar se vale a pena:

 

Fazer o Design no Photoshop usando o Blueprint, já organizando as pastas do .PSD com o nome das divs para ficar

mais fácil.

 

Depois utilizar o CSS Contructor "os quadradinhos" para criar somente a estrutura da página, pegando os nomes

das pastas do .PSD. Só olhar e copiar.

 

Depois abrir o XHTML gerado pelo CSS constructor no Dreamweaver e aplicar as classes de estrutura do blueprint.css

que será de acordos com as guides do PSD.

 

depois usar o Simple CSS para aplicar cores para classes.

 

 

Foi uma sugestão, quem tiver outras idéias é só postar.

 

Valeu.