Ajuda - Busca - Membros - Calendário
Versão Completa: Será Que Esse Recurso Fica Muito Pesado Na Pagina?
Fórum Script Brasil > Arte & Design > Fireworks
AOSHI
E ai galera blz! laugh.gif
Eu estou com 2 duvidas... huh.gif

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... rolleyes.gif
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... smile.gif
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 vcs 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... blink.gif
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 ja 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. unsure.gif
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
E ae cara td bom?

1 ) Cara realmente vai ficar muiiito pesado! Porque ele não vai carregar a foto qdo o cara passar o mouse e sim no inicio da página. E mesmo que carregasse qdo 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 vc 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 vc a fazer é trasnformar para JPG e no código fonte q vc tem no DW vc 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.vc 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 ja deu pra entender hein veio????
AOSHI
Valeu pela ajuda galera!!! laugh.gif
Só fiquei com uma duvida agora: afinal, será mesmo que este efeito vai pesar muito na minha pagina??? blink.gif
Tipo, quando exportei este efeito pro DreamWeaver, o arquivo ficou num total de 48KB unsure.gif
Hum, se for ver não é muito grande né... tongue.gif
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. smile.gif
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? rolleyes.gif
Mais uma vez agradeço pela ajuda de vcs amigos e desculpem por ficar enchendo o saco toda hora... tongue.gif
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 ?! wink.gif

AOSHI
QUOTE
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... sad.gif
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 vc me passsou... sad.gif
Hum, será que esta correto? rolleyes.gif
Hehehe, deixa pra la... laugh.gif
Se não for pedir muito, não teria como vc me responder apenas + duas duvidas? tongue.gif

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... unsure.gif
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... smile.gif
Caso meu raciocinio esteja certo, surge uma outra duvida! mad.gif
Criar varios simbolos de botão, podem pesar muito a pagina? ph34r.gif
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 ! wink.gif


P.S: "AOSHI"do seu nick é aquele chefe do Oniwanbashu do Samurai X ? Cara aquele desenho é muito piração hehehehheh !
AOSHI
QUOTE
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!!! biggrin.gif
Ual, vc realmente me deu dicas preciosas!!! smile.gif
Eu agradeço muito!!! laugh.gif
Quanto as suas perguntas, eu vou criar isso no Fireworks, mas pretendo usar frames no Dreamweaver... wink.gif
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!!!!!! laugh.gif
Mais uma vez obrigado por sua ajuda amigo! biggrin.gif

P.S: quando eu terminar esse efeito no fireworks, eu posto aqui no forum pra vc 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 biggrin.gif
AOSHI
QUOTE
Ficaremos esperando Aoshi, e se precisar de ajuda em uma futura página do Samurai X pode contar comigo heheheeh


Hehehe, valeu amigão!!! biggrin.gif
Esta é uma versão simplificada de nosso conteúdo principal. Para ver a versão completa com maiores informações, formatação e imagens, por favor clique aqui.
Invision Power Board © 2001-2012 Invision Power Services, Inc.