Najlepšie statické generátory stránok

Najlepšie statické generátory stránok


Proces vytvárania webovej stránky má dve časti: poskytujete obsah a potom váš CMS – WordPress alebo čokoľvek, čo sa rozhodnete použiť – vezme tento obsah, skombinuje ho s vybranou témou a vybratými šablónami a vytvorí z toho webovú stránku. pre vašich zákazníkov alebo čitateľov na čítanie. Ale tieto dve časti sa nemusia robiť spoločne: môžu byť od seba oddelené, a to je to, čo je statický generátor stránok (SSG) robí.

V tejto príručke vysvetlíme, čo je statické generovanie stránok a aké sú jeho výhody. Uvádzame zoznam desiatich najlepších generátorov statických stránok, ktorí poskytnú návod, ako si vybrať medzi nimi..

Ako funguje statický generátor stránok? A prečo ho používať?

Väčšina CMS, ako už bolo spomenuté, robí dve veci: premenia váš obsah na HTML kombináciou s vašimi témami a šablónami a potom sprístupnia tento HTML ako webovú stránku. Statický generátor stránok sa tento proces rozdeľuje na dve časti: časť, kde sa váš obsah zmení na HTML, sa vyskytuje na vašom vlastnom počítači a poskytuje priečinok plný súborov HTML. Tieto súbory HTML potom nahráte na web, kde sú dostupné ako webové stránky všetkým.

Ale prečo to urobiť? Existuje mnoho výhod.

Prvý z nich je zabezpečenia. Pretože váš web, s ktorým ľudia interagujú, je jednoduchý HTML a pre hackerov je oveľa ťažšie. A keďže statický generátor stránok, ktorý obsahuje všetok počítačový kód, ktorý funguje, beží iba na vašom vlastnom počítači a nie je vôbec vystavený širšiemu svetu, nemôže byť napadnutý. To znamená, že aktualizácie zabezpečenia sú väčšinou zbytočné; už sa nemusíte obťažovať pravidelnými kontextovými oknami, ktoré vám hovoria, aby ste aktualizovali svoj CMS, aktualizovali svoje doplnky, aktualizovali svoje stránky.

Pre niektorých to môže byť samo osebe dosť, ale pre generovanie statických stránok je to druhá veľká výhoda: výkon.

Webové stránky vyrobené zo statického HTML sa dokážu načítať oveľa rýchlejšie ako webové stránky, ktoré je potrebné pri každej návšteve spracovať. Namiesto toho, aby sa obsah a téma znova kombinovali zakaždým, keď si návštevník prezerá web, sa táto práca vykonáva raz za generáciu v počítači a potom už nie je potrebná. Namiesto toho je webová stránka už viditeľná.

Lepší výkon prináša výhody pre vaše webové stránky rôznymi spôsobmi. Vaši zákazníci s väčšou pravdepodobnosťou budú naďalej sledovať a miery odchodov sú nižšie,  Rýchlejšie načítanie stránky je pre SEO skvelé, pretože spoločnosť Google a ďalšie vyhľadávače oceňujú rýchly výkon a zvyšujú svoje hodnotenie.

Dopravné prepätia nie sú problémom; Ak naraz narazíte na nárast počtu návštevníkov, bude sa s nimi zaobchádzať v poriadku a nikdy nebudete vidieť jednu z týchto správ „502 Bad Gateway“, keď je stránka preťažená práve v okamihu, keď sa stane populárnou..

Pri všetkých strieborných obloženiach, aj keď existuje oblak, a na generovanie statických stránok musíte byť nepochybne pripravení na to, aby ste mohli používať túto techniku ​​na svojich stránkach, trochu viac technickej..

Toto oddelenie „fázy generácie“ a „fázy publikovania“ je potrebné pochopiť a generátory statických stránok majú vo všeobecnosti tendenciu predpokladať trochu viac základných technických znalostí ako štandardný druh dynamického CMS. Najmä väčšina statických generátorov stránok vyžaduje aspoň malú znalosť systému príkazový riadok: tieto aplikácie majú tendenciu byť poháňané spúšťaním príkazov, a nie ukazovaním a kliknutím.

Z dôvodu potreby príkazového riadku nemusia byť statické generátory stránok určené pre každého, ale ak ste pripravení zvážiť vyhrnutie rukávov a potápanie o niečo hlbšie, ako je obvyklé, je možné získať nejaké potenciálne víťazstvá.

Pozrime sa na desať najlepších generátorov statických stránok a potom na to, ako si vybrať medzi nimi.

10 najlepších statických generátorov stránok

1. Hugo

hugo logo

Hugo je na ľahšom konci generátorov statických stránok založených na termináli, ktoré sa dajú nastaviť a používať. Ich dokumentácia, najmä na ako nainštalovať Hugo a spustite ho, je celkom komplexný a nevyžaduje si, aby ste najskôr nainštalovali nový obchod s balíkami a potom nainštalovali Hugo z.

Má veľké množstvo preddefinované témy čo uľahčuje výber a výber vzhľadu, ktorý chcete pre svoje stránky, a jednou z kľúčových funkcií tímu Hugo je rýchlosť jeho budovania.

Vykonanie zmeny na vašom webe pridaním alebo úpravou obsahu alebo zmenou motívu si vyžaduje, aby ste stránku „prebudovali“: to znamená spustite proces kombinovania obsahu s motívom do HTML pre každú stránku. Dokonca aj malý rozdiel vo výkone rýchlostného zostavenia môže znamenať rozdiel medzi čakacími sekundami a čakacími minútami, aby ste videli výsledok zmeny, ktorú ste urobili..

Ak zostavujete web z existujúcich údajov, potom je Hugo „Obsah založený na údajoch“Umožňuje relatívne ľahkú dostupnosť obsahu stránok vo formátoch CSV alebo JSON. Môže to byť užitočný spôsob, ako pohodlnejšie zachytiť niektoré existujúce údaje, ktoré chcete svetu vystaviť, aby mohli prehľadávať a navigovať bez toho, aby museli spustiť Excel alebo Tabuľky Google..

2. Jedenásť alebo 11ty11ty logo

11ty je jedným z novších SSG, ale objavuje zoznam popularity. Účtuje sa ako „jednoduchší generátor statických stránok“. Vyžaduje si to však primeranú technickú znalosť (a jej dokumentácia to odráža), ale pre tých, ktorí ju dokážu pochopiť, robí veci elegantným spôsobom.

11ty je napísané v JavaScripte a vyžaduje to Node.js pracovať; Ak ste tak ešte neurobili, musíte ju nainštalovať a potom z príkazového riadku nainštalovať 11ty.

11ty má silný pohľad na výkonnosť webových stránok do tej miery, že hrdo zobrazujú a rebríček výkonnosti webových stránok vytvorených s týmto webom a je veľmi populárny medzi profesionálmi na webe a tými, ktorí spravujú a budujú otvorený web všeobecnejšie.

3. Pelicanzískajte logo pelikán

Pelican má skôr vysunutú estetiku, ale používa Python ako svoj základný programovací jazyk, má potenciál byť rozšírený takmer ľubovoľným smerom, s trochou dodatočného programovania..

Podporuje import údajov o webe z WordPress, čo uľahčuje prechod z existujúceho webu WordPress na generovanie statických webov ako iné SSG bez straty aktuálneho nastavenia. A rovnako ako lepšia trieda SSG je navrhnutá tak, aby dokázala spracovať celú webovú stránku, a nie primárne na blogovanie.

Pelican však má spočiatku mierne strmú krivku učenia, vďaka čomu je vhodnejší pre niekoho, kto je s Pythonom už aspoň trochu oboznámený. Podobne budete už potrebovať inštaláciu Pythonu vo svojom počítači a pre vývojárov, ktorí to nemajú, nie je poskytnutá žiadna príručka … ale ak ste typ vývojára, ktorý už Python používa, potom je Pelican dobrým miestom na spustenie..

4. Nikola

nikola logo

Nikola pristupuje k vytváraniu statických stránok veľmi „vrátane batérií“ a poskytuje veľmi podrobné šablóny pre blogovanie a úplné webové stránky, ale tiež galérie obrázkov a vyhľadávanie okrem iného..

Má pomerne rozsiahly zoznam plugins a tém. Hoci Nikola má tendenciu smerovať k technickejšiemu koncu trhu; budete musieť byť celkom istí vývojom Pythonu, aby ste urobili viac, ako je tu uvedené, ale ak ste potom, Nikola ponúka väčšiu rozšíriteľnosť ako mnoho alternatív..

Zoznam tém nie je príliš komplexný, takže ak hľadáte niečo krajšie ako informatívne, potom môže byť lepšie hľadať niekde inde. Rýchlosť obnovy je však rýchlejšia ako väčšina ostatných možností.

Podobne ako Pelican aj Nikola predpokladá, že už máte Python k dispozícii a nevysvetľuje, ako je to možné, takže ak nemáte a používate systém Windows, možno by ste sa mali pozrieť na jednu z ďalších alternatív..

5. GatsbyLogo Gatsby

Gatsby sa nazýva statický generátor PWA. PWA je termín umenia pre Progresívne webové aplikácie, ktoré môžu pracovať v režime offline, môžu sa pridať na plochu na mobilnom telefóne atď. Je možné to urobiť na ľubovoľnom webe, vrátane webov generovaných inými SSG, ale Gatsby túto podporu poskytuje už po vybalení..

Pre tých, ktorí sú oboznámení s knižnicou webových komponentov React, môže byť Gatsby dobrou voľbou, pretože je postavená okolo nej, takže môžete znova použiť známe prostredie, ktoré už poznáte – skutočne, Vlastné webové stránky spoločnosti React je postavený s Gatsby.

Gatsby vyžaduje node.js a systém riadenia verzií git nainštalovať. Majú pomerne podrobný súbor stránky dokumentácie o tom, ako nastaviť prostredie Gatsby, a to aj vo Windows, ale je to skôr zapojený proces, ak nie ste oboznámení s príkazovým riadkom. Dokumentácia tiež kombinuje pokyny pre Windows, Linux a Mac dohromady, takže je trochu ťažké ich dodržiavať.

6. Jekyll

Jekyll logo

Jekyll je jedným z najstarších generátorov statických stránok, ale stále sa vyvíja aktívne a jeho popularita vo veľkej miere vyvolala záplavu inovácií SSG, ktorá priniesla všetko ostatné v tomto zozname.

Jedným z jeho nárokov na slávu je to, že je zabudovaný do služby hostenia kódu Github: je možné uložiť váš obsah do Githubu Úložisko, cloudová jednotka pre kód takým spôsobom, že Github spustí kód Jekyll pre a prevádzať obsah na webové stránky bez toho, aby ste museli spúšťať akýkoľvek kód.

Týmto spôsobom Stránky Github služba môže byť použitá ako hostiteľ pre vaše statické webové stránky zadarmo a dokumentácia, ako to nastaviť, je pomerne jasná a ľahko sledovateľná.

Bude si to však stále vyžadovať určité znalosti git systém na kontrolu kódu. Samozrejme je tiež možné spustiť Jekyll sami na svojom počítači, ktorý vám poskytnú súbor pokynov na inštaláciu systému Windows, Windows však nie je oficiálne podporovaný.

7. Statiq.web

logo statiq

Web Statiq je pomerne novým prírastkom do radov SSG a stále sa vyvíja pomerne intenzívne. Preto sa najlepšie hodí pre tých, ktorí sa chcú zapojiť do tohto procesu a pripojiť sa ku komunite tým, že poskytujú spätnú väzbu, čo funguje dobre a čo nie..

Jeho jedinečný predajný bod spočíva v tom, že je postavený na platforme .NET, takže používatelia s určitými znalosťami tohto programovacieho balíka nájdu web Statiq pekne podľa svojich súčasných skúseností. Je to príklad projektu všeobecnejšieho rámca Statiq, takže skúsenejší programátor môže byť schopný prijať širší rámec a vytvoriť niečo komplexnejšie..

8. Publii

Publii logo

Publii, na rozdiel od väčšiny ostatných statických generátorov stránok, nie je nástrojom príkazového riadka. Namiesto toho je to počítačová aplikácia, ktorá je k dispozícii pre systémy Windows, Mac a Linux.

Môžete to považovať za niečo podobné WordPress, okrem toho, že namiesto toho, aby to bola webová stránka, je to aplikácia, ktorá beží na vašom počítači a potom generuje statickú verziu webovej stránky, pripravená na zverejnenie rovnako ako ostatné nástroje..

K dispozícii sú vstavané nástroje na publikovanie, ktoré posúvajú statickú webovú stránku na množstvo existujúcich hostiteľov, ako sú napríklad lokality Netlify a cloud hosting. Má importný systém na konverziu existujúceho webu WordPress na Publii a trh platených tém na profesionálnej úrovni.

Samotná aplikácia je bezplatná a má otvorený zdroj a má aktívnu komunitu používateľov, ktorí si navzájom pomáhajú na diskusnom fóre. Publii je najmenej technický statický generátor stránok, ktorý je v súčasnosti k dispozícii, pričom má stále všetky svoje výhody. Pre niekoho, kto sa nechce dostať do prístupu založeného na kódovaní a príkazovom riadku, je to vynikajúce riešenie.

9. WP2Static

wp2static logo

WP2Static má dosť odlišný prístup ako ostatní generátory statických lokalít: nie je to samotný správca stránok. Namiesto toho pracuje ruka v ruke s programom WordPress, aby sa vytvorila statická verzia webu, ktorý je spravovaný samotným WordPress.

V jazyku vyššie uvedeného popisu ponecháva program WP2Static zodpovednosť za úpravy a premenu obsahu na HTML kombináciou s témami a šablónami. Potom vstúpte do programu WP2Static, aby ste prevzali tento kód HTML a zverejnili ho ako obyčajný HTML niekde na webe.

Z toho vyplývajú niektoré zrejmé výhody: môžete naďalej používať rozhranie WordPress, ktoré poznáte, a máte prístup ku všetkým rozsiahlym súborom tém a doplnkov WordPress..

S tým však súvisia aj nevýhody: je dôležité presunúť inštaláciu WordPress na iné miesto, inak prídete o väčšinu výhod generovania statických stránok..

Mať statický web poskytuje veľké výhody zabezpečenia, pretože nepoužívate dynamický produkt, ako je WordPress, ale s týmto riešením získate stále používa WordPress. Je preto dôležité skryť tento WordPress niekde, kde sa k nemu nemôže dostať nikto okrem vás.

Technicky zmýšľajúci pracovník ho môže presunúť na skrytý server alebo na svojich miestnych počítačoch spustiť program WordPress. Niekto, kto nerozumie, ako to urobiť, môže byť ťažké sledovať príslušné koncepty a môže byť mätúce pamätať si, že web, ktorý vygeneruje (skrytý) WordPress, nie je web, ktorý verejnosť vidí až do tlačidla publikovania. sa stlačí.

Ak ste však na používateľské rozhranie WordPress veľmi zvyknutí alebo ste silne viazaní na konkrétne doplnky alebo témy WP, ktoré by bolo ťažké nájsť alebo sprístupniť na inom SSG, môže byť WP2Static ideálnym riešením..

10. Next.js

Logo spoločnosti Nextjs

Next.js je menej generátorom pre statické stránky a viac rámcom pre vytváranie statických aplikácií pomocou React. Podporuje statické generovanie stránok (a túto podporu vylepšila, aby sa výrazne zlepšila v vydaní 9,3 na začiatku roku 2020), a ak chcete vytvoriť aplikáciu s Reactom a chcete, aby sa táto generácia statickej stránky podporovala v tej najlepšej triede, Ďalej .js je dobré miesto na pozeranie.

Predpokladá dobrú znalosť JavaScriptu a Reactu, takže to nie je pre netechnické a dokumentácia sa prikláňa k prostrediu Linux alebo Mac s lip-service platenou používateľom Windows.

Ale za to, čo to stojí za to, je to veľmi dobré a okolo toho je dosť bzučanie, čo znamená, že sa to výrazne rozvíja a posunuje sa dopredu a skokom..

Ako si vybrať ten správny?

Tam to máte: zoznam, z čoho vyberať.

Ale ako si vyberiete ten, ktorý je pre vás najlepší??

Ak nemáte záujem dostať sa na príkazový riadok, určite sa pozrite na Publii. Ak ste odborníkom na WordPress, ktorý sa snaží zostať statický, potom program WP2Static stavia na tých rozsiahlych zručnostiach, ktoré už máte. Ak vám záleží na rýchlosti, 11ty alebo Hugo sú vaše miesta, ktoré by ste mali hľadať.

Ak máte skúsenosti s konkrétnym programovacím jazykom alebo prostredím, vyberte statický generátor stránok napísaný s týmto jazykom, aby ste čo najlepšie využili vaše existujúce zručnosti: pre Python použite Pelican alebo Nikola; pre Ruby, Jekyll, pre .NET, Statiq, pre React sa pozrite na Next.js a Gatsby a pre JavaScript, 11ty.

Ak sa sťahujete z existujúcej stránky WordPress, nezabudnite skontrolovať, či má váš nástroj na výber dovozcu obsahu WordPress (väčšina z nich), a uvedomte si, že experimentovanie je lacné a ľahké. Môžete si vytvoriť testovaciu statickú stránku s nejakým príkladom obsahu a vygenerovať ju iba na svojom počítači bez toho, aby ju ktokoľvek videl.

Vyskúšajte nástroje, ktoré sa vám páčia – všetky sú bezplatné a open source – a potom, keď budete pripravení, začnite hľadať miesta, kde môžete hostiť svoj statický obsah..

Jeffrey Wilson Administrator
Sorry! The Author has not filled his profile.
follow me