Html class nevekben és CSS-ben lehet ékezetes betűket használni?

<nav>

<form class="s" action="/product_listing.php" method="GET">

<input name="keywords" value="" type="text" placeholder="Search for any seed or strain" required="required" />

<input name="search for cannabis seeds" type="submit" />

</form>

<a class="btn" href="/view_basket.php"></a>

<a class="btn" href="/checkout.php"></a>

</nav>

class="s"

hmm... latom te nem vagy tul tapasztalt programozo

meg nincs taspasztalatod nagy rendszerekkel.

majd ha talalkozol veletlenul ilyennel, gyokeresen meg fog valtozni a programozasi modszered

ma 10:52 nem értem, miért sértegetsz, amikor fogalmad sincs, hogy hol és min dolgozom. Pontosan azért szabom ilyenre a HTML és CSS kódom, mert olyan nagy rendszereken dolgozom, ahol eredetileg több mint 100 class volt. (!)

Amit persze egy logikusabb HTML struktúrával simán le lehetett csökkenteni 10 alá.

De ennyi erővel én is mondhatnám, hogy fogalmad sincs arról, hogy hogyan működik például a WebCore, vagy a V8. Azt is mondhatnám, hogy akkor sem tudnál írni egy HTML parsert és treebuildert, ha megfeszülnél...

De a kérdésre visszatérve, az ilyen class nevek, mint a:

btn, h, s, sp12

Simán megállják a helyüket. Ha megfelelő kódszerkesztő programot használsz, és jól strukturálod a CSS kódod. (Mondjuk LESS segítségével), akkor elég a megfelelő helyre egy komment.

Például

// Search form

nav.s

{

form

{

...

}

...

}

Ezt bizony sokkal egyszerűbb kibogarászni, mint azt a nagyjából 30 darab classt, ami így 2-3 darabbal kiváltható.

Mielőtt hüledeznél, hogy ez milyen rossz programozói gyakorlat, mert hát nem kommenttel kell jelezni, hogy mi mit jelent, hanem beszédes neveket kell használni, jelzem, hogy backend részen ezt a rendszert követem én is. Ott alig látsz kommentet, mert minden magáért beszél. De próbálj refactorálni egy más által írt több ezer soros CSS fájlt, és mire lesz belőle neked egy néhány száz soros, szépen strukturált kód, addigra te is fel fogsz venni ilyen szokásokat. És gondolj bele, hogy a markup is mennyit egyszerűsödött. Ott pár száz div (ezt hívják divtériának... :) ) eltávolítása után fennmarad az a nagyon egyszerű fa, amiről még a hülye is látja, hogy mi mihez tartozik és mit jelent, mivel szemantikus, szabványkövető kódot használ. Itt nem okoz gondot az, hogy a classnak annyi a neve, hogy 's'. Mert ha most látod először a kódot, akkor is max nyomsz egy Find in files-t '.s'-re, és 1 másodperc alatt világosan látod, hogy mi van. Mivel nem kell 100 darab helytelen angolsággal megfogalmazott class nevet bogarászni, hanem 10 nél kevesebb, egymástól teljesen elkülönülő, és funkciókra lebontott tag-et látsz, sokkal kevesebb vele a szívás. És bumm, a markup és a stylesheet kódja is 30-40%-al kisebb lett, az oldalon szemmel látható a gyorsulás.

Egyébként hasznos felhasználása az egy taghoz kapcsolódó több class-nak: újra felhasználható részekre bontani a kódot.

Például: class="btn inv" egy invertált háttérszínű gombot jelenthet. Mind a btn, mind az inv felhasználható külön-külön, és más classokkal együtt is.

És természetesen olyan oldalakon, ahol a józan ész ezt megköveteli, ott előfordul, hogy használok hosszú class neveket. Például, ha van egy oldal, ami elkülönül a többitől megjelenésben, akkor használok olyat, mint a .dashboard. Ilyenkor egyértelműbb, mert könnyebben ki lehet keresni a css kódból, hogy mi az, ami ide vonatkozik. Ez egy hasznos felhasználási lehetőség, hiszen így jelentéssel ruházhatod fel a hosszú class neveket a rövidekkel szemben.

Azt is mondhatnám, hogy akkor sem tudnál írni egy HTML parsert

hmm... hat egy html parsert irni nem egy tul nagy feladat... bar lehet, hogy neked az

eleg szanalmas, ha te az osztaly neveivel akarod optimalizalni a programot, es nem a megfeleloen atgondolt algoritmusokkal

elneheto, mert te meg valoszinuleg nagyon fiatal vagy..

en meg oreg es kiegett :)

Bocsánat, de HTML-ben milyen jól átgondolt algoritmusokról beszélsz? :) A JS és backend kód természetesen más. De HTML-ben és CSS-ben a böngészőprogramok algoritmusaira kell támaszkodnod, azokat kell amennyire lehet megismerni, profilozni a markup-ot egy összetettebb oldal esetében, stb. Mind írtam, JS-ben például érdemes ID-t adni a gyakran manipulált tag-eknek, illetve mutatóban eltárolni őket. Ha nem teszed meg, akkor disc IO-ra kényszerülhet például a böngésző, ami nem túl optimális, ha ismételten kell elvégezni. Ha mutatót tartasz az adott DOM elemre, akkor rákényszerül a böngésző, hogy memóriában tartsa, és ne disc cache-ben. Könyveket lehetne ezekkel megtölteni. A class nevek optimalizálására nem a memória vagy a processzoridő miatt van szükség, hiszen ha nem túl bonyolult a DOM, akkor a különbség elenyésző. Arról van szó, hogy a webfejlesztésben bizony a hálózat szűk keresztmetszet. Vagyis ha egy mód van rá, ne legyen túl nagy se a request, se a response. Számít az a 20-40% fájlméret különbség, hidd el nekem. Egyébként pedig a kevesebb class jobban átlátható, mint a sok, szerintem ez elég triviális. Tehát agilitás szempontjából sem mindegy.

Viszont fogalmam sincs, miért húztad fel magad. Eddig egy olyan dolgot nem mondtál, amitől jobb lesz egy programkód, egy jól átgondolt algoritmust sem említettél.

"elneheto, mert te meg valoszinuleg nagyon fiatal vagy..

en meg oreg es kiegett :)"

Akkor esetleg próbáld követni a világot.. :) Ma már a V8 a legnépszerűbb JS motor, WebCore a legnépszerűbb DOM builder. Ezekben pedig komoly optimalizálások vannak. Egy jól átgondolt JS program V8 alatt gyorsabban fut, mint egy kevésbé agyonoptimalizált C++ kód. Egy rosszul megírt JS program viszont 200-szor olyan lassú. Ez a különbség szerintem irtóra nem kicsi. Szóval érdemes odafigyelni az optimalizálásra, például a V8 motor erejét csak akkor tudod kihasználni, ha érted, hogy hogy működik.

Nemigazán sikerült meggyőznöd, én inkább maradnék valami ilyesminél:

<form action="/product_listing.php" method="GET">

<div class="search-box">

<input name="keywords" type="text" class="text" placeholder="Search for any seed or strain" required="required" />

<input name="submit" value="search for cannabis seeds" type="submit" class="submit" />

</div>

</form>

<a class="button view-cart" href="/view_basket.php"></a>

<a class="button checkout"><a href="/checkout.php"></a>

meg ennél:

#page-container > .content-wrapper > #content > .main > .posts > .post > .content

Azt mondjuk nem értem miért raktad nav blokkba, de az részletkérdés. :)

dehogy huztam fel magamat :))

arra akartam ravilagitani, hogy a kod attekinthetosege esetleg elorebbvalo mint a sebessegre valo optimalizacio.

a kodot lehet, hogy kesobb valami mas fogja modositani, es nem art, ha o is at tudja tekinteni, es egy egy-ket betus valtozonevnel nem biztos, hogy tudni fogja, hogy te mire is gondoltal