1. Domain & Hosting
A domain a weboldalad neve (pl. sajatbrand.hu). A hosting az a hely, ahol a weboldalad fut.
- Domain vásárlás: Namecheap, Cloudflare
- Hosting: Netlify, Vercel, Wix, Squarespace
- DNS alapok: A‑record, CNAME
1. rész
Weboldal‑készítés alapok (non‑tech)
Amit érdemes tudni, mielőtt weboldalt indítasz – kódolás nélkül.
2. Website Builder rendszerek
Kód nélküli weboldal‑készítés kisvállalkozóknak.
- Wix – gyors, egyszerű
- Squarespace – szép design
- Webflow – profi, részletes
- Webnode – magyar nyelvű, kezdőbarát
3. Branding alapok
- Színpaletta: 1 fő szín, 1 kiegészítő
- Tipográfia: max 2 betűtípus
- Képek: egységes stílus, jó minőség
- Logó: egyszerű, olvasható
4. SEO alapok
- Oldalcím (title)
- Meta leírás
- Gyors betöltés
- Mobilbarát design
5. GDPR & Cookie Banner
EU és UK területen kötelező.
- Adatkezelési tájékoztató
- Cookie banner
- Űrlap hozzájárulás
6. Biztonság alapok
- HTTPS
- Erős jelszavak
- Biztonsági mentés
2. rész
Webfejlesztés alapok (tech)
HTML, CSS és a fejlesztői eszközök, amikkel a weboldalak valójában épülnek.
1. HTML alapok
A HTML adja a weboldal váza – minden elem egy-egy "cimke" (tag) párral jelölve.
<h1>Cím</h1>
<p>Bekezdés</p>
<a href="#">Link</a>
<img src="kep.jpg" alt="Kép">- Minden tag-nek van nyitó és záró párja:
<p>...</p> - Az
altszöveg a képekhez kötelező (SEO + akadálymentesség) - Egy oldalon csak egy
<h1>legyen
2. CSS alapok
A CSS adja a megjelenést: színek, betűtípus, elrendezés.
body {
background: #0b1120;
color: #e5e7eb;
}
h1 {
font-size: 2rem;
color: #38bdf8;
}- Class-t (
.card) használj ismétlődő elemekhez, ID-t (#header) egyedi elemekhez - Flexbox / Grid a modern elrendezéshez sablon nélkül
- Mindig legyen mobilra optimalizált (
@media) nézet
3. IDE – a fejlesztői környezeted
A Visual Studio Code egy ingyenes, könnyen tanulható kódszerkesztő – ezzel dolgozik a legtöbb fejlesztő.
- Hasznos kiegészítők: Live Server, Prettier, HTML CSS Support
- Live Server: azonnal látod a böngészőben a változást mentés után
- Beépített Git integráció a verziókövetéshez
4. Deployment – az oldal élesítése
Ha kész a weboldal, fel kell tölteni valahova, hogy bárki elérje.
- Vannak ingyenes, gyors, GitHub-ból automatikusan frissülő szolgáltatások
- Saját domain hozzákötése DNS-en keresztül
- HTTPS alapból jár a legtöbb modern hosting szolgáltatónál
5. Beágyazások (embed)
Videó, térkép vagy közösségi média tartalom beillesztése egy <iframe>-mel, kód nélküli szerkesztéssel.
<iframe
src="https://www.youtube.com/embed/VIDEO_ID"
width="560" height="315"
allowfullscreen>
</iframe>- YouTube / Vimeo videó: a megosztott link "embed" változata
- Google Térkép: "Térkép beágyazása" opció a megosztásnál
- Instagram / Facebook poszt: a poszt saját beágyazó kódja
Ez csak az alapok
Kérj ajánlatot →
Szeretnéd, hogy profi csapat csinálja meg helyetted?
Ha nincs időd vagy kedved magad megcsinálni, megtervezem és felépítem helyetted – a designtól az élesítésig.