Volite web dizajn?

Zašto ne podijelite svoje znanje s cijelim svijetom? Svatko može pisati za Kroativ i na taj način se promovirati.

Pomoć potrebitima

http://www.hck.hr

Hrvatski Crveni križ

u službi humanosti od 1878.

HTML5 elementi, ukratko…

Autor/ica Andreas

Grafički i web dizajner, entuzijast u stalnoj potrazi za nečim novim.

Oglas

Uvod u HTML5 elemente

header

Kao što i samo ime govori to je prvi element na našoj stranici i u njega obično stavljamo logo i navigaciju. Sam header ne može u sebi imati drugi header niti footer.

Primjer nekada smo koristili:

<div id=“header“>sadržaj</div>

A sada napišemo jednostavno:

<header>sadržaj</header>

nav

Ovaj element nam služi za dodavanje navigacije na stranici. Možemo ga smjestiti bilo gdje na stranicu, a radi lakšeg određivanja gdje pripada možemo mu dodijeliti ID ili klasu.

Primjer:

<nav id=“main“></nav>
<nav class=“bottom“></nav>

hgroup

Spada u tzv. Sekcijsku grupu elamenata a odnosi se na heading elemente h1-h6 i njihovo grupiranje

Primjer:

<hgroup>
  <h1>O meni</h1>
  <h2>Zašto sam postao web dizajner</h2>
</hgroup>

section

Element nam služi za tematsko grupiranje sadržaja na stranicama. Može sadržavati h1-h6,article,paragrafe itd. Ako ćemo element koristiti radi stiliziranja onda je bolje koristiti div tag

Primjer:

<section>
  <h1>O meni</h1>
  <h2>Zašto sam postao web dizajner</h2>
  <article>text</article>
</section>

article

Ovaj element može biti samostalan ili umjesto taga section ili unutar njega.Koristit ćemo ga kad stavljamo neki članak na stranici.

Primjer:

<section>
  <article>text</article>
</section>

Primjer:

<article>text</article>

aside

Aside element je sličan sidebaru ali on to nije. Koristimo ga ili za bloquote citate ili za izdvajanje pojedinog sdržaja a odnosi se na glavni sadržaj. Može sadržavati nav tag, paragrafe citate.

Primjer:

<aside>
  <nav></nav>
</aside>

figure i figcaaption

Koristimo kod stavljanja slika, fotografija na stranice, a figcaaption se odnosi na tekst ispod slika.

<figure>
  <img src=“my photo.jpg“ />
  <figurecaption>Photo of  me</figurecaption>
</figure>

footer

On je samostalan element koji se koristi za dodavanje kontakt informacija, copyright. Može se nalaziti bilo gdje na stranici, čak i u section tagu kao njegov footer.

Primjer:

<footer>
  <small>(c) Copyright www.webstranica.hr</small>
</footer>
Označeno s:
Za ovaj članak možete glasati na CroPortalu i tako pomoći u njegovoj promociji. Ako članak još nije objavljen vi možete biti prvi!
Stavovi i mišljenja izrečena u ovome članku i/ili komentarima odnose se samo na autora/icu članka i/ili komentara, a ne i cijele Kroativ mreže. Zabranjeno je neovlašteno prenošenje članaka u cjelosti bez prethodnog dogovora ili bez istaknutog povratnog linka na www.kroativ.net stranicu te imena autora.
Oglas

3 komentara

Trackbacks & Pingbacks

Ostavite komentar

Autori s više od 10 komentara nemaju tag nofollow na svojim linkovima! Zabranjeno je vrijeđanje, omalovažavanje ili na bilo koji drugi način ometanje normalnog toka komentara. Također je zabranjeno oglašavanje u komentarima i sve druge vrste spam-a.

(*) polja su obavezna

XHTML: Možete koristiti: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong> <pre lang="" line="" escaped="">