szit

Ez az oldal csak olvasható. Megtekintheted a forrását, de nem változtathatod meg. Ha úgy gondolod, hogy ez helytelen, kérdezd az Adminisztrátorokat!
[[oktatas:web|< Web]]

====== Tervezés ======
Csonk



===== Lineáris szerkezet =====



<html>
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="400" height="100">

  <rect x="0" width="50" height="70" style="fill:none; stroke-width:1; stroke:rgb(0,0,0)"/>

  <line x1="50" y1="30" x2="70" y2="30" style="stroke:blue; stroke-width:2" />

  <rect x="70" width="50" height="70" style="fill:none; stroke-width:1; stroke:rgb(0,0,0)"/>

  <line x1="120" y1="30" x2="140" y2="30" style="stroke:blue; stroke-width:2" />

  <rect x="140" width="50" height="70" style="fill:none; stroke-width:1; stroke:rgb(0,0,0)"/>

  <line x1="190" y1="30" x2="210" y2="30" style="stroke:blue; stroke-width:2" />

  <rect x="210" width="50" height="70" style="fill:none; stroke-width:1; stroke:rgb(0,0,0)"/>  
  
</svg>

</html>
===== Hierarchikus szerkezet =====

<html>
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="200" height="250">

  <rect x="0" y="80" width="50" height="70" style="fill:none; stroke-width:1; stroke:rgb(0,0,0)"/>

  <line x1="50" y1="120" x2="70" y2="80" style="stroke:blue; stroke-width:2" />
  <line x1="50" y1="120" x2="70" y2="150" style="stroke:blue; stroke-width:2" />

  <rect x="70" y="40" width="50" height="70" style="fill:none; stroke-width:1; stroke:rgb(0,0,0)"/>
  <rect x="70" y="120" width="50" height="70" style="fill:none; stroke-width:1; stroke:rgb(0,0,0)"/>

  <line x1="120" y1="70" x2="140" y2="30" style="stroke:blue; stroke-width:2" />
  <line x1="120" y1="70" x2="140" y2="110" style="stroke:blue; stroke-width:2" />
  <line x1="120" y1="150" x2="140" y2="110" style="stroke:blue; stroke-width:2" />
  <line x1="120" y1="150" x2="140" y2="200" style="stroke:blue; stroke-width:2" />  

  <rect x="140" y="0" width="50" height="70" style="fill:none; stroke-width:1; stroke:rgb(0,0,0)"/>
  <rect x="140" y="80" width="50" height="70" style="fill:none; stroke-width:1; stroke:rgb(0,0,0)"/>
  <rect x="140" y="160" width="50" height="70" style="fill:none; stroke-width:1; stroke:rgb(0,0,0)"/>  
  
  
</svg>

</html>


===== Egyoldalas weblap (SPA) =====

Az oldal tartalma változik, de maga az oldal sosem töltődik újra. Lásd SPA.

<html>
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="400" height="100">

  <rect x="0" width="50" height="70" style="fill:none; stroke-width:1; stroke:rgb(0,0,0)"/>

  
</svg>

</html>


Az egyoldalas weblapon az összes tartalom elhelyezkedhet
az adott lapon, vagy JavaScript tölti újra és újra a tartalmat.


===== Saját honlap  =====


Kezdetnek elkészíthetjük saját honlapunkat. Lehet a következő felépítésű. 

  * Főoldal
    * Magamról
    * Ezzel foglalkozom
    * Életrajzom
    * Családom
    * Hobbim
    * Sport
    * Linkjeim

===== Flat design =====
Minimális tervezési stílusban, webes és mobil felületeken.
Lapos kialakítás. Árnyékolás nélküli felületek.

Példa:
  * https://github.com/designmodo/Flat-UI

===== Fejlesztésről általában =====

A projektet 3 fő készíti:
  * Webtervező - Képek formájában elkészíti a tervet, képszerkesztővel, tervezővel.
  * Frontend - A webtervező által képen megvalósított felületet megjeleníti.
  * Backend - Gondoskodik az adatok tárolásáról, átalakításáról.