Site de Webmasters: fevereiro 2013

sábado, 16 de fevereiro de 2013

HTML 5 - O elemento optgroup

O elemento optgroup permite agrupar elementos option organizando o seu conteúdo. Quando utilizado com o atributo label, ele cria uma legenda com o texto normalmente formatado em itálico ou negrito.

O código para a construção do item select é:

<select>
<optgroup label="Informática">
<option>CPU</option>
<option>Mouse</option>
</optgroup>
<optgroup label="Moda">
<option>Calças</option>
<option>Sapatos</option>
</optgroup>
</select>

Legenda de Figuras

Para inserir legendas nas imagens das nossas páginas, devemos utilizar os seguintes comandos:


<figure>
    <img src="http://3.bp.blogspot.com/-ICVjz5KJvd0/UIgnDyO5vqI/AAAAAAAAAbA/3pfQnx1kH3U/s1600/Site%2Bde%2BWebmasters2.jpg" alt="Your HTML Guide" border="0">
    <figcaption>Site de Webmasters</figcaption>
</figure>

sexta-feira, 15 de fevereiro de 2013

HTML 5 - Elementos de Formulários

São novos os valores para o atributo type da tag input descritos por color, date, datetime, datetime-local, email, number, time, search, range, tel, week. Veja a seguir exemplos de cada uma das input 's estudadas:

color: Insere um menu de seleção de cores. Caso o seu navegador tenha se adaptado ao HTML5, observe a seguir como funciona essa input:
<input type="color">
date: Insere um menu para seleção de data. Observe:
<input type="date">
datetime: Insere um menu para seleção de data e horário no UTC. Observe:
<input type="datetime">
datetime-local: Insere um menu para seleção de data ou horário local. Observe:
<input type="datetime-local">
email: Coloca um campo para a entrada de um endereço de um correio eletrônico, nele o próprio navegador faz a validação, isto é, o próprio browser verifica se foi digitado o @ e o ponto. Observe:
<input type="email">
number: Coloca um elemento para que o visitante seleciona um numero. Observe:
<input type="number">
time: Insere um menu para seleção de hora. Observe:
<input type="time">
search: Insere um elemento para pesquisa. Observe:
<input type="search">
range: Insere um elemento para variação. Observe:
<input type="range">
tel: Insere um elemento para inserir telefone. Observe:
<input type="tel">
week: Insere um elemento para selecionar semana. Observe:
<input type="week">
month: Insere um elemento para selecionar mês. Observe:
<input type="month">

Caso algum dos elementos vistos acima não funcione corretamente, saiba que o seu navegador ainda não se adaptou plenamente ao HTML5. Como o HTML5 ainda é novidade, nem todos os navegadores se adaptaram.

HTML 5 - Quebra de Palavras

A tag <wbr> identifica em que local de uma palavra pode acontecer uma quebra de linha, onde é necessário especificar com exatidão onde é necessário especificar com exatidão onde pode ocorrer a quebra de linha. A quebra na palavra "necessário" da frase acima foi feita pela tag "word breaker" <wbr>.

quinta-feira, 14 de fevereiro de 2013

HTML 5 - QUAIS AS NOVIDADES?

A partir desta postagem, estarei falando tanto do antigo, quanto do novo HTML, o HTML 5. Demorei postar algo sobre o assunto pois estava me orientando ainda sobre o assunto, consultando sites, livros e alguns professores da área técnica de Informática (inclusive o professor de Programação para Internet do Centro Paula Souza Maggayver Grecco).

Os dados postados nesta postagem foram retiradas do livro "Flatschart, Fabio. HTML 5 : embarque imediato. Rio de Janeiro : Brasport, 2011".

Novo Doctype: Para declarar um documento HTML como do tipo HTML 5 adicionamos somente a tag <!DOCTYPE html>.
Charset: É o parâmetro que especifica a codificação de caracteres usada para distribuir ou armazenar um documento e deve ser inserido antes do elemento title no cabeçalho do documento. Ele é feito agora pela tag <meta charset="utf-8">.
Novos elementos de formulários: Nos formulários atuais poderão ser inseridos elementos de tipo color, date, datetime, email, month, number, range, search, time, url, week e outros que serão explicados em seguida.