Será Que Esse Recurso Fica Muito Pesado Na Pagina?

[AOSHI]

E ai galera beleza!

Eu estou com 2 duvidas...

1-) Eu fiz aquele efeito na minha pagina de quando a pessoa passar o mouse sobre um "mini foto", instanteneamente abre-se a mesma foto em um determinado lugar da pagina, mas com seu tamanho original...

No total deram 64 "mini fotos", 32 "mini fotos" de cada lado, e no meio o espaço em que vào aparecer em sem tamanho original, ou seja, quando o usuario passar o mouse em cima das fotinhos...

Aparentemente, tudo ficou normal no Fireworks! O efeito ficou otimo!!!

O meu unico medo é: será que este recurso não ficara muito pesado na Web?

Caso vocês não tenham entendido o recurso que fiz, deem uma olhada neste linl:

http://fireworks.scriptbrasil.com/?class=14&id=308

(Album de fotos com Thumbs)

2-)E a minha outra duvida é quando exporto este efeito que fiz no Fireworks para o Dreamweaver...

Tipo, eu exportei tudo para o site que estou montando no Dreamweaver, mas quando eu vou jogar este efeito na pagina, aparece uma mensagem dizendo que é necessario copiar alguns arquivos para que este recurso funcione perfeitamente...

Ok, eu já fiz isso! Assim, o Dreamweaver acaba copiando todas as fotos que utilizei no efeito criado a partir do Fireworks para a pasta que exportei inicialmente...

Até aí tudo bem! O problema é que as fotos que o Dreamweaver copiou dentro da pasta, estão no formato PNG.

E se não estou errado, este tipo de arquvo não é muito mais pesado do que as fotos no padrão JPG?

E agora, como eu posso resolver isso?

[Guest Guest]

E ae cara td bom?

1 ) Cara realmente vai ficar muiiito pesado! Porque ele não vai carregar a foto quando o cara passar o mouse e sim no inicio da página. E mesmo que carregasse quando o cara passasse o mouse em cima ia ficar chato ficar esperando toda hora baxxar a foto. Então iria estragar todo o efeito. Quer uma dica?

DICA :Faça no Flash....assimvc pode colocar um LOADER no começo dai fica bem mais legal. Contudo, se você insistir no FW você pode dividir o album em 8 páginas de 8 o que ia melhorar muito a navegação.

2 ) Na verdade o PNG é mais leve e melhor que o JPG pois tem TRANSPARENCIA o que só existe no GIF e TIFF. O problema é que somente browser novos conseguem usa-lo então browsers antigos ficam de fora da parada! hehehe....O que aconselho você a fazer é trasnformar para JPG e no código fonte q você tem no DW você muda de pNG para JPG tb!

abração cara

PS: Post by slipknot...hehehe...eskeci de logar

[phil_rpg]

brother vamos por parte:

1 - esse efeito so ficara pesado dependendo das fotos. o codigo fonte desse tipo efeito não é muito grande.com isso a pagina não fica mt grande.

2 - agora em relação aos arquivos serem png.você altera as fotos para jpg de melhor qualidade. e vai no codigo fonte e altera todas as extensões *.png referentes as fotos para *.jpg

acho que já deu pra entender hein veio????

[AOSHI]

Valeu pela ajuda galera!!!

Só fiquei com uma duvida agora: afinal, será mesmo que este efeito vai pesar muito na minha pagina???

Tipo, quando exportei este efeito pro DreamWeaver, o arquivo ficou num total de 48KB

Hum, se for ver não é muito grande né...

Mas eu acho que pode ter uma falha neste meu pensamento: provavelmente teria que carregar todas as outras fotos, ou seja, as fotos em tamanhos reais né?

Hum, se bem que cada foto tem + ou - uns 15 KB.

Só me expliquem uma coisa: quando eu dou um F12 no Dreamweaver para visualizar a pagina na Web, o tempo de loading fica entre uns 20 segundos para a pagina abrir por completo!

Significa que se esta pagina estivesse realmente online, o tempo de download seria parecido ou não tem nada a ver?

Mais uma vez agradeço pela ajuda de vocês amigos e desculpem por ficar enchendo o saco toda hora...

[Indrema DS]

Só para frizar...

Não compare o tempo de abertura do preview do Dreamweaver no seu navegador com o tempo que levaria para faze-lo na internet, afinal o DW grava os arquivos na pasta temporária do sistema, que é acessada muito mais rapidamente do que na NET.

Uma dica que posso te dar, é você observar na barra de status do Dreamweaver, se notar bem existe uma seção que calcula o tempo de download dos seus gráficos, pode valiar bem só observando esse recurso. ( Você pode inclusive editar configurações - como a velocidade de conexão - para os testes no menu Editar > Preferencias )

P.s: A dica do Flash não é nada mau ! Mas não desista antes de tentar outros recusos que domine melhor ok ?!

[AOSHI]

Só para frizar...

Não compare o tempo de abertura do preview do Dreamweaver no seu navegador com o tempo que levaria para faze-lo na internet, afinal o DW grava os arquivos na pasta temporária do sistema, que é acessada muito mais rapidamente do que na NET.

Uma dica que posso te dar, é você observar na barra de status do Dreamweaver, se notar bem existe uma seção que calcula o tempo de download dos seus gráficos, pode valiar bem só observando esse recurso. ( Você pode inclusive editar configurações - como a velocidade de conexão - para os testes no menu Editar > Preferencias )

P.s: A dica do Flash não é nada mau ! Mas não desista antes de tentar outros recusos que domine melhor ok ?!

Valeu pela dica veio!

Só me responde uma coisa: onde esta exatamente esse recurso que calcula o tempo de download das paginas?

Eu observei a barra de status e não consegui ver este recurso...

[Indrema DS]

Dê uma olhada...

http://indrema.tripod.com.br/exemplo.htm

[AOSHI]

Valeu pela ajuda amigo Indrema DS, mas infelizmente não consegui visualizar o link que você me passsou...

Hum, será que esta correto?

Hehehe, deixa pra la...

Se não for pedir muito, não teria como você me responder apenas + duas duvidas?

Tipo, eu estou pensando em tirar esse efeito e colocar no lugar aquele em que o usuario clica apenas na figura em miniatura e em seguida a fotoa parece no lugar onde inseri a fatia principal , ou seja, o lugar onde a figura aparecerá com seu tamanho original...

Hum, caso eu faço isso, a pagina terá um tempo de loading menor ou será a mesma coisa igual ao outro efeito?

E minha ultima duvida é a seguinte: nas "mini fotos", eu quero colocar um efeito que quando o usuario passar o mouse por cima, as bordas das imagens mudem de cor!!!

Atualmente minhas fotos estão com as bordas em branco, e pretendo que quando o mouse passar por cima de um determinada "mini foto", esta mude o borda para a cor azul, entendeu?

O que eu quero saber é como eu posso fazer isso?

Tipo, uma maneira não poderia ser: converter a borda da foto em um simbolo de botão? Depois disso, só bastaria criar o efeito né?

Obs: as fotos não possuem borda, eu simplesmente criei um retangulo e coloquei atras das fotos e depois as agrupei...

Caso meu raciocinio esteja certo, surge uma outra duvida!

Criar varios simbolos de botão, podem pesar muito a pagina?

[Indrema DS]

Eu odeio esse Tripod Grrrrrrrr ! Foi mau pelo link AOSHI, mas tenta novamente outra hora, essa droga de servidor vai e vem constantemente...

Bom,

Primeiro uma pergunta: Você vai criar isso no Fireworks ou Dreamweaver usando frames ? É só pra saber mesmo, pois na verdade dá na mesma, pois as fotos serão carregadas só quando requisitadas, neste caso quando o usuário chamar o link clicando na miniatura. ( Se for fazer no DW atente-se no "target" dos links, que deve mirar o frame correto ) Eu particularmente acho sua idéia melhor, pois o carregamento se centrará apenas nas fotos escolhidas, e as que ele já visualizou estarão no cache do browser, diminuindo ainda mais o tempo de carregamento delas.

Para fazer o efeito do Rollover nas miniaturas é bem fácil, basta desenhar uma fatia sobre eles ( Ou seleciona-los, ir no menu EDITAR > INSERIR > FATIA, é mais exato ), clicar sobre o behavior de cada uma ( Aquela bolinha branca sobre a fatia ) com o botão direito do mouse e escolher a opção " Adicionar Efeito rollover simples", assim você já configura para que quando o usuário passe o mouse por cima da miniatura, esta mude para sua equivalente no frame 2 .( Moldura no FW nacional ) Então você irá até a janela molduras ( frames, basta teclar SHIFT + F2 ) adicionará uma nova, clicando no botãozinho "+" que tem por lá, e desenhará como a miniatura ficará quando o mouse estiver sobre ela, neste caso você vai copiar a mesma miniatura encontrada no frame 1 e mudar sua borda.

Não existe mal algum em converter cada miniatura dessa em botão, apenas atente-se que cada botão, e cada estado é uma imagem a carregar, no método que expliquei - ou tentei na verdade - você gera apenas duas imagens para cada uma.

Olha, me perdoa mas eu sou péssimo em minhas explicações, mas tenta fazer e qualquer dúvida poste novamente. Porém vou te dar uma dica: Cara, libera tua imaginação, não se preocupe com aspectos técnicos ainda, apenas pense como serão os efeitos, depois dicutimos como tornar isso portável para diversos casos, voa ! Voa mesmo, libera o brainstorm, só depois cai na real do trabalho, chato, mas com a certeza que imaginou coisas grandes e valeu a pena !

P.S: "AOSHI"do seu nick é aquele chefe do Oniwanbashu do Samurai X ? Cara aquele desenho é muito piração hehehehheh !

[AOSHI]

Eu odeio esse Tripod Grrrrrrrr ! Foi mau pelo link AOSHI, mas tenta novamente outra hora, essa droga de servidor vai e vem constantemente...

Bom,

Primeiro uma pergunta: Você vai criar isso no Fireworks ou Dreamweaver usando frames ? É só pra saber mesmo, pois na verdade dá na mesma, pois as fotos serão carregadas só quando requisitadas, neste caso quando o usuário chamar o link clicando na miniatura. ( Se for fazer no DW atente-se no "target" dos links, que deve mirar o frame correto ) Eu particularmente acho sua idéia melhor, pois o carregamento se centrará apenas nas fotos escolhidas, e as que ele já visualizou estarão no cache do browser, diminuindo ainda mais o tempo de carregamento delas.

Para fazer o efeito do Rollover nas miniaturas é bem fácil, basta desenhar uma fatia sobre eles ( Ou seleciona-los, ir no menu EDITAR > INSERIR > FATIA, é mais exato ), clicar sobre o behavior de cada uma ( Aquela bolinha branca sobre a fatia ) com o botão direito do mouse e escolher a opção " Adicionar Efeito rollover simples", assim você já configura para que quando o usuário passe o mouse por cima da miniatura, esta mude para sua equivalente no frame 2 .( Moldura no FW nacional ) Então você irá até a janela molduras ( frames, basta teclar SHIFT + F2 ) adicionará uma nova, clicando no botãozinho "+" que tem por lá, e desenhará como a miniatura ficará quando o mouse estiver sobre ela, neste caso você vai copiar a mesma miniatura encontrada no frame 1 e mudar sua borda.

Não existe mal algum em converter cada miniatura dessa em botão, apenas atente-se que cada botão, e cada estado é uma imagem a carregar, no método que expliquei - ou tentei na verdade - você gera apenas duas imagens para cada uma.

Olha, me perdoa mas eu sou péssimo em minhas explicações, mas tenta fazer e qualquer dúvida poste novamente. Porém vou te dar uma dica: Cara, libera tua imaginação, não se preocupe com aspectos técnicos ainda, apenas pense como serão os efeitos, depois dicutimos como tornar isso portável para diversos casos, voa ! Voa mesmo, libera o brainstorm, só depois cai na real do trabalho, chato, mas com a certeza que imaginou coisas grandes e valeu a pena !

P.S: "AOSHI"do seu nick é aquele chefe do Oniwanbashu do Samurai X ? Cara aquele desenho é muito piração hehehehheh !

Putz, valeu mesmo pela explicação amigo Indrema DS!!!

Ual, você realmente me deu dicas preciosas!!!

Eu agradeço muito!!!

Quanto as suas perguntas, eu vou criar isso no Fireworks, mas pretendo usar frames no Dreamweaver...

Ah, esse nick AOSHI realmente eu tirei do Samurai X...

Hehehe, é isso mesmo, o AOSHI é o lider do grupo Oniwanbashu!!!

Huahauhauahau, eu sou viciado em animes!!!!!!

Mais uma vez obrigado por sua ajuda amigo!

P.S: quando eu terminar esse efeito no fireworks, eu posto aqui no forum pra você opinar se gostou ou não, ok!!!

[Indrema DS]

Ficaremos esperando Aoshi, e se precisar de ajuda em uma futura página do Samurai X pode contar comigo heheheeh

[AOSHI]

Ficaremos esperando Aoshi, e se precisar de ajuda em uma futura página do Samurai X pode contar comigo heheheeh

Hehehe, valeu amigão!!!