weboldalak tervez se n.
Download
Skip this Video
Loading SlideShow in 5 Seconds..
Weboldalak tervezése PowerPoint Presentation
Download Presentation
Weboldalak tervezése

Loading in 2 Seconds...

play fullscreen
1 / 14

Weboldalak tervezése - PowerPoint PPT Presentation


  • 89 Views
  • Uploaded on

Weboldalak tervezése. II. (X)HTML. Sir Timothy John "Tim" Berners-Lee. WWW (1989.) HTML http World Wide Web Consortium (W3C) http://info.cern.ch (1991. augusztus 1.). http://www.w3.org/History/19921103-hypertext/hypertext/WWW/News/9201.html. HTML felépítése.

loader
I am the owner, or an agent authorized to act on behalf of the owner, of the copyrighted work described.
capcha
Download Presentation

PowerPoint Slideshow about 'Weboldalak tervezése' - lynne


An Image/Link below is provided (as is) to download presentation

Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author.While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server.


- - - - - - - - - - - - - - - - - - - - - - - - - - E N D - - - - - - - - - - - - - - - - - - - - - - - - - -
Presentation Transcript
weboldalak tervez se

Weboldalak tervezése

II. (X)HTML

Huszár István

sir timothy john tim berners lee
Sir Timothy John "Tim" Berners-Lee
  • WWW (1989.)
  • HTML
  • http
  • World Wide Web Consortium (W3C)
  • http://info.cern.ch(1991. augusztus 1.)

http://www.w3.org/History/19921103-hypertext/hypertext/WWW/News/9201.html

Huszár István

html fel p t se
HTML felépítése
  • HyperText Markup Language – kereszthivatkozások kezelésére is alkalmas jelölő nyelv
  • Tartalom + megjelenés
  • TAG : jelölőelem < > jelek közöttLehet:- önmagában álló (pl.: <BR>)- páros (pl.: <TBLE> … </TABLE>)- elhagyható zárotag (pl.: <LI> … </LI>)

Huszár István

tag fel p t se
TAG felépítése

Pl.: <A HREF=”www.valami.hu”>Kattints ide</A>ahol:

< - a tag kezdete

A – a tag neveHREF – attribútum

” www.valami.hu” – az attribútum értéke

> - tag zárása

Kattints ide – a megjelenő tartalmi rész

</A> - zárótag

Huszár István

szabv nyos t s
Szabványosítás
  • W3C – szempontok:- a megjelenésre, dizájnra vonatkozó jelölőelem elhagyása- fő funkció: az oldal tartalmi részének, struktúrájának leírása
  • XML (eXtensible Markup Language)adatstruktúrák leírására használt jelölőnyelv
  • HTML + XML => XHTML (2000. XHTML 1.0)

Huszár István

weboldal szerkezete 1
Weboldal szerkezete 1.
  • DTD (Document Type Definition)- Azonosítja az oldal leírásához használt nyelvet, annak verzióját és változatát.- A különböző böngészőket szabványkövető üzemmódba kényszeríti.
  • Weboldalunk mindig DTD-vel kezdődjön!

Huszár István

weboldal szerkezete 2
Weboldal szerkezete 2.
  • <html> … </html> - oldal nyitás és zárás fontos!

- xmlns – névtér megadása

- xml – oldal tartalmi részének nyelve

(A névtérnek XML dokumentumokban van jelentősége, itt csak nyilatkozunk, hogy az oldalban XHTML jelölőnyelvet fogunk használni.)

  • Részei:

- <head> - fej - </head>>

- <body> - törzs - </body>

Huszár István

weboldal szerkezete 3
Weboldal szerkezete 3.
  • <head> … </head> - fejléc, mint a weboldal egyik fő része

- a böngészőben nem látható

- fontos szerepe van a weboldal megjelenését illetően

- metaadatokat tartalmaz

Huszár István

weboldal szerkezete 4
Weboldal szerkezete 4.
  • Metaadatok a <head>-ben (pl.):

- author – szerző neve

- description – az oldal leírása (tartalom)

- keywords – kulcsszavak a keresőknek

- robots – kereső robotok vezérlése

- resource-type – dokumentum típusa

Bővebben: http://www.googleoptimalizalas.com/meta-tag-beallitasa

Huszár István

weboldal szerkezete 5
Weboldal szerkezete 5.
  • <title> … </title> - az oldal címe.

(Kötelező elem!)

- Böngészőablakának címsor tartalma

- Kedvencek listájának megnevezése

- Kereső programok is figyelik.

  • <!– megjegyzés --> - a böngésző a „megjegyzés” szöveget figyelmen kívül hagyja

Huszár István

weboldal szerkezete 6
Weboldal szerkezete 6.
  • <body> … </body> - törzs, az oldal tényleges, látható része.
  • A forráskód formai jellemzői:
  • tagolt szöveg
  • áttekinthető
  • jól olvasható
  • struktúrált

Huszár István

weboldal szerkezete 7
Weboldal szerkezete 7.
  • <div> … </div> - division – szakasz, rész:

Az XHTML-ben a dokumentum főbb strukturális részeinek kijelölésére szolgál

  • id attribútum: a <div> egyedi azonosítója.

Pl.: <div id=”container”>Az attribútumnak fontos szerepe van a stíluslapok használatakor.

A <div>-eket struktúráltan írjuk a forráskódba!.

Huszár István

a j l olvashat forr s egyben t kr zi az oldal strukt r j t is
A jól olvasható forrás egyben tükrözi az oldal struktúráját is!

Huszár István