Egy honlap állhat csupán képekből és az ahhoz írt címekből is, de lássuk be, egy valamire való honlap mindig tartalmaz önálló szövegrészeket, szöveg blokkokat. A szövegezés képezi a honlapod gerincét, ez a legfontosabb módja az információ átadásának egy honlapon. Nézzük meg honlapépítőnkben milyen eszközök állnak rendelkezésünkre ha nagyobb szövegmennyiséget szeretnénk megjeleníteni.
A feketeöves tartalomkezelő
Honlapépítőnk számos különböző típusú sávjában van lehetőség szövegek megadására. A többségük azonban csak a képet kiegészítendő vagy kommentálandó szövegként funkcionál. Ez is értékes, de az igazi, feketeöves sávunk, mely kifejezetten szövegek kezelését célozza, az a Szövegszerkesztő sáv. Ezen sáv egyik legnagyobb előnye, hogy gyakorlatilag korlátlan mennyiségű szöveget képes kezelni, a másik pedig, hogy a jól ismert szövegszerkesztő szoftverek funkciói köszönnek vissza benne. Használhatunk különböző kiemeléseket, címsorokat, igazíthatjuk a szöveget, balra, jobbra, középre, alkalmazhatunk sorkizárt elrendezést, vastag és dőlt betűket, linkeket. Magának a szövegszerkesztő sávnak is van pár beállítási lehetősége, úgyhogy nézzük meg részletesebben mik is ezek.
Több rejlik benne, mint gondolnád
Miután létrehoztunk egy szövegszerkesztő sávot honlapunkon, az automatikusan beilleszt némi halandzsa szöveget. Ezt hívjuk vakszövegeknek, melyek legismertebb változata általában a “Lorem ipsum dolor sit amet” vagy simán “Lorem ipsum” frázissal kezdődik. Ezen vakszövegek egyetlen funkciója, hogy illusztrálják a tartalmat, mintha már feltöltöttük volna saját szövegünket. A mi Szövegszerkesztő sávunk esetében azonnal képet kapunk egy lehetséges tördelési rendről, azaz: cím, kenyérszöveg, belső cím és megint kenyérszöveg. Fontos, hogy ezt a szöveget mindig cseréljük le a sajátunkra, ne hagyjuk fent honlapunkon, mert hanyagság és igénytelenség látszatát kelti, ha az olvasók vakszöveggel találkoznak weboldalunkon.
Az első amit a szöveges tartalmunk esetén el kell döntenünk, hogy hány oszlopban jelenjen meg. Igen, ilyet is lehet. A sávbeállítások közt (bal felső sarokban fogaskerék ikon), kiválaszthatod, hogy 1, 2 vagy 3 oszlopban szeretnéd megjeleníteni a szöveget. Továbbá két oszlop esetén választhatsz fele-fele vagy egyharmad-kétharmad arányú elosztások közül.
Beállíthatod a szöveges sávod háttérszínét is. Ez különösen jól jöhet, ha egy adott szövegblokkot jobban ki szeretnél emelni a többi közül. De használhatod a háttérszínt címek kiemelésére is, miközben a szövegtörzset háttér nélkül hagyod. Ehhez több szöveges sáv beilleszétésére lesz szükség, de erről még lejjebb olvashatsz.
A fentieken túl, ahogy a legtöbb sávunk esetén, úgy itt is beállíthatod a a sáv alsó és felső térközét. Ez különösen akkor hasznos, ha több szöveges sávot egymás alá téve kell elérni szép szövegképet.
Légy te is profi szövegtördelő
Ha már megvan a szövegünk és elhelyeztük az oldalon, akkor jön a nagy kérdés. Mitől lesz ez átlátható és szép? Nos, ehhez most megpróbálunk a segítséget adni.
Egy nagy, ömlesztett szövegmennyiség tördelés nélkül minden olvasót el fog riasztani. A cél egy olyan szövegszerkezet kialakítása, melyben gyakran vannak törések, váltások, belső címek.
Tehát az első amit tennünk kell, hogy a szövegbe kattintva, az előugró kis panelen az adott szövegrészek kijelölésével szépen cizelláljuk a szövegünket. A címeknek adjunk Fejléc 1 stílust, a belső címeknek Fejléc 2 stílust. Ha van alcímünk akkor azt is beállíthatjuk. Lehetőleg a törzsszöveg ne legyen két három rövid bekezdésnél hosszabb a következő belső címig. A panel segítségével helyezzünk el a szövegben kiemeléseket. Erre ne a Fejléc és egyéb opciókat használjuk, hanem a félkövér esetleg a dőlt + félkövér opciókat.
A szövegeket, hacsak nem indokolja valami különleges helyzet, lehetőleg mindig balra zárjuk. A nyomtatott médiában a sorkizárt szöveg használata alapvető, természetes dolog, mivel sokkal szebb szövegképet ad a balra zárt szövegnél. Ez akár még egy honlapon is igaz lehet, azonban hacsak nincs valamilyen egyedi eset, weboldalon ne használjuk a sorkizárt elrendezést. Ennek első számú oka, a weboldalak azon sajátossága, hogy különböző méretekben, különböző képernyőkön kell megjelenniük. Egy sorkizárt szövegdoboz egy kis képernyőn, (pl. telefonon), akár olvashatatlanul is ronda lehet, mivel az egy sorban lévő szöveget a szövegdoboz teljes szélességére automatikusan széthúzza. Számos egyéb oka is van ennek a jelenségnek, melyet nincs értelme részletezni. Mindenki kipróbálhatja szabadon saját honlapján is, kísérletezni bátran lehet!
Szöveg mint grafika, vagyis ami tördelésen túl van
A konkrét szabályok itt véget értek, azonban tudunk adni még pár tanácsot, hogyan legyen már-már nyomtatási minőségű honlapunk szövegképe. Van egy sablonunk, mely kifejezetten a szövegtördelést hivatott bemutatni vakszöveggel: https://typography.domdom.eu/
Ezen oldalon is látható pár trükk, mely hasznos lehet, de nézzük mire érdemes figyelni nagyobb szövegmennyiség esetén:
- Mindig használjunk több szöveges sávot, ezáltal sokkal tagoltabb összképet kaphatunk (https://security.domdom.eu/about-us)
- A címek kerülhetnek akár külön sávba középre rendezve, míg a kenyérszövegek alattuk balra rendezve. (https://the-band.domdom.eu/)
- Ha van rá lehetőségünk használjunk az oldalon 1-2-3 oszlopos elrendezéseket ezzel is csökkentve a szöveg nagy tömegének érzését (https://architect.domdom.eu/the-office)
- Használjunk alcímeket, belső címeket (https://geographer.domdom.eu/resume/)
- Létrehozhatunk önálló kiemeléseket Fejléc szövegekből, vagy háttérszínt alkalmazásával (https://accountant.domdom.eu/services, https://dairy-products.domdom.eu/contact)
- Alkalmazzunk bátran félkövér és dőlt szövegeket, továbbá ne feledkezzünk meg róla, hogy linkeket is elhelyezhetünk a szövegben.
Még egy utolsó, de annál fontosabb dolog: a szövegszerkesztő sávba képeket is el tudunk helyezni. Ezt a szövegbe kattintáskor felugró panel kis kép ikonjával tehetjük meg. Figyeljünk rá, hol áll a kurzor, mert a képet a rendszer oda fogja beilleszteni.
Mivel alapvetően egy nagyon könnyen és egyszerűen kezelhető sávról van szó, így bátran lehet kísérletezni minden opciójával. Azért is érdemes nem egy nagy, hanem több kisebb szövegblokkban, Szövegszerkesztő sávban gondolkodni, mert így egy elrontott sáv könnyedén törölhető és újrakezdhető.
Amennyiben nehézségekbe ütköznél a szövegírással, vagy egyszerűen nem tudsz elég tartalmat létrehozni, kreatív szövegírónk, tud ebben is segíteni!