8. 9. 2006 v sekci webdesign:

Zásady čistotného kodera

Kóduju, kóduješ, kódujeme ve všech pádech.

Kóduju, kóduješ, kódujeme ve všech pádech. Když si člověk bastlí kód sám, tak je v podstatě jedno jak ho napíše (uživatel by měl dostávat kód nejlépe zkomprimovaný na minimální velikost a nejlépe ještě zagzipovaný).

Leč když už vás klient za kódování platí, nebo nedejbože pracujete v týmu, tak se vyplatí si hned na začátku projektu na hodinku sednout ke kafi a určit jednoznačné kodérské konvence. Když si totiž řeknete co kde kdy odsadit a v jakém stavu výsledky odevzdávat, tak si později ušetříte bezesné dny a noci nad cizím rozsypaným čajem.

Kaskádové styly vem čert, ty dokáže do jakéhos skoro OK stavu dostat jednoduchá funkce PSPadu, leč s přeformátováním HTML je na tom PSPad o něco hůře (a já lama si to prostě neumím nějak inteligentně přenastavit).

Tudíž předávám zlomek svých kódovacích konvencí široké veřejnosti :-) – vezměte si z nich, co uznáte za vhodné.

  • odsazujte dvěma mezerami nebo stejně nastaveným TABulátorem (tj. všichni ho máme stejně)
  • každý blokový element je odsazen od svého nadřazeného blokového elementu (div, ul, li,…)
  • víceřádkový obsah elemetu je odsazen, jednořádkový nikoliv
  • pravidlo 2 nemá význam v případě různých matrjošek
  • elementy stejné úrovně jsou odsazeny stejně
  • ukončovací element je odsazen stejně jako jeho počáteční element
  • řádkové elementy se neodsazují nikde a nikdy
  • kód je validní a well-formed (kdo by hledal chyby v nevalidním kódu)
  • související bloky se dají oddělit od zbytku kódu prázdným řádkem

Komentáře

08. 09. 06, 08.05

To je přesně to, s čím jsem poslední dobu zápasil. Klient mi „dal“ do teamu ještě jednoho člověka, který měl dělat statické stránky, zatímco já se měl plně věnovat programpvání e-shopu (aby klienti ušetřili, jsou schopni všecho).

Ale zmíněný pracoval pouze ve Frontpagei a nakonec jsem zjistil, že HTML vůbec neovladá. Dovedete si představit práci s kódem, který byl vyplivnut Frontpagem.

08. 09. 06, 08.46

Odsazování bych osobně rozhodně doporučil TABulátorem – dva znaky se mi zdají málo a k přehlednosti moc nepřispívají (IMHO). Navykl jsem si na pevných 5 znaků a kód je na první pohled strukturovanější a lze snadněji vypozorovat úrovně a zanoření jednotlivých prvků.

Jinak ti dle mého názoru vypadla poměrně důležitá věc pro psaní a následnou údržbu kódu – a sice KOMENTOVÁNÍ, především ve chvíli, kdy kód někdo další napojuje na CMS apod. je to nesmírně důležité vzhledem k efektivnosti práce.

Jinak fajn článek ;-)

08. 09. 06, 09.17

[1]bohuzel jo :)

jinak vyuzivam tu fci v PSPadu..nejak sem si zvyknul na to co to dela(obcas docela zvlastne..zvlast kdyz nezna nakej zastupnej tag..), ale da se tim jakejkoliv kod dostat do podoby ‚kterou znam‘..

  • jeste bych k tem zaladum pridal komentovat ukonceny divy..zvlast v rozsahlejsim webu..;o)
08. 09. 06, 09.31

[3] – to je právě výhoda správného odsazování.. vidíš co k čemu patří i po 1000 řádcích (ale máš pravdu, že i to se mnohdy hodí)

08. 09. 06, 09.50

[4] – Je super ze napr. PSPAD uz dokaze zobrazit suvisiace tagy, napr. DIVy. No bez komentarov sa zaobidem velmi tazko, v pripade, ze mam sablonu rozdelenu vo viacerych suboroch (hlavicka,paticka,apod.).
Ja osobne mam problem dodrziavat svoje koderske konvencie az pri naslednych upravach kodu (ked sa vyhovaram na to, ze nie je cas, a treba byt rychlo hotovy), teda nie pri prvom vytvarani sablony.

08. 09. 06, 10.23

Na odsazování bloků kódu doporučuji 4 mezery. Je to jakýsi programátorský standard. Nedávno jsem to četl v PHP coding standardu, takže případný spolupracující programátor z toho bude určitě mít radost :)

Dobré je také za uzavíracím divem u větších bloků kódu zapsat komentář, kterýto div vlastně uzavírám.

7. Hever
08. 09. 06, 11.20

Používám dvě mezery. Pětkrát bouchat do mezerníku, případně (v případě opravy kódu v nedomácím prostředí, které je inteligentně nastaveno) ještě pětkrát bouchat do backspacu apod. – to mi přijde docela otrava.

08. 09. 06, 12.03

Na odsazování kódu zásadně používat místo mezer tabulátor. Nastavení odsazení tabulátorů nechť si určí každý sám. Osobně používám nastavení tabulátorů odpovídajícímu dvěma mezerám, ale skutečně je nějakým standardem šířka čtyři mezery (bývá to i výchozí nastavení většiny editorů). V žádném případě však k odsazování nepoužívat mezery!!! Když použiješ mezery, tak je pak budu muset přepisovat na tabulátory, abych měl kód odsazený tak, jak chci já. Když použiješ tabulátory, tak se mi kód odsadí podle toho, jak mám nastavený editor. Čili rozhodně používat tabulátor pro odsazení kódu. Navíc jeden znak je ve výsledném kódu míň než čtyři znaky (nebo dva nebo pět, atd.), čili velikost výsledné stránky je menší (v případě, že to pak neprochází ještě nějakým filtrem, který odsazení ruší úplně).

08. 09. 06, 13.30

Zásadně tabulátor. Mám ho nastavený na 8 znaků, ale nepíšu nikdy tak, aby to na tom záviselo (pokud jsou třeba v komentářích tabulková data, tak ty formátuju mezerama). Prostě aby si každý mohl nastavit odsazování tak velké, jak se mu líbí.

> Kóduju, kóduješ, kódujeme ve všech pádech.
Nemělo by spíše být „ve všech osobách“?

08. 09. 06, 16.31

Používám téměř na chlup stejná pravidla + nějaké to lehké okomentování začátku a konce důležitých bloků. I když pracuji většinou sám tak se to hodí pro pozdější úpravy.

08. 09. 06, 17.56

Osobně dávám přednost mezerám, psával jsem na dvě mezery, ale pomalu přecházím na tři.

08. 09. 06, 22.08

Jen na okraj, používat pro odsazení mezery je VELKÉ PRASÁRNA. Oč je snazší stisknout 1×TAB než 2–4× SPACE.. Nehledě na to, že šířka zobrazení TAB se dá nastavit dle vkusu toho kterého kodéra.

Jen člověk, co neumí programovat, může doporučovat používání mezer. Nicméně, není divu, kodér HTML rozhodně není programátor, jen se naučil používat 20 primitivních značek. Nechtějme po něm více, jako po špičkovém programátorovi v C++..

09. 09. 06, 00.42

[11] Špičkový programátor v C++ je rozhodně schopen nastavit si tabulátor na příslušný počet mezer a nabude ostatní spolukódovníky obtěžovat „jedinou správnou teorií odstazování“.

Odsazování čtyřmi mezerami je na většině programátorských projektů a v programátorských firmách jistým standardem. Viz např. <a> C++ Coding Standard.

Btw, Radku, ty víš něco o špičkovém programování v C++, že můžeš takhle srovnávat? (-;

09. 09. 06, 00.43

Právě prgramování mě dovedlo k mezerám. Při kódování HTML je to v pohdě, ale právě C++ a Fortran mne „nutí“ k mezerám.

Netvrdím, že TABulátor je horší, prostě mi nesedí, někdy potřebuju zarovnat i trochu jinak než na šíři tabulátoru. Navíc, a to Radku jistě víte, se dnes programuje v takových IDE, že i tu mezeru skoro nestisknu.

09. 09. 06, 00.47

achjo. zase nějak vypadl odkaz:
http://www.chris-lott.org/…tandard.html#… – C++ Coding Standard.

16. dusoft
09. 09. 06, 17.55

2 medzery? Ale no… Na prehladnosti to urcite neprida.

Odporucam pouzivat styri medzery, co je aj standardom (nastavene od zaciatku) v mnohych programoch.

17. Petr
09. 09. 06, 18.31

[2] Co se týče komentování, tak je nejlepší psát html právě tak, aby komentování nebylo nutné. Zatímco u cecka je komentování skutečně nutností, xhtml je vůči tomu tak primitivní, že by nemělo vůbec být problém poznat která část k čemu slouží. Pokud je kod např , nemusí se psát že jde o menu ;) Mě spíš komentáře u koderu dokonce někdy vadí, protože stejně nevystihnou přesně to co kod :)

18. Petr
09. 09. 06, 18.32

[15] nejak vypadlo: div class=menu

19. thingwath
10. 09. 06, 00.54

[11] Ono se to většinou dělá, že se zmáčkne tabulátor a v texťáku se objeví nastavený počet mezer. Že by taková novinka ke špičkovým programátorům ještě nedoletěla?

[8] Trefil ses správně do komentáře číslo 8, protože přesně tolik činí šířka tabulátoru, kterou jsem ochoten nějakým způsobem uznávat jako standard :-)

Jinak ale zrovna u HTML (když už se píše ručně) je to úplně jedno, protože se prožene validátorem a použije se nějaký automaticky zformátovaný výstup. Což ostatně nebývá problém ani u jiných značkovacích ani programovacích jazyků.

Mimochodem – tabulátor!

20. Fred
10. 09. 06, 09.17

Neodsazuji vůbec, je to zvyk a je to někdy o dost menší, když potřebuji zdroj zpřehlednit použiji http://johno.jsmf.net/…eview-en.php
je to tam ke stažení http://johno.jsmf.net/…etty_source/

21. Fred
10. 09. 06, 09.19

A k těm pro jiné jazyky http://www.prettyprinter.de/index.php

22. korel
11. 09. 06, 10.58

[20] A není lepší opačný způsob? Během psaní odsazovat a v ostré verzi toto odsazení odstranit? A pokud jde opravdu o každý bajt, tak se můžou odstranit i další přebytečné bílé znaky, komentáře atd.
Nebo snad kvůli úspoře velikosti nepoužíváš ani enter?

23. noname
11. 09. 06, 15.57

také se hlásím k tabelátoru, cokoliv jiného je prasárna. Není to problém ani v C++ – když použijete dobrý editor (např. pspad), tak si můžete nastavit, že po stisknutí TAB vloží x mezer. Nebral bych to ale jako problémy, existují různé nástroje, které z hnusného kódu udělají hezký (pspad to sám umí na css a html)