аптымізацыя кода

  1. Памылкі ў html-кодзе
  2. Кроссбраузерность і стандартызаваны код
  3. аптымізацыя кода

У працэсе напісання кода немагчыма выявіць усе памылкі і выправіць іх. Напісанне кода, асабліва ў вялікіх аб'ёмах, справа манатоннае, у чым-тое нуднае і часта паўтаральнае, таму вачэй замыливается. Пошук і выпраўленне памылак з'яўляецца асабіста для мяне асобнай фінішнай працэдурай. Акрамя відавочных памылак часта усплываюць нелагічныя ўчасткі кода, якія таксама даводзіцца перапісваць, спрашчаць і касаваць.

Акрамя выпраўлення памылак і іншых недахопаў неабходна заклапаціцца аптымізацыяй кантэнту для пошукавых машын. Пашукавікі прад'яўляюць да сайтаў пэўныя патрабаванні, якія з кожным годам толькі множацца і калі вы не вырашылі мэтанакіравана зачыніць сайт ад індэксацыі, гэтых патрабаванняў варта прытрымлівацца.

Памылкі ў html-кодзе

Пачнем з памылак. Зусім няма чаго сядзець і вышукваць памылкі самому. Для гэтага кансорцыумам W3C прадастаўлены спецыяльныя сэрвісы. Код HTML можна праверыць з дапамогай html-валідатары W3C , А каскадныя табліцы стыляў - з дапамогай css-валідатары W3C .

У мяне на галоўнай старонцы дзве памылкі (было на момант напісання артыкула) - абедзве з-за тэга кнопкі google +, якога няма ў спецыфікацыі.

<G: plusone href = "http://nevor.ru">

Прыбіраем гэтыя неадпаведнасці і ніякіх прэтэнзій валідатар да майго коду не мае:

Але google + штука куды больш патрэбная, чым малюнак ад W3C, таму я пакіну гэтыя памылкі там, дзе яны і былі. Гэта не асоба істотна, асабліва калі асноўны код сайта валідацыю праходзіць.

Працуе валідатар W3C толькі са старонкамі, размешчанымі ў сетцы інтэрнэт. Калі ж вы хочаце праверыць лакальны сайт на прадмет памылак, рэкамендую карыстацца убудовай HTML Validator для Firefox. Убудова ўбудоўваецца ў інтэрфейс ўкладкі прагляду крыніцы кода аглядальніка (выклікаецца спалучэннем клавіш Ctrl + U) аглядальніка і грунтуецца на тым жа алгарытме, што і сэрвіс W3C. Выглядае ўсё гэта наступным чынам:

Убудова не толькі паказвае памылкі, але і дае рады з нагоды таго, як павінна быць. Я думаю, карыстальнікі Firefox па вартасці ацэняць гэты выдатны інструмент распрацоўкі.

Кроссбраузерность і стандартызаваны код

Ёсць яшчэ адна вялікая вобласць, названая кроссбраузерность. Я ўжо закранаў тэму кроссбраузерности ў гэтым артыкуле . Хоць гэта і нельга назваць памылкамі, адрозненні ў вонкавым выглядзе сайта ў розных аглядальнік прымушаюць не рэдка правіць спраўны (такі вось каламбур) код, каб дагадзіць капрызам аглядальнікаў. Самым капрызным быў ёсць і застанецца Internet Explorer. ёсць розныя хакі для Internet Explorer , Якія дазваляюць ануляваць гэтыя капрызы. Аднак, многія з гэтых спосабаў ўспрымаюцца валідатары як памылкі (па сутнасці імі і з'яўляюцца).

Таму я не раю выкарыстоўваць хакі. Замест гэтага можна ўмела карыстацца умоўнымі каментарамі, пра якія я таксама згадваў у артыкуле, прысвечанай кроссбраузерности. Прыклад ніжэй дэманструе як з дапамогай ўмоўнага каментара можна размясціць на старонцы спасылку на табліцу стыляў выключна для IE. Бо яна ходзіць за асноўны табліцай, яе стылі будуць па правілу каскадных перакрываць папярэднія (канфліктныя), даючы аглядальніку Internet Explorer іншыя ўказанні.

<Link rel = "stylesheet" href = "style.css" type = "text / css">

Праблема Internet Explorer'а яшчэ і ў тым, што ад версіі да версіі памылкі ў апрацоўцы змесціва html-старонак у гэтага аглядальніка розныя. Таму некаторыя праграмісты правяраюць свае працы асобна ў кожнай версіі Explorer'а. Задача ў некаторых выпадках сапраўды неабходная. А для яе выканання можна (і трэба) карыстацца праграмай IETester , Спецыяльна для гэтага створанай.

Таксама раю спампаваць партатыўныя аглядальнікі з сайта Portableapps.com , Распакаваць іх у асобныя тэчкі, а потым ўсталяваць і наладзіць плягін Open width (Firefox) для хуткай і простай праверкі сайтаў на прадмет кроссбраузерности. Розныя плэеры, галерэі і іншыя навароты таксама вельмі пажадана прагледзець ва ўсіх аглядальнік перад тым як ўкараняць. Балазе практычна заўсёды для гэтага размяшчаюць дэма-версіі. Гэта што тычыцца памылак.

аптымізацыя кода

Зараз трохі аб аптымізацыі кода. Заключаецца яна ва ўсяляк спрашчэнні канструкцый і рашэнняў, каб як мага больш скараціць аб'ём кода без страты якасці і функцыяналу (аптымізаваць). Паўтараюцца ўчасткі (як варыянт) можна аб'яднаць і прадставіць у выглядзе зменнай php.

$ Img = "<img src = 'logo.jpg' alt = 'лога'>"; echo "$ img";

Вельмі часта праграмісты дублююць ўчасткі кода або каманды выклікаюць дзесяць разоў

echo "<div class = 'main'> ......"; echo "<span class = 'adress'> ......."; echo "<button id = 'send' type = 'button'> ....."; echo "</ button> </ span> </ div>";

калі можна і трэба адзін:

$ Result = "<div class = 'main'> ......"; $ Result. = "<Span class = 'adress'> ......."; $ Result. = "<Button id = 'send' type = 'button'> ....."; $ Result. = "</ Button> </ span> </ div>"; echo $ result;

Прыклад прымітыўны, напісаны для нагляднасці, каб не ўскладняць. Паколькі артыкул хутчэй аб html-вёрстцы і афармленні CSS, чым пра PHP, паколькі серверныя аперацыі з php-файламі для выніковай старонкі не так важныя. А вось дрэнна напісаны HTML і CSS - вельмі!

Стылі, часта выкарыстоўваюцца ў кодзе (ды і наогул усё) трэба выносіць у табліцу стыляў. Можна частка стыляў для адной нейкай старонкі вынесці ў шапку (секцыя <head>). Але наогул вельмі пажадана выкарыстоўваць менавіта табліцы стыляў і ня пладзіць іх без патрэбы (выкарыстаць адну-дзве). Таксама код css-файла можна мінімізаваць з дапамогай онлайн-сэрвісу або плагіна для аглядальніка ( Phoneix для Firefox ) Каб ён хутчэй загружаўся.

Ёсць яшчэ адзін від памылак, якія не адносяцца да кода, але ставяцца да сайта - арфаграфічныя. Да іх ставяцца уласна памылкі, а таксама памылкі друку, якія робяцца па няўважлівасці або пры наборы тэксту артыкула з прыплюшчанымі вачыма ў тры гадзіны ночы. Так што правярайце набраны тэкст на сэрвісе арфаграфіі .

Калі матэрыялы сайта апынуліся для вас карыснымі, можаце падтрымаць далейшае развіццё рэсурсу, аказаўшы яму (і мне) маральную і матэрыяльную падтрымку .