Bruno Dulcetti



Arquivos:

Categorias:

  • Amizade:

  • Artigos

  • Links:

    O meu, o seu, o nosso espaço!

    » Portal Globo.com lança sua nova home

    Imagem da Nova Home da Globo.com

    É com grande prazer que venho informar à vocês, que está no ar a Nova Home da Globo.com.

    Totalmente mais leve, pensando no usuário, sem imagens desnecessárias. Agora grande parte, as mais importantes, são feitas com texto.

    Mais espaço.

    Agora a home está com o espaço relativo à resolução 1024×768px, tendo mais espaço para o conteúdo, espaço para a “informação respirar”.

    Tudo isso foi pesquisado, com testes de usabilidade com usuários, entrevistas, entre outras coisas. Eu pude acompanhar alguns testes de usabilidade, é uma experiência bem interessante. Sempre que puder veja um, vale a pena.

    Novidades

    Fora que o plantão de notícias ganha mais destaque na home, fora o espaço para as promoções, etc. O usuário também terá acesso direto à algumas rádios online da Globo, horóscopo, cotações do dólar, programação da TV Globo, entre outras coisas.

    Presente também, a nuvem de tags, com as palavras mais buscadas no Portal, com o peso equivalente para as mais buscadas e menos buscadas. força também aos Blogs da Globo, possuindo um box só para as últimas postagens dos principais blogs.

    Ganham destaque também outras ferramentas e aplicativos, como blogs de colunistas, o fotolog 8P e o Globo Vídeo Chat, além do ranking dos programas mais acessados no site Baixatudo.

    Arquitetura e Organização Visual

    A organização das informações continuam em evidência, com as informações de notícias em vermelho, entretenimento em laranja e esportes em verde, ficando claro e fácil o entendimento e identificação de cada tipo de informação.

    Tudo está com bastante espaço, para o conteúdo respirar, nenhuma informação sufocada, nada muito perto, tudo num espaço relativamente razoável e pensado milimétricamente (ou pixélicamente?).

    Agora está mais fácil de identificar o que é link e o que é texto. Praticamente tudo que for cinza, eh texto normal e o que tiver cor, é um link.

    Um destaque também para a barra superior, o famoso Topo :D. Houve uma mudança bem radical nessa área do site, que é uma das principais, pois é onde o usuário põe o olho de primeira. Em cada área específica do site, a opção ficará realçada, com uma cor mais clara e com uma altura maior, mostrando ao usuário em qual seção, onde ele está.

    Acessibilidade

    Boa parte do projeto foi pensado na acessilibidade. Testamos tudo sem suporte à imagens, sem CSS habilitado, javascript desabilitado, etc. Tudo para que o site fique mais acessível, não só para pessoas com deficiência, mais para dispositivos móveis também.

    Em breve, haverá melhorias na parte do CSS de impressão, que ainda não está 100%.

    Participação

    Implementei boa parte do HTML, somente a página de Todos os sites e alguns boxes da home que acabei não participando por ter torcido o tornozelo e ficando uma semana fora do trabalho, com isso, outro rapaz, meu camarada Kenji, acabou pegando essa parte.

    Toda parte de HTML, CSS e um pouco de Javascript, concluído, verificado, validado, refeito, refeito novamente. Foi um trabalho árduo, que durou uns dois meses para ser concluído.

    Foi criado um documento de Boas Práticas de Implementação, tanto de CSS, HTML e JS, tudo publicado no wiki interno da empresa, para todos estarem cientes de cada alteração e informação adicionada.

    Fiquei bem feliz quando soube que seria o responsável na implementação e estruturação da Nova Home.

    Finalizando

    Alguns não gostaram de cara, está mais “pobre” visualmente falando, mas não acho tanta coisa. Hoje em dia o design não é tão levado em conta. Hoje, a informação, o conteúdo, estruturação, estão em alta, fora a leveza, rapidez no carregamento, entre outras coisas.

    Mas provavelmente, com o tempo e o costume, os usuários começarão a se acostumar com a nova cara.

    Eu gostei. E você?

    Aquele abraço.

    [UPDATE]

    Vou postar aqui links que estão falando sobre o lançamento da nova home:

    E só pra constar, eu só implementei o código, não fiz o layout do Portal não ;).

    [/UPDATE]

    Tags BlogBlogs: [ 1024×768, acessibilidade, bbb, bruno-dulcetti, criações, css, desafio, desenvolvimento, ferramentas, globo, globo.com, html, internet, layout, pessoais, tecnologia, usabilidade, xhtml ]
    [ 30/Ago/2007 às 2:28hrs ] [ Por Bruno Dulcetti ] Comentários 43 Comentários |

    Categorias: Criações, Pessoais, Tecnologia, Webstandards

    » Meta Tags. Quais e como utilizar na sua página.

    E ae cambada.

    Hoje falarei sobre a utilização das meta-tags em sites, blogs, etc. É uma utilização simples, mas que muitas pessoas têm duvidas sobre como proceder, quando utilizar tais metas, entre outras dúvidas.

    Tentarei falar sobre algumas das principais metas, pelo menos em minha opinião. Mas claro que vocês podem comentar sobre outras metas tags, outros tipos de funcionamento ou algum erro descrito por aqui.

    O que são essas metas tags?

    São parâmetros dentro do html, que foram criados para facilitar a vida dos buscadores web (Google, Yahoo, MSN, etc), incluindo-os nos seus respectivos bancos de dados. Com elas você também pode assinar o site que você criou, fazer redirecionamentos, entre outras coisas.

    Sucesso! Mas como devo utilizá-las?

    Mole, mole. Coloque-as entre as tags <head> e </head> da sua página HTML.

    E quando devo utilizá-las?

    Sempre, pelo menos é a minha opinião :D Em todas as páginas devemos colocar as metas tags, tanto páginas principais quanto páginas internas. Sua inclusão auxilia e ajuda na aparição nos buscadores web.

    Hmmm… Legal Bruno, mas poderia explicar melhor?

    Claro, claro. Tentarei explicar um pouco melhor sobre as metas tags, cada uma delas, pelo menos as principais que irei explica aqui.

    Explicações Gerais:

    A tag meta tem um atributo obrigatório, o content. Este atributo recebe o conteúdo em texto, etc. O seu conteúdo refere-se a outro atributo, que pode ser o name ou o http-equiv, por isso que é a único obrigatório.

    Pra entender melhor, dois atributos seriam obrigatórios, o content mais o atributo name ou o atributo http-equiv.

    Atributos Opcionais

    São três os atributos opcionais:

    • http-equiv: Seus valores podem ser content-type, expires, refresh e set-cookie. Seus valores, geralmente influenciam no conteúdo do site, redirecionamento, etc.
    • name: author, description, keywords e generator. Seus valores influenciam nos buscadores, informações sobre a construção do site, etc.
    • scheme: atributo pouco utilizado e pouco comentado. Com ele você definir o tipo de conteúdo inserido no atributo content. Por exemplo, você define:

      <meta name="DC.identifier" content="http://www.brunodulcetti.com/" scheme="URL" />
      Este exemplo eu estou dizendo que o atributo name que recebe DC.identifier, recebe o conteúdo como uma URL, definido no atributo scheme e pega o valor do atributo content, que no caso é meu site.

    Agora lá vem as metas tags que utilizam o atributo http-equiv.

    As meta-tags que contenham o atributo http-equiv são usadas para controles corresponde ntes as chamadas HTTP. Alguns buscadores não diferenciam os valores nos atributos “name” ou “http-equiv”.

    <meta http-equiv=”expires” content=”Tue, 17 Oct 2006 06:16:00 GMT” />

    Utilizado para informar ao navegador quando a página expirará. Seu uso também pode referir-se ao cache do usuário, por exemplo, se a página expirou, o navegador fará uma nova requisição no servidor, com isso, fazendo um novo “download” da página.

    Você pode colocar um valor 0 (zero), que fará com que o navegador SEMPRE faça uma nova requisição, ignorando o cache.

    Também serve para os buscadores validarem a página, que faz com que os buscadores atualizem o conteúdo do site dentro dos registros do BD dos próprios.

    <meta http-equiv=”content-type” content=”text/html; charset=UTF-8″ />

    Essa é velha conhecida da galera (pelo menos deveria ;) ). Ela diz qual o conjunto de caracteres será utilizado dentro da página.

    A parte do content, temos o tipo de conteúdo da página. No caso acima, citei o html, temos também o application/xhtml+xml e o application/xml, que significam respectivamente a utilização do xHTML com XML e apenas o XML na página.

    No charset, você define a codificação do conteúdo da página. O mais comum é o iso-8859-1, mas temos também o UTF-8 que é bastante utilizado e foi o que eu utilizei no exemplo.

    <meta http-equiv=”refresh” content=”3;URL=http://www.brunodulcetti.com/index.php” />

    Alguns desconhecem este recurso, muitas pessoas às vezes querem fazer um refresh na mesma página ou então fazer um redirecionamento para uma nova página. Vemos isso em sites de notícias que são atualizados num pouco espaço de tempo, sites que mudaram o endereço e redirecionam para a url correta, entre outros exemplos.

    Isto pode ser feito com apenas uma linha. Primeiro vemos o valor Refresh, que nem preciso explicar o que é isso ;) , depois temos o atributo content, que contém um número, neste caso o número 3, que significa a quantidade de segundos que o site esperará até ser feito o refresh novamente. Depois vemos, dentro do atributo content, um sub-atributo URL, que dirá a página que será chamanda. Pode ser a mesma, caso seja o exemplo da página de notícias, ou uma nova, caso seja a mudança de url do site.

    <meta http-equiv=”content-language” content=”pt-br” />

    Conhecida pela maioria dos desenvolvedores também. Esta serve para referenciar a linguagem do conteúdo da página.

    Ajuda bastante nos buscadores que possuem diferentes idiomas (como o Google), que vão direcionar a página no idioma que ela se refere. Ajuda também caso o idioma citado tenha acentuação (Nosso Português, por exemplo), corretores ortográficos, etc.

    Uma breve listagem de idiomas:

    • pt-br: Português do Brasil;
    • en: Inglês
    • es: Espanhol

    Entre muitas outras.

    Concluindo Parte I

    Temos outros valores, mas apenas comentei sobre os principais, em minha opinião.

    Agora algumas das metas tags que utilizam o atributo name.

    As meta-tags com o atributo name são utilizadas para outros tipos de controles que não correspondem às chamadas HTTP.

    <meta name=”description” content=”Aqui vem a descrição do seu Site” />

    Essa é velha conhecida da galera também. Aqui você coloca uma breve descrição do seu site. Muitos tentam ser “malandros” e colocam enormes descrições, mas não sabem que os buscadores limitam-se a ler cerca de 200 caracteres, descartando e dificultando o posicionamento de sites com mto conteúdo nessa tag.

    <meta name=”keywords” content=”css, artigos, xhtml, php, webstandards” />

    Outra velha conhecida, mas que têm suas limitações que muitos desconhecem. Já vi alguns sites que recomendavam a utilização de várias palavras, enchendo, lotando de “tags”. Mas poucos desconhecem que é recomendado apenas a utilização de 3 a 5 palavras, variando de página a página.

    Os buscadores reconhecem quando o site utiliza muitos e o considera um “burlador”, digamos assim, fazendo com que perca posições.

    É bom também colocar diferentes palavras dentro das páginas, mas TODAS que sejam referentes ao conteúdo do site, pois o buscador poderá “puni-lo” por tal ação.

    <meta name=”robots” content=”index,follow” />

    Esta meta tag é muito importante, porém, alguns não saibam disso. Essa meta tag que irá dizer se seu site ficará visível nos sites de busca ou não.

    Mas por que eu não iria querer não indexar meu site?

    Seu site pode ser, às vezes, em frames :o, ou então é aberto em uma popup, entre outras opções. Não seria legal essa página dentro da popup ou frame, aparecer fora da página “mãe” correto?

    Temos a seguinte listagem de valores para o atributo content:

    » index,follow
    Esta opção faz com que a página que contenha esta meta tag e as urls referenciadas nelas, sejam indexadas pelos buscadores.
    » noindex,follow
    Com esta, você indexa, somente, as urls referenciadas na página, não indexando ela própria.
    » index,nofollow
    O contrário da anterior. Somente a página que contém esta meta tag será indexada, fazendo com que as urls referenciadas nela não sejam indexadas.
    » noindex,nofollow
    Não indexa nenhuma das páginas, nem as urls referenciadas e nem ela própria. (*)
    » noarchive
    Esta opção faz com que os buscadores não armazenem uma cópia do seu site em cache. Sua utilização requer um pouco de cuidado, pois uma vantagem em não utilizá-la, é que caso seu site fique fora do ar por algum problema, ele ainda continuará sendo indexado, mas caso escolha utilizá-la, automaticamente é retirado. Vemos isso várias vezes no Google, por exemplo, que páginas continuam indexadas e quando clicamos, dá o famoso erro 404.

    (*): Você pode também escolher qual site irá indexar ou não o seu site basta saber o “nome” do bot. Segue um exemplo abaixo do Google.

    <meta name="googlebot" content="noindex,nofollow" />

    Neste caso, somente o Google não indexará o seu site. Mas convenhamos, quem vai querer fazer isto? ;)

    Pesquisei sobre a utilização dessa meta tag e ouvi falar que é bom, os buscadores “dão valor” para quem diferencie corretamente as páginas. Por exemplo, na sua página principal, vc quer indexá-la logicamente, mas uma página de contato, por exemplo, não é tão interessante, a página de obrigado desta página de contato, etc.

    Os buscadores “enxergam” que você diferencia e sabe utilizar tais recursos e podem melhorar seu posicionamento, etc.

    <meta name=”author” content=”Bruno Dulcetti” />

    Nesta referência, você coloca o autor da página criada, no caso você ;) É uma forma de mostrar que você fez o site, etc. Nem todos olham o código-fonte da página, mas nem por isso não devemos levar em conta que não seja válido colocar ;) É bom lembrar também que os buscadores levam em conta os termos que estejam na página, portanto, se seu nome aparece nos 50 sites que você criou, são 50 referências para o seu nome e isso conta para eles.

    <meta name=”generator” content=”Notepad” />

    Opcional, geralmente colocado automaticamente pelos programas geradores de código (Dreamweaver, Home Site, Front Page, etc). Não faz nada demais, só mostra qual Software utilizado para a construção da página.

    <meta name=”revisit-after” content=”01 days” />

    Não muito utilizada hoje em dia por causa dos spammers nos buscadores, mas era uma tag bem utilizada e considerada importante antigamente.

    Você ajusta a quantidade de dias que os buscadores re-visitariam sua página para atualizar os dados contidos nela.

    <meta name=”reply-to” content=”seu@email.com” />

    Completamente opcional também. Aqui você adiciona seu e-mail para contato. Mas como o author, só funciona quando vemos o código-fonte da página.

    Não recomendo muito sua utilização, pois com esses programas que capturam e-mails para envio de spam, seu e-mail pode acabar ficando mais vulnerável a esses programas.

    Concluindo

    Antigamente, a utilização das meta-tags era crucial, os buscadores levavam em conta, principalmente a utilização delas, não tinham muitos critérios, etc.

    Hoje em dia, nós sabemos que um código semântico, sendo utilizado corretamente, com boas linkagens para ele, ser “popular” digamos assim, o conteúdo em si, vale muito mais hoje em dia que as meta tags.

    A utilização ajuda, não deixem de utilizá-las, mas não pensem que apenas colocando um description e um keywords, você verá seu site em primeiro lugar no Google.

    Finalizando

    Bem, é isso. Deixarei aqui, um código com as meta tags que acho importantes na criação de um site. Claro que isso pode variar de site pra site, página pra página, de desenvolvedor pra desenvolvedor e de opinião pra opinião. Estou apenas deixando a minha.

    <meta http-equiv="content-type" content="text/html; charset=UTF-8" />
    <meta http-equiv="content-language" content="pt-br" />
    <meta name="description" content="Aqui vem a descrição do seu Site" />
    <meta name="keywords" content="css, artigos, xhtml, php, webstandards" />
    <meta name="robots" content="index,follow" />
    <meta name="author" content="Bruno Dulcetti" />

    Espero que tenha ajudado a alguém aqui com mais esse artigo :D

    Akele abraço ae.

    Tags BlogBlogs: [ artigos, criações, desenvolvimento, dicas, html, meta, programação, tags, tutorial, xhtml, webstandards ]
    [ 18/Out/2006 às 12:26hrs ] [ Por Bruno Dulcetti ] Comentários 65 Comentários |

    Categorias: Artigos, Criações, Webstandards

    » Segunda Versão. Finalmente saiu. Brunaum v2.0 Flexpower!

    Ok galera, podem zuar… :P

    Não acredito! É Verdade? Estou sonhando!?!!? Não creio!?!?!

    Tah bom, tah bom, parem de sacanear ow… Finalmente saiu essa bagaça de segunda versão. :D Tudo bem, tudo bem, pode não ser revolucionária, aquela coisa estrondosa, caramba, e talz… Mas é a segunda versão do meu Blog e Portfólio.

    Prestes a completar um ano de existência, consegui, finalmente, mudar o layout desse blog/portfólio.

    Parte Visual

    Na parte visual, vocês podem perceber que deixei do lado aquele topo com os macaquinhos né? Tanto no Blog, quanto no meu portfólio, sairam os simpáticos animais que tinham no fundo do campo. As imagens era um pouco pesadas, foi um dos pontos que mais me fizeram retirá-las.

    Recebi no início algumas críticas, às vezes um pouco agressivas, dizendo que era plágio do Felipe Memória, etc. Quis acabar com isso, apesar de nem ter passado na minha cabeça essa idéia de copiar do Memória, etc…

    Mas mesmo assim, continuo utilizando os animais discretamente. Cada seção do portfólio, tem seu respectivo animal que tem um simbólico significado (Essa tuh conhece né Gio? :D). Quem quiser, pode tentar descobrir ae, postar, etc… ;)

    Mudança nos labels do Menu

    É verdade, mudei aqueles labels do menu. Alguns às vezes podem não entender muito bem o que quer dizer, por isso fui mais direto, não utilizando somente um nome, mas fazendo uma pequena referência.

    Tenho é que arrumar o menu, pois se o tamanho da fonte é aumentada, o menu quebra linha, ficando estranho. Tenho que ver um jeito de resolver isso. Mas é melhor colocar agora e ir ajeitando, senão nunca colocarei no ar. :D

    Gostei dos títulos hein Bruno.

    Deu pra ver que dei uma mudada né? Tem o animal referente a seção com um texto em imagem sobre a seção, com um sub-título em texto normal. Eu gostei do resultado, espero que agrade também.

    Hmmm… Layout líquido, boa hein.

    É sempre bom pensar no seu cliente, leitor, etc. Sempre que possível, utilizar layouts líquidos é a melhor opção, pois o responsável pela largura do site é o usuário e não você ;)

    Tudo bem que é um pouco mais complicado, mas é possível. :D Ainda tenho que implementar um max e min-width pro i.e., já vi alguns artigos sobre, mas é uma gambiarra em cima da outra e deixei pra depois. Quem tá no Firefox percebe que ele tem uma largura máxima, para não dificultar a leitura dos posts. ;)

    Simpática essa sua Barra Lateral Bruno.

    Obrigado, eu que fiz. :P Eu preferi ocultar alguns dos elementos, deixando com os leitores a opção de visualizar ou não cada opção: Arquivos, Categorias, Artigos e Amizade. Basta somente um clique para visualizar o conteúdo. Lembrando que em Amizade e Artigos, somente cinco são visualizados, para não ter muita informação.

    Na parte de links, eu padronizei algumas das imagens, deixando com um padrão de largura e altura para a grande maioria.

    Legal essa “iconizada” que você deu no formulário…

    Show de bola né? Acho legal a presença de ícones em algumas partes do conteúdo para melhor entendimento das informações que é transmitida.

    Parte de código

    Essa parte é sempre a mais difícil de todas (na maioria das vezes :P). Ainda não está validado e nem sei se será possível validar tudo :P. Mas eu garanto que tentarei, eu juro :D

    Os artigos anteriores eu ainda terei que ajeitar algumas coisas… Nem todas as tags estão declaradas corretamente no css, tenho que ver isso… Terei que analisar post por post para ficar tudo buniotinho (to ferrado, eu sei :P).

    Mto bom Brunaum. Temos alguma novidade

    Já estava quase esquecendo, ainda bem que você me lembrou :D. Criei mais duas categorias, que estarei postando a partir de hoje sempre que puder.

    Categoria Colírios

    Essa categoria eu postarei sites que podem servir de inspiração para todos. A grande maioria será webstandards, mas postarei algo em Flash também.

    Categoria Videolog

    Esta categoria eu utilizarei, na sua grande maioria, para postar vídeos em destaques no Videolog.tv, no qual já falei sobre no meu Blog.

    Postarei também novidades que rolarem dentro do Portal. ;)

    Agradecimentos

    Queria agradecer a galera q deu apoio na criação dessa nova versão do Blog/Portfólio. Ao Gio a quem eu mostrei o layout e código antes de estar pronto (eu acho que foi né :D), ao Micox q chegou a dar uma olhada também e vem aturando um pouco umas dúvidas minhas :D, ao Feitosa que me ajudou em algumas coisas em PHP, tanto para trabalhos qnt aki no Blog (nem ele sabia disso… uahuauhaua), temos também o Pedro Taranto que me aturou nas dúvidas em Flash pro Videolog.tv, o Bruno Ribeiro que assim como o Taranto, me ajudou no Videolog, tem o Lucas Ferreira que me deu uma ajuda no Videolog.tv também e pra completar a galera do MMUG-RJ tem o Wallace Rettich que deu alguns toques pro Blog também.

    Tem mto mais gente pra agradecer ae, mas tenho q terminar logo isso e colocar a nova versão no ar… :D

    Finalizando…

    Bom, é isso… Queria agradecer a todos ae que frequentam e assinam o feeds deste Blog. Está perto de completar 1 ano de posts sobre webstandards e tecnologia em geral.

    Espero poder ajudar a galera em mais vários e vários anos de existência se possível. Seja com tutoriais, dicas, ou bate papos e curiosidades.

    E não liguem se estiver com algo meio errado, ainda estou agilizando tudo aqui no Blog ok? Lembrando também que a parte de portfólio ainda está incompleta :D

    Akele abraçooooo…

    Tags BlogBlogs: [ blog, blogosfera, criações, layout, líquido, novo, pessoais, webstandards ]
    [ 03/Set/2006 às 23:16hrs ] [ Por Bruno Dulcetti ] Comentários 11 Comentários |

    Categorias: Blogosfera, Criações, Pessoais, Webstandards

    » Palestra Online - Webstandards

    Falae galera.
    Depois de um tempo, estou aqui postando o link com a palestra online que dei via Breeze, pelo MMUG-RJ, Grupo de Usuário Macromedia/Adobe do Rio de Janeiro.

    Desculpem pela demora, eu já estava com o link, mas acabei esquecendo de postá-lo aqui ou no fórum :D. A palestra foi no dia 26/04/2006 às 14:30h, com o tema “Web standards - Truques & Dicas”.

    Chega de enrolação, assistam a palestra.

    Infelizmente não tem como fazer o download, a não ser que vocês capturem o vídeo. Tentarei fazer isso, conseguindo, posto no meu videolog.

    Aquele abraço a todos.

    [ 12/Mai/2006 às 9:31hrs ] [ Por Bruno Dulcetti ] Comentários 2 Comentários |

    Categorias: Artigos, Criações, Tecnologia, Webstandards

    » Blog Colletivo

    E ae pessoal. Hoje venho falar aqui de um Blog recente, o Colletivo. Um Blog de pensamentos, entre outras coisas em que participam dele, Bruno Dulcetti (Eu), Bruno Ribeiro (Coordenador do MMUG-RJ) e o A. Soles (um rapaz que eu nem conheço, mas participa lah :D).

    No Colletivo, falamos sobre assuntos variados, tecnologia, música, cotidiano (não necessariamente nessa ordem). Eu o utilizo para postar alguns pensamentos, já que este aqui eu deixo para assuntos mais profissionais, sobre webstandards, artigos, entre outras coisas a mais.

    Postei meu primeiro texto lah, sobre “Essa Globalização Tecnológica…“. É um texto extrovertidos, nada muito sério, contando um episódio recente que aconteceu comigo e achei interessante repassar para o pessoal que frequenta o Blog.

    Espero que gostem não só do texto, mas também do Blog. Tentarei postar o máximo possível aqui e lá tb.

    Visite o Blog agora.

    Aquele abraço.

    [ 10/Mai/2006 às 16:10hrs ] [ Por Bruno Dulcetti ] Comentários 3 Comentários |

    Categorias: Criações, Pessoais, Tecnologia

    » Novo Videolog.tv no ar

    É com uma grande satisfação e orgulho (e um bocado de atraso, eh verdade :P), que venho avisar que a nova versão do Videolog.tv está no ar. Com uma interface totalmente nova, diferenciada, limpa, com uma arquitetura toda estudada e estruturada nos mínimos detalhes, focada no conceito web 2.0 e muitas outras vantagens.

    Com havia dito antes, o videolog é um compatilhador de vídeos online, seria como um fotolog, mas só que de vídeos.

    Agora você pode acrescentar os outros usuário como amigos, postará seus vídeos dentro dos canais existentes, colocar tags, com isso, facilitando a busca por novos vídeos, fazendo com que seus vídeos sejam encontrados muito mais facilmente pelas pessoas que estão buscando algo.

    Listagem de algumas possibilidade dentro do Videolog.tv:

    • Publicar o seu vídeo sem complicações, compartilhar-los e até inserir em seu blog ou página pessoal.
    • Personalizar o seu vlog com as suas cores preferidas, título…
    • Navegar pelos diversos canais.
    • Criar o seu playlist, com os seus vídeos preferidos no Vídeolog.tv
    • Interagir com os seus amigos, comentando, votando nos vídeos…

    Em breve, estaremos lançando outras funcionalidades e facilidades para os usuários, como um slide de fotos, onde você poderá escolher suas fotos e um áudio e enviar para o videolog, que ele fará a montagem de um slide de fotos com as fotos selecionadas e com o áudio escolhido como trilha sonora, fácil como publicar uma foto. Em breve, também teremos upload de fotos.

    Agora você pode votar nos vídeos, indicá-los para outros usuários. Em breve, teremos games para você jogar enquanto faz o upload do vídeo, entre muitas outras funcionalidades.

    Uma das grandes novidades, é que agora não importa o formato de vídeo que você possui em casa, pois temos um codec que converte todo tipo de vídeo para flv, com isso, sendo aberto pelo nosso player em flash, tornando o arquivo muito mais leve, com ganhos de até 90% na conversão, fazendo com que seu vlog seja aberto muito mais rapidamente. Lembrando que na versão anterior, só poderia fazer uploads de wmv’s.

    Você que é desenvolvedor, pode agora criar seus vídeos online e postar no vídeolog e colocar o player em seu blog, entre outras utilidades. Você que é animador 3D, pode criar suas animações e enviar para o videolog, para todo o mundo ver e muito mais.

    Entre nessa nova era da tecnologia, agora a mania são os vlogs, que é muito mais que postar pensamentos e fotos, são seus pensamentos em movimento, seu mundo sendo mostrado para todos, sua vida podendo ser compartilhada com quem você quer…

    Videolog.tv - Seu vídeo, seu mundo!!

    Entre nessa… Aquele abraço.

    [ 08/Mai/2006 às 17:58hrs ] [ Por Bruno Dulcetti ] Comentários 7 Comentários |

    Categorias: Criações, Pessoais, Tecnologia, Webstandards

    » Videolog. A nova era…

    Falae pessoal.

    Não falarei novamente aquela baboseira toda, que estive longe, estou ocupado, distante tanto do blog, como fóruns, etc… To passando por alguns problemas, mas isso é comigo, ninguém está aqui para saber dos meus problemas e chorar por mim… :D

    Deixando os problemas de lado, vou falar de uma tecnologia, que não é tão nova assim, mas em relação com outras tecnologias, pode ser até uma novidade.

    Certeza de que todos aqui já ouviram falar de fotologs, flogs, etc, que seria digamos assim, um diário fotográfico de nossas vidas. Postamos uma foto, com um breve texto, geralmente sobre a foto, as pessoas comentam, etc… Isso veio primeiro com os Blogs, como este, que em primeira instância, não foram levados muito a sério, poucos acreditavam, principalmente com o surgimento dos flogs, imagens, etc… Mas que agora é mais que uma febre, chamaria de uma tendência. Hoje temos empresas, funcionários de uma empresa, falando sobre o produto desta, temos desenvolvedores, poetas, dentre outros vários tipos de “blogueiros” pela internet. O Blog sim, seria o diário, como havia dito sobre os flogs, com textos, até mesmo fotos, seria algo mais completo digamos assim.

    “Mas onde vc está querendo chegar com isso em Bruno?”

    Ok, ok, calma, foi só uma introdução sobre uma “nova” tendência que está em constante crescimento, no mundo todo, em toda a internet. Estou falando dos Vlogs, ou Videologs. Muito interessante pensar que você pode fazer tudo aquilo que fazemos num blog e ainda poder colocar vídeos, que tem um chamativo muito maior. Convenhamos, uma imagem vale mais do que mil palavras, então quantas palavras valem um vídeo? Eu diria que incontáveis…

    O grande pioneiro nesta área é o Videolog.tv, que foi criado em julho de 2004 pela empresa PRODUZINDO SOM ARTE E TECNOLIGIA LTDA, conquistando em seu primeiro mês a incrível meta de 15.000 usuários cadastrados, sendo destaque nas principais mídias do pais como a TV Vanguarda afiliada Rede Globo, os Jornais O Globo, O Dia, Folha de São Paulo, A Tribuna, Jornal de Brasília, Revista Info, Época, Digerati, UM e diversos outros mídias como sites e blogs (inclusive este aqui agora :D ).

    Estou participando da produção da nova versão do Videolog.tv, fazendo a parte de interação, criação dos códigos webstandards de todas as páginas, participando em partes da criação, criando os flashes onde necessários, brincando um pouco com ajax (sou iniciante ainda :D ), sempre testando no i.e., Firefox e Opera (são os únicos que tenho acesso por enquanto).

    O que é o Videolog.tv?

    O Videolog.tv é a maneira mais fácil e divertida de ver, publicar e compartilhar seus vídeos na internet.

    Você pode gravar seu vídeo com filmadora, câmera fotográfica digital, webcam, palmtop ou celulares em qualquer formato de vídeo e publicar no Videolog.tv, tão fácil quanto publicar uma foto.

    No Videolog.tv, você encontra vídeos com muito mais facilidade, pois você terá possibilidade de fazer uma pesquisa apurada através de palavras relacionadas, as chamadas TAGs, ou buscar os vídeos nos diversos canais disponibilizados.

    Para quem publica vídeos no Videolog.tv, tem a seu favor a facilidade de exibir suas produções com muito mais qualidade, a possibilidade de criar vídeos-on-line através de suas fotos e músicas, criar a sua própria rede de amigos, selecionar os seus vídeos favoritos, criar o seu próprio playlist e inserir em blogs ou websites os vídeos publicados no Videolog.tv (mushup).

    Números

    Está dando bastante trabalho, mais de 5 meses de produção, cria, modifica layout, mexe css, melhora código, etc, etc, etc… Bastante variável, tudo pensando nos usuários de hoje e nos de amanhã, logicamente.

    Hoje, o Videolog.tv conta com mais de 100.000 usuários cadastrados (isso mesmo). Bastante gente utilizando, por isso que digo que não é uma coisa muito nova.

    Como vimos no Carreira Solo, temos muitas pessoas hoje utilizando os vídeos, não somente fotos. Antigamente, comprávamos celulares com câmeras para tirar fotos, agora queremos as que filmam, hoje, boa parte das câmeras digitais, filmam, entre outras coisas mais.

    “E por que não filmar e publicar meus vídeos?”

    Exatamente por isso, o Videolog.tv está no ar. Para que você publique suas aventuras, suas emoções, suas palhaçadas e por que não também publicar seus trabalhos? Animadores, desenhistas, pessoal que mexe com 3D entre várias outras coisas. Até mesmo você, desenvolvedor, que está lendo este blog aqui e deve está se perguntando “Mas eu?”. :D Você pode por exemplo publicar uma vídeo-aula sobre um assunto que você domina, entre outras coisas.

    Tecnologia

    A nova versão do Videolog.tv, ficará toda dinâmica, ajax, web 2.0 caso alguns prefiram assim :D. Assim a requisição ao Banco de Dados será muito menor, sendo menor também o tráfego, sendo bom para os servidores e os clientes. ;)

    O layout está totalmente modificado, diferenciado, mais clean, bonito, leve, agradável. Como se trata de um portal, é muito difícil manter um código totalmente limpo, mas estou tentando fazer isso ao máximo. Ao final, farei uma reciclagem do CSS, porque ele está um pouco grande.

    Linguagem usada é PHP, trabalhando bastante com javascript, ajax, e tudo mais. Somos também, o primeiro portal no Brasil a utilizar um conversor, desenvolvido especialmente para o Videolog.tv, que faz com que os vídeos sejam convertidos para um formato de vídeo padrão, o formato flv, e exibido através do Macromedia Flash Player 8. Com isso, todos os browsers poderão abrir sem dificuldades e com muito mais rapidez todos os vídeos.

    Resultado Final

    Este mês de abril, será lançada a nova versão do Videolog.tv. Pretendemos lançá-lo antes da segunda quinzena, estamos trabalhando duro para isso e com certeza será satisfatório para nós e os “vloguers” do Brasil, quem sabe do mundo neh. ;)

    Conclusão e Finalização

    Além de toda tecnologia, avanço, queria deixar aqui no blog, minha grande satisfação de estar fazendo parte desta equipe bastante capacitada e competente, na criação da nova versão do Videolog.tv, que com certeza virará referência neste novo formato de mídia, comunicação, expansão, visão, etc.

    Vejo a melhora desde a primeira versão que fizemos para a nova versão, que mudou várias e várias vezes até chegar no resultado de hoje. Várias mudanças no código, melhorias citadas, discutidas, código visto, revisto, entre outras coisas mais. Com certeza não será um perfeito portal, mas com certeza estaremos trabalhando bastante para que seja melhor a cada dia para os usuários do Videolog.tv.

    Está curioso? Se estiver, dê uma olhada no Release criado sobre a nova versão. Prometo também aqui colocar algumas telas da nova versão e algumas outras telas que foram substituídas, fazendo uma Retrospectiva :D.

    Aquele abraço a todos e até a próxima. ;)

    [ 05/Abr/2006 às 0:52hrs ] [ Por Bruno Dulcetti ] Comentários 8 Comentários |

    Categorias: Criações, Tecnologia

    Próxima Página »

    
    Copyright © 2005 Bruno Dulcetti | Creative Commons
    Bruno Dulcetti atuante na área de desenvolvimento web / webdesign e colaborador na área de webstandards pelo Blog BrunoDulcetti.com - blog. Atuante na área desde 2000. Atuando na cidade de Niterói/RJ - Brasil. E-mail: bruno@brunodulcetti.com