All Articles Web
O futuro da Web é Aqui: Usando jQuery, HTML5 e CSS3 no mercado seu Música Online
Andrew Turner on Sat, June 4th 0 comments
jQuery is a JavaScript library written by John Resig which makes it easy to make interactive web applications. jQuery has the ability to load code from other javascript files in order to create rich u

jQuery é uma biblioteca JavaScript escrito por John Resig o que o torna fácil de fazer aplicações web interativas. jQuery tem a capacidade de carregar o código de outros arquivos javascript para criar experiências ricas de usuário, como menus interativos, formulários, animações e elementos de interface do usuário. Na verdade, jQuery pode preencher uma página com os componentes que você define programação. É uma linguagem bastante compacto e sensível para trabalhar com e você pode usá-lo para a exibição de sua música e vídeo para a web a experiência.

Neste exemplo, vou mostrar-lhe como usar o plugin ciclo de jQuery para fazer uma apresentação de slides simples, com parâmetros de controle de velocidade e desaparecer dentro / fora. Com esta técnica básica concluída, você pode expandir o seu site de forma rápida e conveniente.


01 - jQuery

A Figura 1 mostra um screenshot de uma página web de executar o código jQuery. Esta baseia-se no post anterior eu submeti mostrando como usar o novo elemento de áudio em HTML5. Listagem de código 1 mostra o arquivo real na sua totalidade. Você pode ver um exemplo do resultado neste link:

http://www.electronicmusic101.com/jqslideshow.html .

Figure 1: A div showing one of 5 rotating images, with an audio element and html5 multimedia “trophy” logo, rendered in Safari

Figura 1: A div que mostra um dos 5 imagens de rotação, com um elemento de áudio e multimídia html5 logotipo troféu, prestados no Safari

Você pode baixar o plugin jQuery ciclo aqui http://jquery.malsup.com/cycle/ . A partir desse ponto, é apenas uma questão de abrir o Photoshop ou o seu editor de imagem de escolha para definir o tamanho eo nome de cada imagem na apresentação de slides.


02 - Adoção HTML5

Navegadores como o Internet Explorer ainda não têm a capacidade de analisar o esquema de novos padrões HTML5. Um esquema é apenas uma maneira elegante de dizer que há uma rima e motivo para as peças de uma coleção. As partes do html5 consistem em elementos que dão significado aos motores de busca, navegadores e desenvolvedores web.

Navegadores modernos, como a família webkit do Mozilla Firefox, Safari, Firefox e estão preparados para o futuro de desenvolvedores web precisa, adotando os padrões html5 antes da especificação é aprovado pelo World Wide Web Consortium (W3C). Felizmente para nós, desenvolvedores multimídia, somos capazes de atingir o público na web com mídia rica e experiências interativas para mostrar o nosso áudio e vídeo, ao mesmo tempo melhorar o nosso motor de pesquisa otimização (SEO) a fim de ampliar esse público.

Como a web ultrapassa a cobertura da televisão e programação de rádio, torna-se cada vez mais importante para os artistas para aproveitar o poder da internet, a fim de alcançar aqueles que têm pontos em comum com eles mesmos. Colaboração através de aplicações web como Facebook e Twitter podem melhorar seu alcance horizontal e vertical. Isto é, você não só aumentar o número de habilidades aprendidas, mas também pode aprofundar sua compreensão dessas habilidades, pesquisando técnicas encontradas na internet e pode anexar suas contribuições a esses recursos, facilitando o aprendizado em uma escala global.


03 - Menos é Mais

Imagens falam mais que mil palavras, como eles dizem, e, geralmente, os usuários vão esperar para descobrir por que seu site é interessante em questão de segundos de visitar o seu site. Quantos de nós julgar a música por os primeiros compassos que ouvimos?

Qualquer editor de texto pode ser utilizado (mesmo bloco de notas ou editor de texto) para criar o código necessário para fazer uma página Web com conteúdo multimídia. Listagem de código como uma sugere, uma série de imagens são carregados e exibidos através do browser, com dimensões definidas e vários outros parâmetros. Há possibilidades praticamente ilimitadas para apresentar o seu conteúdo na web, mas aqueles opções podem ser organizados em três tecnologias principais: css, javascript e html.

Observe na Listagem de código 1 ( Listagem de código 1 Download ) que img_1.jpg tem um determinado tamanho. Esta deve coincidir com a dimensão real da imagem, para que o código deve ser atualizado por o tamanho das imagens, é claro. Na verdade, muitas bibliotecas JavaScript são assim, eles contêm as rotinas principais para fazer a sua página web se comportar de certa maneira, mas deixar alguns parâmetros que você pode personalizar para atender às suas necessidades individuais criativo.


04 - O futuro da Web

Apesar de tornar-se intimamente familiarizado com JavaScript renderia uma vida de trabalho produtivo no campo do design web, você pode precisar apenas de compreender um pequeno subconjunto de JavaScript para utilizar o seu potencial.

Tecnologias futuras, como CSS3 irá permitir-lhe transferir os seus conhecimentos existentes Adobe Flash através de todos os navegadores modernos, mesmo para aqueles que não suportam Flash!

Você pode copiar / colar o código da Listagem de código 1 em seu editor de texto de escolha, e enviá-lo para o seu host para se levantar e correr rapidamente com este slideshow jQuery. Eu uso maçãs serviço móvel para me hospedar meu site, mas em um artigo futuro, também discutir como criar seu próprio serviço de hospedagem!


05 - Estrutura da Página

Para os desenvolvedores iniciantes, é importante compreender que uma página web só funciona se as imagens, javascript, e outros arquivos estão nas pastas corretas. Todos os arquivos html devem estar no diretório raiz, ou seja, o diretório que contém todos os outros.

A estrutura principal de uma página web, em poucas palavras, é uma cabeça e um corpo, envolto em um recipiente html. Na seção de cabeça, você pode inserir javascript e css código diretamente, e no corpo que define os meios de comunicação visível e audível, como imagens, vídeo e áudio de vários formatos.


06 - O aspecto social

Eu sou da opinião de que uma página web deve ser muito simples para um artista, para mostrar peças de trabalho com um investimento mínimo pelo espectador. Em outras palavras, deve haver esforço de up-front pouco gasto em experimentar a arte que você cria e enviar para a web. Isso ocorre porque a qualidade percebida de formas de arte são altamente subjetivos para nós como seres humanos, e não duas pessoas podem responder da mesma forma a uma obra de arte. A música é uma forma de arte muito emocional, e que o ouvinte pode ser muito particular sobre o tipo de sentimento que a música retrata.

Com a web se tornar um local sociais cada vez mais, uma apresentação de slides simples, com um pouco de música em segundo plano faz para uma boa diversão em um ambiente ocupado, seja trabalho ou lazer. Na verdade, uma seção de uma página web podem ser visíveis dentro de outra seção da outra página web. Esta é a essência de aplicações web, ao contrário de páginas web, em que há uma capacidade intercambiáveis ​​do seu conteúdo na web, para multiplicar a exposição e usabilidade em muitos contextos. Por exemplo, um site de notícias pode ser capaz de acessar diretamente a mais nova peça de seu site, que apresenta uma área de interesse particular ou novo lançamento.


07 - Tomando-lo ainda mais

Como sua compreensão de como se comportar sites torna-se mais detalhada, você pode começar a desenvolver páginas web mais sofisticados, e talvez até mesmo produzir páginas para outros artistas em uma coletiva, tais como um rótulo net ou mesmo uma empresa de produção de pleno direito. Você pode então integrar seu conteúdo em comércio ou distribuição no domínio digital. Muitas contribuições youtube ganharam centenas de milhares de dólares apenas a partir da receita de anúncios colocados ao lado dos media! Imagine quantas maneiras o seu conteúdo pode ser acessado apenas por integrá-lo no world wide web. Sua muito grande quando você realmente parar e pensar sobre a rapidez com conteúdo é redundante distribuído online.

Da próxima vez, vou explicar os detalhes de como proceder para adicionar o seu conteúdo para a web, ao detalhar os passos que eu atravessava, a fim de configurar o meu próprio servidor web, de modo que você e eu podemos criar sites para amigos e clientes, enquanto evitando os custos substanciais que podem se acumular ao contratar uma empresa para hospedar seu site para você.

Espero que você será capaz de usar esta técnica slideshow jQuery para melhorar as suas páginas web, ou apenas para alcançar o marco de adicionar seu próprio conteúdo para a web com suas próprias mãos. A web está esperando, agora ... brilhar!


Listagem de código baixar um aqui.

Related Videos
Comments (0)

You must be logged in to comment.

EDM Production Tips
Logic Pro X 402
Dream It. Do It.
Do you want to learn EDM Production Tips?
Yes, I want to learn!
No Thanks, I just want to read the article.
Feedback
Course Advisor
Don't Know Where To Start?
Ask A Course Advisor
Ask Us!
Copy the link below and paste it into an email, forum, or Facebook to share this with your friends.
Make money when you share our links
Become a macProVideo.com Affiliate!
The current affiliate rate is: 50%
Classes Start Next Week!
Live 8-week Online Certification Classes for: