Головна HTML Як правильно верстати на HTML
Як правильно верстати на HTML

Будь-яка робота, а тим більше верстка, повинна бути виконана акуратно, тому що переробляти верстку надалі буде важче, тим більше, якщо створюється вона для популярного і корпаративного сайту. Що значить правильно верстати на html і css? І що необхідно робити, щоб стати професійним верстальщиком?

Переглядаючи різні сайти в Інтернеті, ми не дивимося в код HTML. Ну не беремо в розрахунок верстальщиків, яким цікаво подивитися на чужу роботу. Але досить буває тільки поглянути на html код, щоб скласти враження про самих творців сайту. Код HTML сторінок - це як дзеркало вмінь веб-майстра, який займався створенням сайту.

Заглянувши в код можна легко дізнатися про те, як зроблена сама сторінка: програмкою для створення сайтів пачками або руками html-верстальщика. Програма не має людської логіки і не помітить елементарних помилок, до того ж засмічуючи все своїми коментарями, непотрібними тегами і конструкціями. А псевдо "майстру" до цього немає справи, адже в його браузері все виглядає добре, а те, що браузерів існує безліч його не цікавить.

Створення мінімалістичного (чим менше коду в сторінці, тим краще для подальшої розкрутки сайту в пошуковиках), акуратного і працює у всіх браузерах - це своєрідне, але мистецтво. Особливо це помітно, коли ви створюєте сайт не для себе, а для роботодавця, який розбирається в html.

Зустрічаються сайти з дуже складною структурою, в яких робота верстальщика займає найбільше часу за весь період створення сайту. Приміром, складна вкладеність шарів, абсолютна позиціювання спільно з JavaScript кодом робить html верстку одним з найскладніших занять, без досвіду в яких складно нормально працювати і заробляти.

Щоб ваш код сторінки виглядав гідно, акуратно, вам було легко в ньому орієнтуватися, то уважно вивчіть нижчеприведені пункти і дотримуватися їх при написанні HTML:

* Писати html теги великими прописними літерами є неправильним (TABLE, BODY, IMG) - це перша ознака неручной роботи і в такому коді важко орієнтуватися, так як більшість коду в Інтернеті все-таки написано малими літерами (table, body, img) це є стандартом і весь html код, написаний малими літерами визнається html-валідатори невалідним!

* Атрибути завжди записуйте в лапках (напр., align = "right"), що додасть вашому коду акуратність і сумісність з мовою XML.

* Присвоюючи яке-небудь значення (ширини, висоти) в пікселях, не забувайте це вказати, тобто width = "5px". Наприклад, height = 23 буде помилкою, пріавльно писати height = "23%";

* Є теги, в яких немає закриваючого тегу (img, hr, br). У таких випадках треба закривати одиночний тег слешер, напр. <br />

* Зайві коментарі, якими програми засмічують код, не підуть на користь вашого сайту, а от ваші власні коментарі допоможуть розібратися через деякий час набагато швидше. Тим більше, якщо сайтом стане займатися інша людина;

* Намагайтеся не залишати стилі і JavaScript код в сторінці. Виводьте їх в окремі файли - так простіше що-небудь поміняти і код сторінки зменшиться (іноді дуже помітно);

* У будь-якого символу є своя заміна. У кожному довіднику по HTML є список цих підстановок. Бажано використовувати їх, що б не було проблем з переглядом в деяких браузерах.

Найчастіше при створенні сайту найбільше сил і часу приділяється візуальному дизайну сайту, з точки зору дизайнера, це правильно - адже саме його побачать рядові відвідувачі сайту. І часто економія на коді сайту може зіграти ведмежу послугу: збільшуються витрати на розкручування сайту (у тому числі і час), починають зявлятися проблеми з кросбраузерністю (зовнішнім виглядом у різних браузерах) сайту і в кінці-кінців, сайт доводитися переверстувати.

Як бачите, скупий (або ледачий) платить двічі, а то й тричі! Через таке ставлення, в інтернеті безліч сайтів з чудовим зовнішнім дизайном мають жахливий код, зроблений на швидку руку в WYSIWYG - програмі, осовоєнній не повністю. Не повторюйте помилок таких розробників, верстайте акуратно і красиво, виділяйте структуру коду, і завжди пам'ятайте, що мова HTML - основа сайту.

 

Коментарі  

 
0 #18 Rolandcibia 02.02.2018 09:48
Всем привет! класный у вас сайт!
Нашел интересную базу кино: Лучшие ужасы 2017 бесплатно
Тут: http://kinoserialtv.net/news/9242-premera-novogo-dublirovannogo-treylera-finalnyh-golodnyh-igr.html Премьера нового дублированного трейлера финальных «Голодных игр»
Тут: http://kinoserialtv.net/news/7935-dlya-spin-offa-zvezdnyh-voyn-nashli-horoshego-parnya.html
http://kinoserialtv.net/uzhasy/ 2017 список лучшие ужасы
Лучшие аниме смотреть онлайн
Лучшая фантастика список 2017 Лучшая фантастика список 2017
Цитувати
 
 
0 #17 Kerstin 25.01.2018 17:28
Howdy aare using Wordppress for your blog platform? I'm new to the blog world but I'm tryhing to get started and crreate my own.
Do you require any html coding expertise to maoe your own blog?
Any help would bee greatlky appreciated!

my homepage ... Antalya Escort
Bayan
Цитувати
 
 
0 #16 Octavio 16.01.2018 08:44
Hello would you mind sharing which blog platform you're using?
I'm looking to start my own blog iin the near future but I'm havig a hard time choosing between BlogEngine/Wordpress/B2evolution and Drupal.
The reason I ask iis because your design and style seems different then most bloogs and I'm looking for something completely unique.

P.S My apologies for being off-topic but I had to ask!

nilai mata kuliah pendas ut

Feel free to visit my webpage ... info beasiswa 2016 untuk mahasiswa
Цитувати
 
 
0 #15 Betsey 31.12.2017 15:37 Цитувати
 
 
0 #14 Vernita 02.12.2017 11:50
Fastidious answer back in return of this query with genuine arguments and telling everything regarding that.


My page - Wesołych świąt
żYczenia bożego narodzenia
Цитувати
 
 
0 #13 Kellye 01.12.2017 08:36
film rano
karno senyummu adalah tangisku

narji cagur keluar
dari inbox

http://tinyurl.com/y8en9lyj dygta karena aku sayang kamu
http://tinyurl.com/ycadlxbs lala karmela film
foto denada
abimana aryasatya keturunan tionghoa

my web-site; dewi lestari agama buddha
Цитувати
 
 
0 #12 Abby 29.11.2017 13:41
Generally I do not read article on blogs, but I would like to say that this write-up
very pressured me to try and do so! Your writing style has been amazed me.
Thank you, quite nice post.

Feel free to surf to my website como alimentarse para aumentar
masa muscular (sanliujiu.net)
Цитувати
 
 
0 #11 Christine 29.11.2017 08:05
Somebody necessarily assist to make seriously articles I would state.
That is the first time I frequented your website page and up to now?

I surprised with the research you made to create this particular put up incredible.
Fantastic process!

Feel free to surf to my web page dosage hormone
de croissance musculation
Цитувати
 
 
0 #10 Lashay 26.11.2017 11:42
I am actualloy grateful to the holder of this website who has shaed this impressive
paragraph at here.
mata kuliah tefl

Feel free to visit my website; fakultas di universitas negeri jakarta
Цитувати
 
 
0 #9 Jina 12.08.2017 23:55
When some one searches for his necessary thing, thus he/she needs to be available that in detail, thus
that thing is maintained over here.

Also visit my page foot pain cycling - kathleenurben.weebly.com
-
Цитувати
 

Додати коментар


Захисний код
Оновити

© 2008-2013 PHPist