Skip to content

hristy93/Chrome-DevTools-Info

Repository files navigation

Chrome DevTools Info

Цел

С този се цели да се предостави информация за функционалностите на Google Chrome DevTools на достъпен език. Описано е накратко какво може да постигне един web програмист (или просто ентусиаст) с всеки един от разделите, с които разполага браузъра Google Chrome. Включени са и снимки за илюстриране на самите панели (раздели), чрез които може се добие представа за облика им.

Предназначение

Целта на този сайт е да се реализира така че информацията в него да изглежда достатъчно добре на голям брой от мобилни устройства. Той е създаден с учебна цел, като курсов проект по дисциплината “Мобилно интернет съдържание” водена във Факултета по математика и информатика на Софийски университет “Св. Климент Охридски” през втория семестър на учебната 2015/2016 година.

Езици - HTML5, CSS3 и JavaScript

Библиотеки и външни файлове

  • modernizr.js - JavaScript документ, който служи за проверка на възможностите на използвания браузър да визуализира и борави с различни уеб технологии. Позволява на потребителите да се възползват от тях, ако браузъра ги поддържа.

Функционални и нефункционални характеристики

Функционални характеристики

  • Media queries - Медийните заявки (Media queries) позволяват на уебсайта да използва различни стилове (CSS) според характеристиките и типа на устройството, на което се визуализира, като ширината на браузъра (устройството) е най-често използваната характеристика.
  • Semantic HTML - Семантичния HTML (Semantic HTML) не е нова версия или различна версия, а е най-обикновен HTML. Семантичен го прави начина, по който той бива използван. Семантичен буквално означава „значещ“. Като цяло HTML не е нещо предназначено за крайния потребител пред екрана, а за разработчиците и машините. За да бъде „значещ“ за тях, той трябва да е максимално добре структуриран и да описва максимално точно съдържанието което представя. Той конкретизира вида на съдържанието и указва неговата йерархия.
  • Fluid grid - Концепцията за „гъвкава“ или „течна“ решетка (fluid grid) изисква оразмеряването на елементите на страницата да бъде в относителни единици (проценти), а не в абсолютни като пиксели (*pixels) или точки (points).
  • Flexible images - “Гъвкавите” изображения (flexible images) също се оразмеряват в относителни единици за да се предотврати показването им извън елемента, в който се съдържат.

Нефункционални характеристики

  • Responsive Web Design - Responsive Web Design (RWD), представлява вид стилизиране на уеб страници, целящо да осигури оптималната ѝ визуализация и улеснено взаимодействие с нея, което да е подходящо за различни устройства (мобилни телефони, таблети, настолни компютри и др.) и техните различни резолюции и размери на екрана. Целта на това адаптиране е да се минимизира нуждата от преоразмеряване и превъртане (scrolling).

About

A website with information about Chrome DevTools

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published