Basics: Creating Your Very Own HTML Document Noções básicas: criar o seu próprio documento HTML

by Joel Reyes on November 28, 2008 por Joel Reyes em 28 de novembro de 2008

Web Design & Dev

This brief tutorial will guide you through creating your first web page. Este breve tutorial irá guiá-lo através da criação de sua primeira página web.

What is HTML, and What Do I Need? O que é HTML, e O que eu preciso?

In order to create an HTML document you have to understand that HTML is the language of the Net. A fim de criar um documento HTML você tem que entender que o HTML é a linguagem da líquidas. It’sa simple yet universal mark-up language that gives web developers and designers the ability to create complex pages of text that turn into images, styles, and valuable content that can be viewed by any one person using any sort of computer or browser on the web. Ainda universais É simples linguísticos mark-up que dá web designers e desenvolvedores a capacidade de criar páginas de texto complexo que se transformam em imagens, estilos, e um conteúdo valioso que pode ser visto por qualquer pessoa usando um computador ou qualquer espécie de navegador na a web.

Some of you may have heard that you need some sort of special software in order to publish your own HTML page, however that is a blatantly false statement. Alguns de vocês podem ter ouvido dizer que você precisa de algum tipo de software especial, a fim de publicar sua própria página HTML, porém essa é uma falsa declaração descaradamente.

Here’sa small list of all the tools you need: Segue pequena lista de todas as ferramentas que você precisa:

-A word processor (such as SimpleText, BBEdit, Notepad, or Microsoft Word) -Um processador de texto (como o SimpleText, BBEdit, Bloco de Notas, ou o Microsoft Word)

-A simple working knowledge of HTML. -Um trabalho simples conhecimento do HTML. (Fortunately HTML is easy and fun to learn!) (Felizmente HTML é fácil e divertido para aprender!)

Yup! Sim! Thats it! É isso! These are all the tools you need as of now, told you it was small list. Estas são todas as ferramentas de que necessita a partir de agora, disse que era pequena lista.

Tags Tags

H yper T ext M ark-up- L anguage mostly consists of several tags that are embedded into a simple text document. H yper T ext M arca-up L-ANGUAGE maioritariamente constituída por várias marcas que são incorporados em um simples documento de texto. They are really just hidden behind the scenes, controlling most of what it lets you view, and what it wants you to view at the designated time. Eles são realmente apenas oculto nos bastidores, controlando a maior parte do que lhe permite visualizar, e aquilo que ele quer que você se vista com o horário designado. Hm, kind of reminds me of the parental control feature on the tv a bit. Hm, espécie de faz-me lembrar a funcionalidade de controlo parental sobre a tv um pouco.

HTML tags heavily take into account the existance of the English language. Tags HTML fortemente levar em conta a existência do idioma Inglês. As most of the tags are words (such as blockquote) or abbreviations (such as “p” for paragraph), but they’re uniquely separated from the regular text since they’re placed in small angle brackets (such as these < >). Como a maioria das tags são palavras (como bloco) ou siglas (tais como "p" para o n), mas eles são o unívoca separadas do texto normal uma vez que elas são colocadas em pequenas colchetes angulares (como esses <>) . Therefore the bold tag would look like <b> , and the blockquote tag is <blockquote> . Por conseguinte, o negrito tag se pareceria com <b>, e os blockquote tag é <blockquote>.

There are certain tags that will have the most influence on how the page will be formatted (for example; <p> begins a new paragraph, and <br> can break the last line within the paragraph to allow a space), and others differentiate how the words appear ( <i> makes text italic). Há certas tags que terá a maior influência sobre a forma como as páginas serão formatadas (por exemplo; <p> começa um novo parágrafo, e <br> pode quebrar a linha dentro do último parágrafo para permitir um espaço), e outros diferenciar como as palavras aparecem (<i> torna texto itálico). Most others provide information — such as the title — that doesn’t appear on the page itself. A maioria dos outros fornecer informações - como o título - que não aparece na própria página.

One very important thing you must remember about tags is that for every one tag there is another one paired along with it. Uma coisa muito importante que você deve lembrar é que cerca de tags para cada uma etiqueta existe um outro emparelhado com ele. Every time you use a tag - say <br> - you must also add and close it off with another tag - in this case, </br> . Cada vez que você use uma tag - <br> dizer - você também tem de adicionar e feche-off com outra marca - neste caso, </ br>. Note the slash - / - before the tag “br”; that’s what keeps in contrast the closing tag from the opening tag. Observe a barra - / - antes da tag "br", isto é o que mantém em contraste tag de fechamento desde a tag de abertura.

A basic HTML page always begins with the tag <html> and ends with </html> . Uma página HTML básica semper começa com a tag <html> e termina com </ html>. In between, the file has two sections - the header and the body. No intervalo, o arquivo tem duas vertentes - o cabeçalho eo corpo.

The header enclosed by the <head> and </head> tags - contains information about your page that won’t be visible on the final page, for example the title. O cabeçalho delimitada pela <head> e </ head> "tags" - contém informações sobre sua página que não será visível no final da página, por exemplo, o título. The body enclosed by <body> and </body> - is where the real HTML action takes place. O corpo fechado por <body> e </ body> - onde está a verdadeira acção tem lugar HTML. Every thing that appears on the page is contained within these tags. Cada coisa que aparece na página está contido dentro dessas tags.

Now On To The HTML Document Agora em que o documento HTML

I think we’re ready to start creating a simple page. Acho que estamos prontos para iniciar a criação de uma simples página. Right?  Ok the first step, of course, is to create a new text document (remember, it should be saved as “Text Only” or “Plain Text” if you’re using a word processor that’s fancier than, say, SimpleText or NotePad) and name it “anything.html” where “anything” is, um, well basically anything at all. Certo? Ok o primeiro passo, evidentemente, é o de criar um novo documento texto (lembre-se, ela deve ser guardada como "Somente texto" ou "Texto Simples", se você estiver usando um processador de texto que é conhecedor do que, digamos, SimpleText ou notePad) eo nome do seu "anything.html" onde "nada" é, hum, bem basicamente tudo em todos.

Your basic document should look something like this: Seu documento básico deve parecido com este:

 <html> 
  <head> 
  <title>SimpleHelp.Net</title> <title> SimpleHelp.Net </ title> 
  </head> </ head> 

  <body> 
  <h1>HTML Basics</h1> <h1> HTML Basics </ h1> 

  <p>This is a simple article to help you create a working HTML page on SimpleHelp.Net!</p> <p> Este é um simples artigo para ajudá-lo a criar uma página em HTML trabalho SimpleHelp.Net! </ p> 

  <p>Simple helping on SimpleHelp.Net :)</p> <p> Simples ajudando em SimpleHelp.Net:) </ p> 

  </body> </ body> 
  </html> </ html> 

Within the <head> tags, we have the title “SimpleHelp.Net” which will appear in the bar across the top of your browser. Dentro do <head> tags, temos o título "SimpleHelp.Net", que será exibido na barra na parte superior do seu navegador.

Within the body tags, you should have everything that will be clearly visible on the page. Dentro do corpo tags, você deve ter tudo o que vai ser bem visível na página. With what we’ve written above it will look something like this: Com o que temos escrito acima, será parecido com este:

HTML Basics HTML Basics

This is a simple article to help you create a working HTML page on SimpleHelp.Net. Este é um simples artigo para ajudá-lo a criar uma página em HTML trabalho SimpleHelp.Net.

Simple helping on SimpleHelp.Net Simples ajudando em SimpleHelp.Net :)

As you might have guessed, <h1> is the tag for a headline (the largest headline, in fact compared to <h2>, <h3>, and so on) and <p> , of course, marks the beginning of a new paragraph. Como você pode ter adivinhado, <h1> é a etiqueta de um título (o maior título, de facto, em comparação com <h2>, <h3>, e assim por diante) e <p>, obviamente, marca o início de uma nova n º. Each paragraph is closed off by a corresponding </p> tag. Cada ponto é encerrada por um correspondente </ p> tag. As should every other tag be closed off by their correspondant tags that include a “/”. Como todas as outras devem ser fechadas por codificar seus respectivos tags que incluem uma "/".

Does “HTML-ing” seem pretty simple? Diz "HTML-ing" parece bastante simples? Well guess what? Bem adivinhem? It sure is! Pois é!

Every page has a source code and this can with this you can view every web pages HTML code by accessing it through your browsers menu options. Cada página tem um código fonte e este pode com isto é possível visualizar todas as páginas da web código HTML, acessando-lo através de seu menu opções navegadores. And best of all, you don’t need your own homepage to practice! Eo melhor de tudo, você não precisa de praticar a sua própria página pessoal! You can save HTML documents on your local or portable drives and then have them open up using the Open option under the File menu within your browser. Pode guardar documentos HTML em seu local ou unidades portáteis e, em seguida, mandar abrir usando a opção Abrir no menu Arquivo no seu navegador.

I wish you all the best of luck as hopefully this has helped a couple novice readers create an HTML page and maybe even helped refresh a few of the more intermediate developers minds as well. Desejo-lhe as maiores felicidades como espero que isto tenha ajudado um jovem novato leitores criar uma página HTML e talvez até mesmo ajudou a refrescar um pouco mais da intermediária desenvolvedores mentes tão bem.

Feel free to comment! Fique à vontade para comentar!

Related Posts: Posts Relacionados:
  • How to set the Properties of multiple MS Word documents Como definir as propriedades de vários documentos MS Word
  • How to use the Content Library feature of Publisher 2007 Como usar a Biblioteca de conteúdo funcionalidade do Publisher 2007
  • How to extract the images from a .doc file using OpenOffice.org Writer Como extrair as imagens de um. Doc arquivo usando o OpenOffice.org Writer
  • How to “Pubvertise” Your Live FeedBurner RSS Content to a Wider Audience Como "Pubvertise" Your Live FeedBurner RSS Conteúdo a um público mais vasto
  • How to change the Windows XP System Properties logo and text Como mudar o Windows XP System Properties logotipo e texto
  • Get Simple Help tutorials just like this one in your email inbox every day - for free! Obter Ajuda Simples tutoriais apenas como um presente em seu correio eletrônico todos os dias - gratuitamente! Just enter your email address below: Basta digitar o seu endereço de e-mail abaixo:

    You can always opt out of this email subscription at any time. Você pode optar por sair semper deste e-mail subscrição a qualquer momento.


    Bookmark and Share Favoritos e Partilhar

    { 0 comments… (0 comentários ... add one now adicionar um agora } )

    Leave a Comment Deixe um comentário

    You can use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong> Você pode usar esses atributos e tags HTML: <a href="" title="Avião"> <abbr title="Avião"> <acronym title="Avião"> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>