10+1 typov pre kóderov webstránok

0
Web stránky - svetapple.sk

Poslednú dobu sa akoby roztrhlo vrece s PHP programátormi a kódermi webových stránok. Áno, naučiť sa tvoriť webstránky nie je zas až také ťažké. Ale tvoriť dobré a správne webové stránky, o tom sa dá nájsť len máločo. V tejto súvislosti Vám ponúkam 10+1 typov, ktoré som odpozoroval od bežných užívateľov internetu, ako aj tie, ktoré som objavil v praxi a začal ich používať. 

11. Tvorte validné stránky

Aj keď existujú kóderi, ktorí tvrdia, že W3C nevie ako funguje internet, mať validnú stránku nie je na škodu. Osobne pokladám Validator za obdobu achviementov v PC hrách. Rovnako, ako na dokončenie hry nepotrebujeme pozbierať všetky achviementy, ani na dokončenie stránky nepotrebujeme “vychytať” všetky chyby. To však neznamená, že to nemôžeme urobiť. Validná stránka síce nič negarantuje, ale zato dobre vplýva aj na robotov.

2. HTML5 + CSS3

Nikomu sa v roku 2015 nechce riešiť DOCTYPE, charset, ani podobné veci, ktoré sa museli riešiť pred desiatimi rokmi. Pokojne používajte všetko, čo Vám najnovšie technológie umožňujú. Mnoho nových elementov sa síce užívateľom IE lte 8 nezobrazí, ale berte to tak, že kopa ľudí niečo získa a málo ľudí niečo stratí. Na malé veci smelo používajte CSS3, veď svet sa nezrúti, ak ten-ktorý užívateľ IE8 neuvidí tieň pod boxom, alebo nebude mať oblé rohy. Väčšie veci, ako <canvas> však stále budete musieť ošetrovať iným spôsobom.

3. Používajte hotové riešenia

Hotové riešenia nielen skrátia čas tvorby webstránky, ale navyše používajú prehľadné a pekne štruktúrované kódy. Väčšinou je priložená bohatá dokumentácia, nie je tak nič jednoduchšie a šetrnejšie, ako používať Bootstrap, WordPress, Simple Image a iné pomôcky. V minulosti sa používali web tools z blueboardu a vsevjednom, teraz môžeme veselo používať hotové riešenia, ktoré nájdeme na githube, alebo na podobných portáloch. A napokon, ak časom svoj projekt odovzdáte inému programátorovi, bude s ním vedieť jednoducho pracovať. V opačnom prípade bude lúštiť Vaše kódy.

24. Responsive Design

Responzívne stránky sú dnes už default. Tak, ako bežnou súčasťou domácnosti je splachovací záchod, tak je bežnou súčasťou stránky Responsive design. Dávno sú preč časy, keď sme mali 15-palcové CRTčka a hádali sme sa, kto má väčšie rozlíšenie. Dnes sa na net chodí z mobilu, z tabletu, z notebooku, z čítačky kníh, aj z veľkoplošnej obrazovky v Hartwall Aréne. A pre toto všetko treba stránku prispôsobiť. Prečo uprednostniť Responsive design pred tradičnou mobilnou verziou? Nuž preto, že ideálne stačí na Responsive design pridať pár riadkov CSS, v horšom prípade aj trošku Javascriptu. Responsive design možno urobiť pre xy displayov, mobilná verzia je len jedna.

5. Viem, kde sa dá kliknúť

Užívateľa vie pekelne vytočiť, keď nevie, na čo na stránke môže kliknúť. Ešte viac ho to však vytočí, ak to nevie ani vtedy, keď sa na dané miesto dostal myšou. Hover, hover! Všetko, čo je na stránke klikateľné, by sa malo pri prechode myšou meniť. Počnúc stránkovaním až po submit button vo formulári.

36. Moderný dizajn

Tento bod sa hodí skôr dizajnérom ako kóderom, ale predsa. Zabudnite na starožitné dizajny, tie dnes nikoho nezaujmú. Sústreďte sa na moderný Flat design. Všetko jednoduché, málo farebné a hlavne VEĽKÉ

7. Štruktúrovaný kód

Pekne si usporiadajte kód, aby pod sebou boli vždy otvárací a uzatvárací tág. Dlhý súbor si podeľte na niekoľko malých. Určite nie je rozumný nápad do index.html natrepať aj CSS, aj Javascripty, aj Ajax, aj jQuery. V takom pírpade má index.html pol megabajtu a stotisíc riadkov. <link rel=”” href=””>, <script type=”” src=””>… Toto je dobrým a rozumným riešením

8. DRY

Či programujete v PHP, v ASP.NET, Ruby, alebo inom jazyku, Don’t Repeat Yourself. Neopakujte sa. Je to zbytočné a keď treba v budúcnosti niečo prerábať, tak to zabije zbytočne viac času. Na všetko, čo sa dá, používajte funkcie. Konkrétnu činnosť predávajte funkciám pomocou parametrov.

9. Objekt sem – objekt tam

Objektovo orientované programovanie je default. Dnes už nikto nechce špagetový kód, kde je napchaté všetko v jednom. Váš kód by mal byť jednoducho čitateľný, jednoducho upravovateľný a mal by pripomínať skôr html súbory, obohatené o PHP, nie PHP poprepletané s HTML. To najhoršie, čo môžete urobiť, je na začiatku index.php napísať <?echo ‘Obsah celej stranky vratane divov, spanov, tabuliek,… je vpísaný v tomto dive’?>. Nielen programátor, ale aj editor sa môže zblázniť.

10. Rýchlosť

Doba, kedy sme museli sledovať dátový prenos je chválabohu za nami. To však neznamená, že užívatelia chcú čakať na načítanie stránky pol minúty. Zrýchlite svoje stránky. Nenahrávajte súbory, ktoré nie sú potrebné pre danú podstránku, “nesourcujte” jQuery na podstránke, kde sa nevyužíva. Nepoužívajte 8 MB obrázky. Ušetríte nervy užívateľom i sebe. A v neposlednom rade, šetríte server.

11. Odpustite si mágiu

Robiť odkazy pomocou javascriptu, zakazovať klik pravým tlačidlom, bežiace texty, či divotvorné zvuky, ktoré sprevádzajú užívateľa na stránke by trebalo zakázať. Javascriptové odkazy väčšina robotov nevidí, čo má neblahý vplyv na SEO. Bežiace texty sú otravné ako upomienky zo sociálnej poisťovne, to isté platí pre zvuky. Tieto elementy sú vhodné iba na naprostom minime stránok. Aby som bol konkrétny – webstránka hudobnej kapely môže pochopiteľne obsahovať na pozadí zvuk, ale všade inde je to nevhodné.

 

5

 

Zdroj:itspecial.sk

About The Author

Volám sa Róbert Hallon, mám 18 rokov a v súčasnosti som študentom tretieho ročníka na súkromnej strednej umeleckej škole v Žiline kde študujem dizajn. Mojou záľubou sú Apple produkty s ktorými som spojený prakticky už takmer 10 rokov. Najradšej sledujem novinky z Apple a IT sveta. Rovnako tak sledujem nové trendy a špecialitou sú automobily, ktoré milujem rovnako ako Apple! Okrem iného som jeden zo zakladateľov www.svetapple.sk