Водич за почетнике за израду ХТМЛ5 / ЦСС3 веб страница

Овај чланак је део нашег "ХТМЛ5 / ЦСС3 Туториалс сериес" - посвећена да вам помогне да будете бољи дизајнер и / или програмер. Кликните овде да бисте видели више чланака из исте серије.

ХТМЛ5 и ЦСС3 су олујни интернет оборили у само 2 године. Пре њих је било много измењене семантике у начину на који се од веб дизајнера очекује да креирају веб странице, а њиховим доласком долази мноштво сјајних подршке као што су алтернативни медији, ознаке у стилу КСМЛ-а и прогресивни атрибути уноса за веб дизајнере како би постигли сањиве карактеристике као што су анимација.

Иако се чини да већина програмера приказује потенцијалне, али компликоване демо верзије, ХТМЛ5 / ЦСС3 нису стварно ракетна знаност, а ја ћу вас провести кроз опуштајући процес како бисте изградили стандардну ХТМЛ5 / ЦСС3 веб страницу са свеобухватним, али детаљним објашњењем и тада! Бонуси као што су ресурси за учење и бесплатни ХТМЛ5 предлошци су доступни за вас, па искористите ову прилику да покренете своје ХТМЛ5 путовање!

Промене између ХТМЛ4 и ХТМЛ5

Можда се питате зашто је чак и важно да се пребаците у ХТМЛ5. Постоји безброј разлога, али углавном зато што ћете бити рад са глобалним Интернет стандардима као и сваки други дизајнер. На тај начин ћете пронаћи више подршке на мрежи и вашу Веб сајтови ће се исправно приказивати у модерним претраживачима које се стално побољшавају.

(Извор слике: В3Ц)

Поређење између ХТМЛ4 и ХТМЛ5 тешко је уочити на површинском нивоу. Када погледате нови нацрт ХТМЛ5 можете видети елементе и кориговане процедуре за руковање грешкама. Програмери претраживача су посебно уживали у новим спецификацијама за приказивање стандардних веб страница.

Шта је више од ХТМЛ5 је конверзија нашег модерног веб прегледача. Са овим новим спецификацијама веб као целина се сада посматра као апплицатион платформ за ХТМЛ (посебно ХТМЛ5), ЦСС и ЈаваСцрипт који ће се градити. Такође, овај систем елегантно ствара хармонију између веб дизајнера и програмера постављањем заједничких стандарда које би требало да прате сви претраживачи.

Поред тога, створени су многи елементи представљају дигиталне медије новог доба. Ови укључују и који су огромни за мултимедијалну подршку. У неким прегледачима можете извршити валидацију формулара директно у ХТМЛ-у. Додуше, још увек постоји велика потреба за јКуери, пошто постоје многи програмери који тек треба да препознају функције. Ако желите листу ознака, провјерите ову таблицу В3Сцхоолс да бисте сазнали више о њима.

Баре ХТМЛ5 скелет

Сматрам да је најлакши начин да се схвати било која тема уроните право у њу. Зато ћу конструирати основни ХТМЛ5 скелетни предложак за веб страницу. Укључио сам неколико нових елемената, за које се надам да ћу их мало касније категоризирати.

        
 
 
Добро дошли, сви!
  
 
 
 
неки садржај овде.
 
 
 
али и неке овде!
 
 
  
   

Одмах се ово не разликује много од стандардне ХТМЛ4 веб странице. Оно што можете приметити је да смо ми не морате да укључите више самозатварајућих ознака. Ово је заиста дивна вест јер ће вам уштедети много времена ван ваших развојних пројеката.

За оне који не знају, у КСХТМЛ нацртима је означено много елемената само-затварање. Ово би се завршило са косом цртом испред оператера 'већи од' да би се означило да не би требало да укључите још једну завршну ознаку негде другде. На пример, да бисте креирали ознаку мета кључних речи коју бисте користили без потребе за затварањем другде.

Ово правило се и даље примењује у ХТМЛ5. Али сада ти не треба чак ни додатна коса црта! је потпуно валид, иако вам је дозвољено да наставите да користите КСХТМЛ / КСМЛ стандард. За све прегледнике који задовољавају стандарде оба елемента ће се приказати на исти начин.

Дефинисање области странице

Већина нашег новог кода не би требало да буде превише шокантна. Наше Доцтипе је урнебесно једноставнији него икад, нема потребе за претераним атрибутима тијела, и информације у нашем наслову су јасно означене. Кренуо бих да вам скренем пажњу на садржај унутар нашег таг. Ово укључује сву структуру главне странице. Намјерно сам користио неколико лијепих ХТМЛ5 ознака како бих означио како их можете укључити у свој рад.

Прво ћете видети целу страницу енкапсулирани унутар а див таг. Означио сам ово са идентификацијом враппер, што значи да се облаже око целог садржаја нашег сајта. Ово је Корисно је поставити максималну ширину или садржај позиције на екрану. Затим сам преломио страницу у 3 основна елемента - један

, језгро

, и кратко

Водич за почетнике за Флоцк, Социал Медиа Бровсер

Водич за почетнике за иОС развој Интерфаце - Парт И

Водич за почетнике за подешавање система Виндовс 7 Медиа Центер