Így neveld a blogodat

Sziasztok! Nagyjából ezer (és egy) éve nem jártam erre. Pontosan majdnem négy éve, de ki számolja... Ezúton ünnepélyesen megígérem, hogy a továbbiakban is csak ennyire leszek aktív, szóval négy év múlva megint számíthattok rám. Esetleg hamarabb. Terveim között volt, hogy amíg írom a tutorial posztokat (hol vannak már azok!), addig kitöltöm az időt pici magyarázó, alapozó posztokkal különféle webes apróságokról. Mivel ahhoz elég sovány a fantáziám, hogy minden héten véletlenszerűen rábökjek három jellemzőre, egyszerűen automatizáltam. Ha valakit érdekel, itt megtekintheti, kipróbálhatja: Web Jellemző Ötletek Feldob választott számosságú ötletet a választott webes kategóriából. Alapértelmezetten minden kategóriából válogat és öt ÖT letet dob be (hehe, micsoda szóvicc... én kérek elnézést). A felső csúszkával állítható a sötét vagy a világos nézet, mert 2025 van, emberek! A kategóriák a nevükre kattintva kizárhatóak, illetve kiválaszthatóak. Lehet, hogy megvalósítom ezt a tervet...

Sziasztok! Esik, sötét van és ilyenkor senkinek nincs semmihez kedve. Én sem haladok jól a Git cikkekkel, ezért megpróbálom közben a blogot is csinosítani. (Mert a halogatás életforma, nem állapot.) A kísérleteimet legtöbbször a Codepen oldalán csinálom, mert nagyon gyorsan és egyszerűen lehet prototípusokat felhúzni. A fejléccel sokat próbálkoztam, a blogbejegyzések címe még most sem tetszik igazán és azt sem tudom, pontosan hogyan foglom átalakítani a címkéket. De a legtöbb problémát mégis a kódblokkok dizájnja jelenti. Van három, ami mind más, de nem tudom, melyik lenne a jó irány. Az első sötétebb háttérrel dolgozik, ami a világos blogon jól mutathat. Egy Pen "new code boxes" (új kódblokkok) címmel Szuzstól ( @szuzs ) a CodePen oldalán. De kissé oldschool. Itt egy másik, ez a régi CSS-Tricks kódblokkok stílusát utánozza, amit nem szűnök meg imádni. Az az oldal zseniális. Egy Pen "CSS-...

Probléma Talán alapozó cikk, talán gyakorlati kérdés: hogyan kezeli a Blogger a képeket? Korábban a Primadonna blogon futottam bele Leah cikkében , amiben a egy képfeltöltő portál hibájára panaszkodott. Hogy a probléma még mindig előfordul, és hol jelentkezik, azt nem tudtam megállapítani (nem találtam olyan blogot, amit ő készített és valami nem jelenne meg), de később egy másik blogon találtam egy hasonló furcsaságot: Eltűnt kép, elcsúfult dizájn Nem állítom, hogy Leah problémája ugyanilyen hibára vezethető vissza, mert nem beszéltem vele. (Fogok, de előbb be kell mutatkoznom, és mi sem jobb bemutatkozás, mint cikket írni valaki háta mögött?) Valószínű, hogy egyéb képmegosztási kérdés lehet, de felpiszkálta a fantáziámat. Máshol is láttam a fentebbihez hasonló Tinypic megoldásokat, ezért fel kellett tegyem a kérdést: biztosan jó módszer így beemelni a dizájn elemeket...

Egy rövid szolgálati közlemény: Firefox és Chrome alatt gyakorlatiéag minden Blogspot (Blogger) oldal egy ronda piros hibaüzenetet dob, hogy veszélyes oldalra tévedtél, fordulj vissza. Ha ezt mégis olvasod, akkor figyelmen kívül hagytad ezt a figyelmeztetést. Nem tudni, mi okozza ezt. Talán reggelre megjavul. Válasz egyelőre nincs, de nem valószínű, hogy totális biztonsági rés keletkezett a Bloggeres szervereken az elmúlt húsz percben. Persze nem zárhatjuk ki, de Edge alatt minden remekül és fütyörészve üzemel.

Jó régen nem volt helyzetjelentés... Most sem a megszokott időben jövök vele. Azonban a pénteki poszt elmaradt, és ezt illik megmagyarázni. Egyszerűen elhavazódtam, így most péntekig biztosan nem lesz újabb bejegyzés, mert elfogyott a munícióm. Ezért elnézéseteket kérem. A gépem tökéletesen érzi magát, köszöni szépen, szóval nem technikai gondok. A családdal is minden rendben (legalábbis semmi szokatlan az eddigiekhez képest). Kisállat sem kapott valami egzotikus, nehezen gyógyítható betegséget, a két macskám továbbra is egészséges démon. A magánéletemben sem következett be változás. A munkám még mindig létezik. Ha valamire, akkor erre tudom fogni a kimaradást: április végén zártunk egy komolyabb projektet. Tudtam, hogy ekkor kicsit szűkösebb lesz az időm, de azt nem, hogy ennyire. Az elmúlt három hétben egy bejegyzésre nem futotta, kb. három órát írtam összesen. Hiába táraztam be nyolc posztot előre, egyszerűen elfogyott eddigre. Most pótolom a kimar...

Eddig a Gitet úgy használtuk, mint egy kibővített mentést segítő eszközt. Ez is egy lehetőség, de az igazán komoly cuccok csak most jönnek! Ebben az elméleti cikkben végignézzük, hogyan tudunk visszaállni egy korábbi állapotba. Git history A világunk tökéletlen, ismerjük be. Az emberek hibáznak néha, ez így van írás során is. Egy mentés, amit nem kellett volna, és máris megy a kukába az addigi munka. Na, itt jön be a verziókezelés a képbe. Ha már ennyit dolgoztunk azon, hogy azonosíthatóak legyenek a mentéseink, akkor használjuk is ezt ki: nézzük a history -t! A Git lehetővé teszi, hogy bármikor visszatérjünk egy korábban mentett állapotra, akár azért, mert az utolsó mentést elszúrtuk, akár azért, mert jó ötletnek tűnt a változtatás, de nem kellett volna. Sőt, akár ennél régebbre is visszamehetünk. Eddig a Changes fülön dolgoztunk elsősorban, most nézzük meg, mi van mellette: a History fülön találhatóak a korábbi mentéseink, ahogy a felső képen is lát...

Ez a gyakorlat opcionális, vagyis csak a legutóbb megtanultakat fogjuk gyakorolni, de azért ajánlom az elvégzését. Semmi extra, ez igaz, ám a gyakorlás a programozásban is legalább olyan fontos, mint bármely más technika elsajátításában. Megtanulható könyvekből, de csak akkor fogod tudni, ha képes vagy működtetni, ahhoz pedig gyakorolni kell, nincs mese. További fájlokat fogunk elvinni a commit fázisig. Nem csak újakat adunk hozzá, hanem régieket módosítunk és törlünk is. Persze, megtehetjük ezt ugyanazon egy fájlon (az elsőn), de azért legyen egy pici változatosság, készítsünk pár új szöveges fájlt. Első lépésként adjunk hozzá mondjuk egy újabb text fájlt a projekthez. Mindegy, mi a neve, mit tartalmaz. Ezt vagy a korábban hozzáadott fájlt módosítsuk. Minimális javítás a szövegben, vagy egy pici betoldás, kihúzás – az sem baj, ha nincs értelme. Én hozzáadtam a repóhoz egy újabb fájlt majd az elsőt minimális mértékben módosítottam. Így néz ki a módosítá...

Ez most egy hosszú gyakorlat lesz, mivel elindítjuk az első saját Git repónkat! Nem kell félni tőle, nem harap. 😊 Az első lépés, hogy elindítjuk a GH Desktop alkalmazást és belépünk (ha kiléptünk). A képen látható kedves kép fogad minket, vagyis valami ehhez hasonló. Oldalt láthatóak a repositoryk, amiket létrehoztunk… legalábbis, ha vannak ilyenek. Repositoryk Mint látszik, nálam vannak és nem is egyféle. Nálatok valószínűleg nem lesznek, de ez nem is baj, hiszen azért vagyunk itt, hogy létrehozzuk az elsőt! Vissza a kezdőképernyőhöz: a pirossal bekarikázott rész (új repo készítése a saját gépen) lesz a mi választásunk. Hiába emeli ki kékkel a tutorial repo készítést, ne válasszuk azt, mert hibát fog dobni, még akkor is, ha amúgy elkészíti. (Ez összetett, miért csinálja, ebbe ne menjünk bele. A Github feltételezi, hogy fizetős felhasználók vagyunk, holott nem.) ...

Némi elmélet következik megint. Az alapvető git funkciókról lesz most szó. Ezek: repository inicializálás (indítás), fájlok hozzáadása, módosítása és törlése, illetve ezen változtatások véglegesítése (commit). A verziókezelés a gitben egy folyamatot követ, ami elsőre elég hajmeresztően hangzik, de könnyű belejönni. Utána meg már izommemória. A nulladik pont, mielőtt bármiféle fájlt elkezdenénk írni, hogy inicializáljuk ( init ), azaz elkezdjük a respositoryt. Enélkül nincs miről beszélni, hiszen nem tudunk verziókezelni. Ez csak a repón belül működik. Minden fájl, ami kívül esik ezen nem a projekt része, a git nem tud róla. Minden fájl viszont, ami az inicializált repo mappájába tartozik (vagy almappájába), az bekerül. Ezért érdemes a legfelső mappában inicializálni a projektet, és utána az almappák automatikusan hozzáadódnak, mint egy belső mappában, és utána oda egyenként bepakolgatni mindent. Ha van egy inicializált repo, akkor kezdődhet a munka...

Ez egy képekkel alaposan megtámogatott gyakorlat lesz, amiben végigvezetlek Titeket a Github Desktop telepítésén és az alapbeállításokon. Vágjunk bele azonnal!

Mint azt írtam, az általunk használt verziókezelő rendszer a Git lesz. Továbbá a GitHub Desktop programot fogjuk vele használni. De hogy jönnek ezek össze? És pontosan mi az a Git?

A Git egy elosztott verziókezelő szoftver. Ez így tiszta kínai, szóval mielőtt ész nélkül belevágunk, beszéljünk egy kicsit magáról a koncepcióról. Azaz: mi is az a verziókövetés? És miért van rá szükség? Jöjjön egy elméleti bevezető!

A következő hetekben a verziókezelés és a Git nevű szoftver alapjaival fogunk megismerkedni. Ha valaha vesztettetek el fájlt holmi géphiba vagy figyelmetlen végleges törlés miatt, akkor ez a sorozat életmentő lesz. Esetleg történt olyan, hogy addig módosítottátok a legújabb készülő regény egyik fejezetét, hogy már teljesen elvesztett mindent az eredeti ötletből; majd jött egy olvasó, aki szerint az első változat volt az igazi? Ha nem, akkor egyrészt őszintén irigyellek titeket. Ha igen, akkor tartsatok velem, merüljünk el a Git rejtelmeiben!

Üdv mindenkinek! Nemrég írtam a különféle blog-megosztási módszerekről, köztük az Emailes megosztásról és a FeedBurner kapcsolatáról. A Google most adott ki egy közleményt, hogy ez a szolgáltatás megszűnik: a FeedBurner továbbá nem szolgál ki emailes megosztásokat. Illetve fel lehet jelentkezni, de email értesítőt nem kapnak a közzétett bejegyzésekről. Mi a javaslat helyette? Más szolgáltató. Rengeteg van, én is most szemlézem a piacot. Ha találok egy potens, ingyenes szolgáltatást, jelentkezem egy bejegyezéssel róluk.

Itt van a küszöbön az alapok sorozat következő nagy fejezete, amiben belekezdünk a Git tárgyalásába. Ezt követik majd a továbbiak, HTML, CSS, Blogger tagek (nem azok a tagek, hanem... mindegy, Blogger-specifikus programozás), JavaScript... Kicsit félelmetes az egyszeri blogger számára. De kell mindez? Tényleg fontos, hogy az ember értse a HTML-t kívülről-belülről, leprogramozzon magától egy teljes témát? A válasz egyszerű: nem. Ezért vannak a Blogger és a hasonló "no-code/low-code" platformok, azaz az olyan blogfelületek, amik lehetővé teszik, hogy minimális vagy akár semmilyen webes tudással esztétikus, szép kinézeteket alkosson az ember. Nem kell mindenkinek webprogramozással foglalkoznia csak azért, mert blogolni támadt kedve. Fontos leszögezni, és ezt talán nem hangsúlyoztam eddig eléggé: a tartalom minden felett áll. Ez igaz a blogokra, komolyabb weboldalakra, webshopokra is. A tartalom lesz az, amit a látogatók értékelnek, a tartalom az, amit a keresőmotorok érzékelnek...

Probléma Ebben a rövid cikkben egy kis CSS-t fogok bemutatni: hogyan lehet szöveggel körbefuttatni a képeket. Téglalap alakú képekről lesz most szó, bár egy későbbi cikkben kitérhetek arra is, hogyan lehet szabálytalan alakú képeket (vagy négyzetes, de átlátszósággal bíró, .png formátumú) képeket körbefuttatni. Mindenkit megnyugtatok: nem ennyire nehéz a téma, hogy ilyen sokat csúszott a cikk, egyszerűen ütemezési probléma merült fel. (Magyarán elfelejtettem, hogy nem írtam meg.) Megoldás elméleti háttere Egyszer már volt róla szó, hogy a tartalomért a HTML felelős, de a kinézetet a CSS állítja . (Az interaktivitást meg a JavaScript adja.) Ezért CSS-hez kell fordulnunk, mert ha csak simán egymás alá dobáljuk a szöveget és a képeket HTML-ben, akkor nem fogják körbeölelni egymást. Persze van egy másik megoldás is, ami Blogger-specifikus. A Szerkesztési nézetben is át lehet állítani, hogy a képet körbefussa a szövegünk, de kell hozzá egy kis ké...

Probléma Ebben a cikkben egy picit belemegyünk a színelméletbe, hogy megértsük, hogyan kezelik a böngészők a színeket. A weben használt leggyakoribb színértékekről fogok beszélni: a nevesített színekről, a hex-kódokról, illetve kitérek az RGB(A) színrendszerre és annak egy változatára, a HSL(A)-ra is.

Üdvi mindenkinek! A héten két kisebb témát hozok majd nektek. Mindkettőt a blog Google Analytics statisztikáinak elemzése közben találtam, korábbi keresőszavak voltak, amik valami okból mégis a blogra vezettek. Nem tárgyaltam még explicit a témákat, tehát úgy érzem, fontos, hogy szó legyen róluk. Tiszteletből azoknak, akik annak idején szomorúan lepattantak. Az első téma a színkezelésről fog szólni. Elsősorban a monitorra optimalizált színekről és színrendszerekről beszélek, nem a print lesz a fókuszban, hiszem a blogot mégiscsak képernyőn olvassuk. (Egy picit azért kitérek arra is, de nem vagyok nyomdai szakember vagy grafikus, hogy komolyabban elmélyedjek benne.) Azon belül a web lesz a fókuszban, azaz kódolás során hogyan lehet színeket megadni, mi a különbség az egyes rendszerek között és hogyan konvertálhatóak egymásba. A második téma a képek körbefuttatását fogja taglalni. Megnézzük a Blogger egyszerűsített szerkesztőjében hogyan lehet képeket szöveggel körbefuttatni, illetve azt...

Ha már megosztottuk a blogot a nagyvilággal, mindenki érdeke, hogy az időben be is töltsön. Ha az olvasóink azért hagyják el félúton az oldalt, mert egy perc után is csak teker és nem tölti be a képeket, az nem jó jel. Mit tehetünk? Optimalizáljuk a betöltési sebességet! Ez nem csak az olvasóknak jó, hanem a keresőmotorok is szeretik, vagyis a Google is előrébb fogja rangsorolni az oldalt. Nézzük meg, mit tehetünk a jobb sebesség elérésének érdekében!

Probléma Van egy blogunk, és mindez szép és jó. De hogy tudjuk megosztani a nagyvilággal? Hogyan szerezhetünk olvasókat, mi módon értesíthetjük őket, ha felkerül egy újabb bejegyzés? Illetve mi magunk hogyan tudunk feljelentkezni egy blogra? Erről szól a mai cikk. Megoldás menete Többféle módon is megoszthatjuk a blogunkat. Az első a szociális média fületek használata, amibe nem mennék bele, mert ehhez Ti biztosan jobban értetek (én magam annyira introvertált vagyok, hogy nem is használom ezeket). Szóval Facebook, Twitter, Instagram, TikTok... oké, azért az valahol nagyon meta, hogy valaki a arról készít egy tizenöt másodperces videót, hogy a blogot fényképezi, de hé, ha ez hoz olvasót, akkor ezt. Ilyen megosztó linkeket automatikusan ad a Blogger, minden bejegyzés mellé kipakolja. De ez posztokat oszt csak meg, az egész oldalt nem. Ilyen esetben a megoldás viszonylag egyszerű és igen hasonló mindenhol. Fogjuk a blog webcímét (URL), és megosztj...