Vzhled a pocit, nebo "styl" webových stránek je diktován CSS (Cascading Style Sheets). Jedná se o soubor, který přidáte do adresáře vašeho webu, který bude obsahovat různá pravidla CSS, která vytvářejí vizuální design a rozvržení vašich stránek.
Zatímco stránky mohou používat a často dělají, používají více stylů, není to nutné. Všechna pravidla CSS můžete umístit do jednoho souboru, a to jsou skutečné výhody, včetně rychlejšího načítání a výkonu stránek, protože není nutné načítat více souborů. Zatímco velmi velké podnikové weby mohou občas potřebovat oddělené styly, mnoho malých až středně velkých stránek může mít dokonce jen jeden soubor. To je to, co používám pro většinu z mé tvorby webových stránek - jediné soubory CSS se všemi pravidly, které potřebují mé stránky. Takže teď se stává otázka - co byste měli pojmenovat tento soubor CSS?
Základy pojmenování konvence
Při vytváření externího stylu stránek pro vaše webové stránky byste měli pojmenovat soubor podle podobných konvencí pojmenování pro vaše soubory HTML:
Nepoužívejte speciální znaky
V názvech CSS byste měli používat pouze písmena az, čísla 0-9, podtržítko (_) a pomlčky (-). Zatímco souborový systém vám umožní vytvářet soubory s jinými znaky v nich, váš server OS může mít problémy se speciálními znaky. Jste bezpečnější pomocí pouze tu uvedených znaků. Koneckonců, i když váš server povoluje speciální znaky, nemusí tomu tak být, pokud se rozhodnete v budoucnu přesunout poskytovatele hostingu .
Nepoužívejte žádné mezery
Stejně jako u speciálních znaků mohou mezery způsobit problémy na vašem webovém serveru. Je to dobrý nápad, vyhýbat se jim ve vašich názvech souborů. Dokonce jsem se snažil pojmenovat soubory jako PDF, používající stejné konvence, jen v případě, že je někdy musím přidat na webové stránky. Pokud máte pocit, že potřebujete místo pro snadnější čtení názvu souboru, použijte místo toho pomlčky nebo podtržítka. Například místo použití "this is the file.pdf" bych použil "this-is-the-file.pdf".
Název souboru by měl začínat písmenem
I když to není absolutní požadavek, některé systémy mají potíže s názvy souborů, které nezačínají písmenem. Pokud se například rozhodnete spustit soubor s číselným znakem, může to způsobit problémy.
Použijte všechny spodní části
Zatímco to není nutné pro název souboru, je to dobrý nápad, protože některé webové servery rozlišují malá a velká písmena a pokud zapomenete a odkazujete na soubor v jiném případě, nebude se načíst. Ve své vlastní práci používám malá písmena pro každý název souboru. Vlastně jsem zjistil, že to je něco, co se mnoho nových webových designérů snaží vzpomenout. Jejich výchozí akcí při pojmenování souboru je první znak jména. Vyhněte se tomu a zvykněte pouze na malá písmena.
Uložte název souboru co nejkratší
I když je ve většině operačních systémů limit velikosti názvu souboru, je mnohem déle, než je rozumné pro název souboru CSS. Dobrým pravidlem není více než 20 znaků pro název souboru bez rozšíření. Realisticky je něco, co je mnohem déle než to, že je těžké pracovat a odkazovat na tak!
Nejdůležitější část vašeho názvu souboru CSS
Nejdůležitější částí názvu souboru CSS není samotný název souboru, ale jeho přípona. Rozšíření není vyžadována u systémů Macintosh a Linux, ale při zápisu souboru CSS je dobré přidat jeden. Tímto způsobem budete vždy vědět, že je to stylový list a nemusíte soubor otevřít, abyste zjistili, co to bude v budoucnu.
Pravděpodobně to není velké překvapení, ale rozšíření vašeho souboru CSS by mělo být:
.cssCSS konvence pojmenování souborů
Pokud na webu budete mít pouze jeden soubor CSS, můžete ho pojmenovat podle libosti. Dávám přednost buď:
styles.css nebo default.cssVzhledem k tomu, že většina stránek, na kterých pracuji, obsahuji jediné soubory CSS, tato jména fungují dobře pro mě.
Pokud vaše webové stránky použijí více souborů CSS, pojmenujte listy stylů po jejich funkci, takže je jasné, jaké je účel každého souboru. Vzhledem k tomu, že webová stránka může obsahovat více stylových listů, pomůže rozdělit styly do různých listů v závislosti na funkci tohoto listu a stylích v něm. Například:
- Rozložení vs Návrh layout.css design.css
- Sekce stránky main.css nav.css
- Celý web s podsekcemi mainstyles.css subpage.css
Pokud vaše webové stránky používají určitý rámec, pravděpodobně si všimnete, že používá více souborů CSS, z nichž každá je věnována různým stránkám stránek nebo aspektům webu (typografie, barvy, rozložení atd.).
Původní článek Jennifer Krynin. Upravil Jeremy Girard dne 9.5.17