WYSIWYG o acrnimo da expresso em ingls "What You See Is WhatYou Get", cuja traduo remete a algo como "O

O que voc v o que voc obtm" (OQVVEOQVO). Significa a capacidade de um programa de computador de permitir que um documento, enquanto manipulado na tela, tenha a mesma aparncia de sua utilizao, usualmente sendo considerada final a forma impressa. O uso inicial do termo foi relacionado a editores de texto, agora porm aplicado a qualquer tipo de programa, como, por exemplo, programas de web design. Dois exemplos clssicos de editores WYSIWYG so o Writer e o Microsoft Word, nos quais o documento mostrado na tela da mesma forma que ser impresso. O termo define uma interface com o usurio que permite ao usurio ver algo muito similar ao resultado final que ir obter enquanto um documento ou imagem (ou outro produto qualquer) est sendo criado e modificado. Por exemplo, usando um editor de texto WYSIWYG, o usurio pode editar o texto e v-lo da forma exata como ser impresso. Para os usurios que entraram em contato com o computador aps a inveno das interfaces grficas GUI, WYSIWYG parece ser o modo natural de trabalhar, porm todas as geraes anteriores de usurios eram habituadas a ver a tela de um jeito e o documento de outro. Ou, ainda, produzir o resultado final por meio de uma linguagem de comandos ou mesmo de uma linguagem de programao, como feito com os softwares troff, TeX e LaTeX.

Significado de wysiwyg

What You See Is What You Get. Refere-se capacidade de um computador para apresentar uma imagem de um layout de pgina ou elemento grfico na sua tela que mostra como a pgina real olhar como quando se trata da impressora. Antes de computao avanada tecnologia possibilitada WYSIWYG, um tipgrafo formatar uma pgina veria apenas sem formatao linhas de tipo e codificao na tela e teria a esperana de que a cpia que saiu iria olhar a maneira que era suposto.

Overlap

Tutorial XHTML ::
Este tutorial foi revisado em: 23/03/2011 Objetivo Este tutorial tem por objetivo descrever o que , para que serve e porque adotar a linguagem de marcaoXHTML, apresentando seus aspectos estruturais

e semnticos, bem como ressaltando as vantagens do seu uso. De onde veio XHTML ? Todas as linguagens de marcao da web so baseadas emSGML, uma metalinguagem complexa, projetada para mquinas com a finalidade de servir de base para criao de outras linguagens. O SGML foi usado para criar a XML (Extensible Markup Language), tambm uma metalinguagem, porm bem mais simples. Com XML voc cria seus prprios elementos de marcao e atributos para escrever seu documento web. Isto significa que voc quem cria sua linguagem de marcao. XHTML foi criado dentro deste conceito e por isso uma aplicao XML. As tags e atributos da XHTML foram criadas ("inventadas") aproveitando-se as nossas conhecidas tags e atributos da HTML 4.01 e suas regras. Conclui-se que ao usar XHTML, estamos escrevendo um cdigoXML, onde as tags e atributos j esto definidas e isto proporciona todos os benefcios de XML sem as complicaes e complexidade da SGML. XHTML uma linguagem de marcao bastante familiar para quem conhece HTML e a transformao de um documento existente de HTML para XHTML uma tarefa bem simples, como veremos adiante. Qual a finalidade do XHTML ? XHTML a sigla em ingls para EXtensible HyperText Markup Language que em traduo livre resulta em Linguagem Extensvel para Marcao de Hipertexto, uma aplicao XML, escrita para substituir o HTML e nada mais do que uma HTML "pura, clara e limpa". Vantagens de se usar XHTML

Enumeram-se vrias e efetivas vantagens de se usar XHTML nos novos documentos web produzidos ou se migrar os documentos atuais escritos em HTML. E, dentre elas destaca-se em primeiro plano a compatibilidade da linguagem XHTML com as futuras aplicaes de usurios, garantindo desde j que as criaes XHTML conservar-seo estveis por longos anos. A tendncia a de que futuras verses de navegadores e agentes de usurios em geral, deixem de suportar elementos e atributos j em desuso ("deprecated") segundo as Recomendaes doW3C, bem assim como antigos e ultrapassados esquemas e esboos da HTML. XHTML a linguagem da web do futuro desde j a disposio de projetistas e desenvolvedores web. XHTML um cdigo consistente que dispensa uso de "truques" e "hacks" para contornar "bugs". Editar um cdigo XHTML existente uma tarefa bem simples por se tratar de uma escrita limpa e evidente. O tempo de carregamento de uma pgina XHTML mais rpido pois os navegadores tm a interpretar, uma pgina limpa sem ter que decidir sobre renderizao de erros de cdigo. Uma pgina XHTML mais acessvel aos navegadores e s aplicaes de usurio em geral, incrementando a interoperabilidade e a portabilidade dos documentos web. Uma pgina XHTML totalmente compatvel com todas as aplicaes HTML antigas e j ultrapassadas. XHTML um "Padro Web " XHTML 1.0 uma Recomendao do W3C e sua verso atual data de 26 de janeiro de 2000. Isto significa que trata-se de uma linguagem estvel, oficialmente especificada pelo W3C, tendo sido projetada e revisada pelos seus membros e uma "Padro Web ".

Consulte a traduo para o portugus da Recomendao W3C de 26 de janeiro de 2000, revisada em 1 de agosto de 2002 - XHTML 1.0 The Extensible HyperText Markup Language (Segunda Edio) - Uma reformulao do HTML 4 em XML 1.0 As diferenas entre XHTML e HTML As principais diferenas so:

todas as tags devem ser escritas em letras minsculas; as tags devem estar convenientemente aninhadas; os documentos devem ser bem formados; o uso de tags de fechamento obrigatrio; elementos vazios devem ser fechados; sintaxe para atributos. Todas as tags devem ser escritas com letras minsculas A metalinguagem XML sensvel ao tamanho de caixa da fonte. De vez que XHTML uma aplicao XML, tambm sensvel ao tamanho de caixa e deve ser usada caixa baixa, ou seja, letras minsculas. Errado:

<DIV><P>Aqui um texto</P></DIV>
Certo:

<div><p>Aqui um texto</p></div>
As tags devem estar convenientemente aninhadas Errado:

<div><em><p>Aqui negrito</em></p></div>
Certo:

um um

texto texto

<div><em><p>Aqui negrito</p></em></div>

Os documentos devem ser bem formados Um documento diz-se bem formado quando est estruturado de acordo com as regras definidas nas

Recomendaes para XML 1.0 [ XML ]. Todos os elementos XHTML devem estar corretamente aninhados dentro do elemento raiz <html>. A estrutura bsica do documento deve ser conforme abaixo:
view source print?

1.<html> 2.<head> 3.... 4.</head> 5.<body> 6.... 7.</body> 8.</html>

O uso de tags de fechamento obrigatrio Em HTML permitido, para determinados elementos, omitir-se a tag de fechamento. XML no permite omisso de qualquer tag de fechamento. Errado::

<p>Um pargrafo.<p>Outro pargrafo.

Certo:

<p>Um pargrafo.</p><p>Outro pargrafo.</p>

Elementos vazios devem ser fechados Elementos vazios devem ter uma tag de fechamento ou a tag de abertura deve terminar com />. Como exemplo,<br /> ou <hr></hr>. Errado: Elementos vazios sem terminao
view source print?

1.<br> 2.<hr> 3.<img src="imagem.gif" alt="minha imagem ">

Certo: Elementos vazios com terminao

view source print?

1.<br /> 2.<hr /> 3.<img src="imagem.gif" alt="minhaimagem " />

Diferenas para a sintaxe dos atributos

Nomes de atributos Assim como as tags, os atributos tambm so sensveis ao tamanhon de caixa e ento deve-se escrever nomes de atributos em minsculas; Errado:

<td ROWSPAN="3">
Certo:

<td rowspan="3">

Valores de atributos Os valores de atributos devem estar entre "aspas duplas " ou 'aspas simples'; Errado:

<td rowspan=3>
Certo:

<td rowspan="3"> ou <td rowspan='3'>

Valores dos atributos Todos os atributos devem receber um valor; Errado:

<input checked />

Certo:

<input checked="checked" />

Abaixo uma relao dos atributos que se enquadram nesta recomendao
view source print?

01.compact compact="compact" 02.checked checked="checked"

03.declare declare="declare" 04.readonly readonly="readonly" 05.disabled disabled="disabled" 06.selected selected="selected" 07.defer defer="defer" 08.ismap ismap="ismap" 09.nohref nohref="nohref" 10.noshade noshade="noshade" 11.nowrap nowrap="nowrap" 12.multiple multiple="multiple" 13.noresize noresize="noresize"

Os atributos id e name; A HTML define o atributo name para os elementos a, applet, form, frame, iframe, img , e map. HTML tambm introduziu o atribute id. Ambos os atributos foram projetados para serem usados como identificadores. Em XML, os identificadores so exclusivamente do tipo ID, e poder existir somente um atributo do tipo ID por elemento. Alm disso um determinado valor do identificador ID deve ser nico no documento. Documentos XHTML 1.0 compatveis com XML e bem estruturados, DEVEM usar o atributo id e no name ao definir identificadores para os elementos listados acima. Notar que em XHTML 1.0, o atributo name destes elementos est formalmente em desuso e possivelmente ser excluido nas verses futuras de XHTML.

Errado:

<img name="minha_imagem" />

Certo:

src="imagem.gif" id="minha_imagem"

<img />

src="imagem.gif"

Nota: Por razes de compatibilidade com navegadores antigos voc pode usar ambos os atributos como mostrado a seguir:

<img src="imagem.gif" id="minha_imagem" name="minha_imagem" />

O atributo lang; O atributo lang destina-se a definir a lngua em que foi escrito o documento HTML e o atributo xml:langpara definir a lngua em que foi escrito o documento XML.

Pontos de ncoras Em HTML para criar um ponto de ncora, associamos um nome ao elemento <a>:

<p><a name="topo" pargrafo..bla...</p>

>Incio</a

>

do

Em XHTML adicione o atributo id (conserve o atributo name apenas para contemplar navegadores antigos se for o caso)

<p><a id="topo" name="topo" >Incio</a > do pargrafo..bla...</p>

O atributo alt para imagens Em XHTML o obrigatrio uso do atributo alt para imagens

<img src="imagem.gif" alt ="minha_imagem " />

Se tratar-se de uma imagem decorativa pode-se usar o atributo alt vazio:

<img src="imagem.gif" alt =" " />

Separadores de blocos de cdigos comum o uso de uma sequncia de caracteres dentro da marcao de comentrios ( <!---> ) para visualmente separar trechos do cdigo com a finalidade de facilitar sua posterior leitura e manuteno. No use a clssica sequncia de caracteres ------, para conseguir este efeito. Alguns agentes de usurio mais antigos podem ter dificuldades na interpretao desta sequncia. Use por exemplo a sequncia ====, ., ou xxxxxx Errado:
view source print?

1.<!-- Aqui

comea o menu -->

2.<!-- -------------------------------------------- --> 3.cdigo XHTML do menu 4.<!-- -------------------------------------------- -->

Certo:
view source print?

1.<!-- Aqui comea o menu --> 2.<!-- xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx --> 3.cdigo XHTML> do menu 4.<!-- xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx -->

Cdigos gerados por editores Cuidado com os cdigos gerados por editores! Este um cdigo gerado editor: onMouseOver=function() no em XHTML Errado: por vlido

onMouseOver=function()
Certo:

onmouseover=function()
Caracter & (ampersand) Codifique o & ( e comercial) Errado:

Comrcio & Exportao

Certo:

Comrcio &amp; Exportao

Elementos obrigatrios em um documento XHTML obrigatrio a declarao do DOCTYPE assim como a existncia dos elementos <html> <head> <title> e<body> Um modelo mnimo de documento XHTML conforme abaixo:
view source print?

01.<!DOCTYPE bla..bla..bla> 02.<html xmlns="http://www.w3.org/1999/xhtml"> 03.<head> 04.<title>Ttulo do odcumento</title> 05.</head> 06.<body> 07.Contedo do documento 08.</body> 09.</html>

A declarao DOCTYPE no faz parte da marcao XHTML e como tal no tambm um elemento, razo pela qual no h necessidade de tag de fechamento. Para que serve o DOCTYPE ? A Definio do tipo de documento (Document Type Definitions DTD) especifica qual a sintaxe SGML usada no documento. A DTD usada pelas aplicaes SGML ( tais como HTML ) para identificar as regras que se aplicam a linguagem de marcao usada no documento bem como o conjunto de elementos e entidades vlidas naquela linguagem. Assim uma DTD para um documento XHTML descreve com preciso a sintaxe e a gramtica da linguagem de marcao XHTML.

O DOCTYPE deve ser sempre a primeira declarao em um documento web. Os tipos de DOCTYPE So trs os tipos de DOCTYPE para XHTML:

STRICT TRANSITIONAL FRAMESET

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1strict.dtd">

Esta a mais rgida das declaraes. Os documentos XHTML no modo Strict no admitem qualquer item de formatao dentro dos elementos e nem elementos em desuso "deprecated" segundo as recomendaes do W3C. So indicados para uso com folhas de estilo em cascata, com marcao totalmente independente da apresentao
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1transitional.dtd">

Esta declarao permite uma maior flexibilidade e indicada para documentos que ainda utilizem elementos em desuso ("deprecated"), regras de apresentao embutidas em tags e tambm para documentos destinados a exibio em navegadores sem suporte para CSS. No admite qualquer tipo de marcao para frames.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1frameset.dtd">

Esta declarao permite tudo da declarao transational e mais os elementos especificos para frames. Validao do documento XHTML

W3C disponibiliza um validador gratuito para documentos XHTML. Ali, voc digita o URL ou o caminho para o arquivo no seu HD e um rob analisa o documento fornecendo um relatrio completo e detalhado das no conformidades por ventura existentes. uma ferramenta excelente para voc usar durante a elaborao ou migrao do seu documento para XHTML. Serve como um verdadeiro revisor do cdigo que voc cria. Abaixo o link para o validador: Validador XHTML do W3C