Често срещани грешки в оформлението на сайта
Радвам се да Ви посрещнем отново, скъпи приятели! В тази статия ще говорим за често правят грешки в оформлението на сайта. както и на един от най-общ оформлението като цяло.
Валидност на грим? Защо да го правя?
Тя ще изглежда, за да сте сигурни, малки проблеми ... работят? И перфектно. Но чакайте!
Не закриване тагове, нарушение на семантика, прикачени файлове, всички от които засягат преди всичко от качеството на вашия сайт! Не е необходимо да се злоупотреби с него, просто достатъчно, за да си свършат работата както трябва в началото.
По-долу можете да видите основни съвети за един от общата структура на създадения сайт, основното допустимата грешка, на които тя се подчертава в тази статия.
послепис Както е полезен инструмент за проверка на валидността на вашите уеб-страници, предлагам една обща validator.w3.org ресурс.
1. Бъдете внимателни с вложени тагове
Кой може да бъде застрахован срещу нелепо, или не им пука, когато кодиране грешки? Винаги за визуално разглеждане на писане.
Така че, когато пишете структура на уеб страницата замислена структура, но се оказа, нещо ужасно, започнете да проверявате всички тагове, прикачени файлове, отваряне и затваряне на всеки етикет и блок. Тъй като в този пример, ние научихме глава сайт за базата.
Има и други гнездящи грешки, а не като глобален, но това е много неприятно:
2. Не забравяйте за атрибутите на тага
Тъй като и аз говорихме за един от най-общ оформлението, а след това нека да се придържаме към този принцип. Често, например, по време на поставянето на изображения на уеб сайт с маркер от . пропусна да отбележи, като важен атрибут ALT = ».»
Повярвайте ми, това е важен "детайл"!
Този атрибут се използва за описание на снимката, ако той не е бил зареден по някаква причина. Това е важно не само за търсачките, но най-вече при дадено изображение е линк, и пренасочване на потребителя да ресурс или по друг начин.
Ето защо, не забравяйте за това, приятели.
Заглавия е h1-h6 тагове:
Списъци маркери (навигация)
- ,
- CSS файлове за основната структура на сайта и графичния потребителски интерфейс;
- стил на файла за да нулирате всички стилове по подразбиране дадени спецификация браузър, преди на сайта оформление;
- стил файл за изскачащ (модален) елементи на сайта и т.н.
- Тази презентация графики на вашия сайт;
- изображението не е част от редакционното съдържание;
- Вие трябва да повторите няколко пъти с изображения;
- Трябва да използвате спрайт за скоростта на изтегляне на страницата.
- и имат гнездови структурни елементи :
Код, който отговаря на тези условия, се нарича семантична, т.е. Всеки елемент на дадена уеб страница, съответстваща на правилното значение. Това, което аз съм всичко? С това искам да кажа, че много от тях просто не са в съответствие с тези прости семантични правила.
Пряка пример за нарушаването на семантика ще бъде като една и съща навигация:
В този пример, можете да кандидатствате CSS стилове може да се постигне желаният резултат на дисплея на навигацията, но всички логиката на документа "в канала".
Основното, което се опитвам да следвам семантиката и приятели!
4. Имената и идентификационни номера на класа елементи
Чрез определяне определен клас (клас) или идентификатор (ID) елемент на страницата, се ръководи в неговото значение.
Попитайте в името на семантични функции, за да ви помогне да се движите по стил и код структура:
Не се изброят много дълги имена на атрибути на стойности на данни, както е в примера по-долу:
Опитайте се да не искаме дълги и ясни ценности.
Когато работите по оформлението на сайта, на ваше разположение е винаги един файл със стил, който работите. Но стилове, така че е полезно да се разделят на групи. Например:
В зависимост от ситуацията, за да не се свържете няколко каскадни стилове файлове в маркера
страницата си, можете просто да ги свържете към стила база файл на вашия проект, или на някой друг файл, чрез използване на внос на CSS файл, като по този начин просто той да се удължи с минимум код «.css?»:Отначало бях веднъж задава този въпрос: в какви ситуации са по-подходящи за използване на HTML таг за показване на изображението, и в която CSS собственост фон изображение - фоновото изображение?
използване таг нужда, ако:
Фон изображение имот трябва да се използва, ако:
7. групиране CSS свойства
Често се срещнат в стил файлови големи количества код, който може лесно да се режат и поставени в по-компактен и разбираем вид. Помислете, например:
Много дълъг код, който може да бъде намалено до три пъти, като се използват свойствата на групи:
В този прост начин ние да доведе в нашия код по-грамотен вид, и хората, които ще бъде възможно да се работи с него в бъдеще само ще ви кажа "благодаря ти!".
8. Напиши четим код
Разбира се, всеки има свой собствен стил на програмиране, писане на код. Но тя винаги е удоволствие да се работи, когато кодът е написано ясно, с прикачени файлове, леко отстъп. В процеса на работа на вашия сайт, обема на кода ще се увеличи с няколко пъти! Дори и да сте единственият човек, който работи и ще работи по своя проект в бъдеще, трябва да имате пред очите ви е само на каша. Препоръчвам ви да се придържаме към "чист кодиране."
Например, много CSS код е написан на този стил:
А сега си представете колко има подобен код, за да пиша в стил, за да оформите целия сайт. След това ще разбие не само главата, но очите му, фигуриращ в нея, или се опитва да намери някакъв фрагмент за корекция.
Препоръчвам ви да използвате този запис или други подобни:
Съгласете се, този код е много по-разбираемо.
Ако ви е трудно и много необичайно да се коригира към новото - "чист" кодиране стил, опитайте се да се насилвате. Тя ще бъде само плюс.