← UI & UX Design

PSD TO HTML

Lida 9379 vezes

Offline

bushnypt 
Membro
Mensagens 324 Gostos 0
Troféus totais: 29
Trófeus: (Ver todos)
Windows User Super Combination Combination Topic Starter 10 Poll Votes Poll Voter Level 5 Level 4 Level 3 Level 2

Como converter um template .psd para html ..
alguem sabe.. ??
Offline

cenourinha 
Elite
Mensagens 4094 Gostos 21
Troféus totais: 34
Trófeus: (Ver todos)
Mobile User Apple User Level 6 Super Combination Combination Topic Starter 10 Poll Votes Poll Voter Level 5 Level 4

Cortas com a clice tool, e depois vais a File > Save For Web selecionas *gif e salvas como "Save HTML and Images"

 8)
Offline

OFFICER 
Membro
Mensagens 2076 Gostos 0
Troféus totais: 29
Trófeus: (Ver todos)
Super Combination Combination Topic Starter 10 Poll Votes Poll Voter Poll Starter Level 5 Level 4 Level 3 Level 2

Citação de: "cenourinha"
Cortas com a clice tool, e depois vais a File > Save For Web selecionas *gif e salvas como "Save HTML and Images"

 8)


É isso que o cenourinha disse, só não te aconselho a gravar as imagens em .gif pois .gif para mim ainda consegue ser pior que .jpg.

Eu gravo sempre em .png excepto as que tenham transparência, nesse caso gravo em .gif, mas se queres que fique ULTRA LEVE gravas em .jpg ;)
Offline

cenourinha 
Elite
Mensagens 4094 Gostos 21
Troféus totais: 34
Trófeus: (Ver todos)
Mobile User Apple User Level 6 Super Combination Combination Topic Starter 10 Poll Votes Poll Voter Level 5 Level 4

Citação de: "OFFICER"
Citação de: "cenourinha"
Cortas com a clice tool, e depois vais a File > Save For Web selecionas *gif e salvas como "Save HTML and Images"

 8)


É isso que o cenourinha disse, só não te aconselho a gravar as imagens em .gif pois .gif para mim ainda consegue ser pior que .jpg.

Eu gravo sempre em .png excepto as que tenham transparência, nesse caso gravo em .gif, mas se queres que fique ULTRA LEVE gravas em .jpg ;)


Eu disse, porque eu tenho sempre coisas transparentes...

 :D
Offline

OFFICER 
Membro
Mensagens 2076 Gostos 0
Troféus totais: 29
Trófeus: (Ver todos)
Super Combination Combination Topic Starter 10 Poll Votes Poll Voter Poll Starter Level 5 Level 4 Level 3 Level 2

cenourinha, mas não precisas de ter tudo em .gif! Basta selecionares a imagem com transparência em .gif e o resto pode estar em .png ou .jpg não sabias? lol
Offline

asturmas 
Administrador
Mensagens 19734 Gostos 49
Feedback +2

Troféus totais: 39
Trófeus: (Ver todos)
Mobile User Windows User Super Combination Combination Topic Starter 100 Poll Votes 50 Poll Votes 10 Poll Votes Poll Voter Poll Starter

Como se fax isso officer?
Offline

tbk22 
Membro
Mensagens 1268 Gostos 0
Troféus totais: 29
Trófeus: (Ver todos)
Super Combination Combination Topic Starter 10 Poll Votes Poll Voter Poll Starter Level 5 Level 4 Level 3 Level 2

Eu nao faço assim, eu faço, no imageready, save optimized as > html and images
Offline

frankjonas 
Membro
Mensagens 108 Gostos 0
Troféus totais: 25
Trófeus: (Ver todos)
Level 5 Super Combination Combination Topic Starter Poll Voter Poll Starter Level 4 Level 3 Level 2 Level 1

OFFICER, o png nao dá para transparencias também??
Offline

OFFICER 
Membro
Mensagens 2076 Gostos 0
Troféus totais: 29
Trófeus: (Ver todos)
Super Combination Combination Topic Starter 10 Poll Votes Poll Voter Poll Starter Level 5 Level 4 Level 3 Level 2

Citação de: "frankjonas"
OFFICER, o png nao dá para transparencias também??


Sim, dá, mas tu deves fazer um website a contar com TODOS os Browsers existentes e no caso de IE6 ou inferior as tranparências em png não existem! Daí teres que usar gif que é uma boa porcaria..lol perde muita cor!

Citação de: "asturmas"
Como se fax isso officer?


Quando vais a save for web... tens a opção de selecionar todos para uma só extenção, mas se clicares em uma só slice, podes selecionar que extenção de imagem queres SÓ para essa slice..ficando uma .gif e o resto .png por exemplo..se não perceberes posso fazer 1 tuto de video ;)
Offline

MarKo 
Administrador
Mensagens 4610 Gostos 10
Feedback +1

Troféus totais: 37
Trófeus: (Ver todos)
Level 6 Windows User Super Combination Combination Topic Starter 50 Poll Votes 10 Poll Votes Poll Voter 10 Polls Poll Starter

Quando o +Webmasters estiver a funcionar é que vai ser um "mimo" com montes de tutoriais sobre isto.
Eu por acaso, uso o slice e faço "save for web" e gravo em .jpg e depois coloco dentro de tabelas não salvo como image and html, nem sabia que isso existia.
Offline

asturmas 
Administrador
Mensagens 19734 Gostos 49
Feedback +2

Troféus totais: 39
Trófeus: (Ver todos)
Mobile User Windows User Super Combination Combination Topic Starter 100 Poll Votes 50 Poll Votes 10 Poll Votes Poll Voter Poll Starter

Citação de: "MarKo"
Quando o +Webmasters estiver a funcionar é que vai ser um "mimo" com montes de tutoriais sobre isto.
Eu por acaso, uso o slice e faço "save for web" e gravo em .jpg e depois coloco dentro de tabelas não salvo como image and html, nem sabia que isso existia.

Isso e ke vai ser bom  :D
Offline

tbk22 
Membro
Mensagens 1268 Gostos 0
Troféus totais: 29
Trófeus: (Ver todos)
Super Combination Combination Topic Starter 10 Poll Votes Poll Voter Poll Starter Level 5 Level 4 Level 3 Level 2

Citação de: "MarKo"

Eu por acaso, uso o slice e faço "save for web" e gravo em .jpg e depois coloco dentro de tabelas não salvo como image and html, nem sabia que isso existia.


Eu sempre fiz assim!!

Nunca fiz de outra maneira...

Grava loogo todas as imagens e o html principal pra uma pasta...

Como e que voces fazem?'
Offline

helt 
Membro
Mensagens 111 Gostos 0
Troféus totais: 25
Trófeus: (Ver todos)
Super Combination Combination Topic Starter Poll Voter Level 5 Level 4 Level 3 Level 2 Level 1 100 Posts

Eu prefiro salvar as imagens uma a uma (load selection from layer ou select->new image->copy from clipboard). Assim tenho um maior controlo sobre as imagens e o html gerado, incluindo a aplicação de css e interacção com php quando é o caso.
Quanto a formatos de imagem, o PNG8 para imagens pequenas é o ideal, para imagens com transparência tem de ser forçosamente o GIF, como foi aqui dito, o IE ainda não suporta a transparência do PNG. Para imagens maiores ou imagens com mais de 256 cores o melhor é usar o JPEG.
Offline

tbk22 
Membro
Mensagens 1268 Gostos 0
Troféus totais: 29
Trófeus: (Ver todos)
Super Combination Combination Topic Starter 10 Poll Votes Poll Voter Poll Starter Level 5 Level 4 Level 3 Level 2

Citação de: "helt"
Eu prefiro salvar as imagens uma a uma (load selection from layer ou select->new image->copy from clipboard). Assim tenho um maior controlo sobre as imagens e o html gerado, incluindo a aplicação de css e interacção com php quando é o caso.
Quanto a formatos de imagem, o PNG8 para imagens pequenas é o ideal, para imagens com transparência tem de ser forçosamente o GIF, como foi aqui dito, o IE ainda não suporta a transparência do PNG. Para imagens maiores ou imagens com mais de 256 cores o melhor é usar o JPEG.


Mas o JPeg tb suporta transparencias ou nao?
Offline

helt 
Membro
Mensagens 111 Gostos 0
Troféus totais: 25
Trófeus: (Ver todos)
Super Combination Combination Topic Starter Poll Voter Level 5 Level 4 Level 3 Level 2 Level 1 100 Posts

não