novikovadaria / intro_to_web_technologies

Знакомство с веб технологиями. GeekBrains University | Introduction to web technologies. GeekBrains University

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Урок 1. Веб-технологии: вчера, сегодня, завтра

Задание:

  1. Определите, на каком протоколе работает сайт youtube.com.Сделайте скриншот с названием 1_protocol.jpg, по которому станет понятно, как вы определили протокол сайта.

  2. Создайте файл 2_analyze.txt, в котором проанализируйте структуру страницы сайта https://ru.wikipedia.org/, а именно нужно описать (коротко, своими словами), какие блоки есть на сайте, что в этих блоках находится. Есть ли на сайте шапка, подвал, что в них содержится? Как и где расположен контент? Есть ли дополнительные элементы на странице? Представьте, что вы описываете сайт дизайнеру или разработчику и пытаетесь объяснить на словах, из чего будет состоять сайт, какие в нем будут основные блоки. Нас не должны интересовать теги или классы в html, какие-либо мелкие детали сайта, все это детали реализации, которые будут приниматься программистом и дизайнером. Интересует то, как вы опишите словами сайт, чтобы разработчик и дизайнер поняли, с чем им предстоит работать.

  3. Внесите не менее 10 изменений на страницу любой статьи сайта https://ru.wikipedia.org/, с помощью инструмента разработчика и представьте два скриншота было/стало (скриншоты должны иметь названия 3_before.jpg, 3_after.jpg соответственно). Желательно поработать с изменением текста на странице, заменой картинки, изменением стилей.

  4. Создайте прототип низкой детализации сайта https://dzen.ru/ с помощью сайта https://wireframe.cc/. Предоставьте скриншот того, что получилось (скриншот должен быть назван 4_proto.jpg).


Lesson 1. Web technologies: Yesterday, today, tomorrow

Task:

  1. Determine which protocol the site is running on youtube.com .Take a screenshot with the title 1_protocol.jpg , which will make it clear how you defined the site protocol.

  2. Create a file 2_analyze.txt , in which analyze the structure of the site page https://ru.wikipedia.org /, namely, you need to describe (briefly, in your own words) which blocks are on the site, what is in these blocks. Is there a header on the site, a basement, what they contain? How and where is the content located? Are there any additional elements on the page? Imagine that you are describing a website to a designer or developer and trying to explain in words what the website will consist of, what the main blocks will be in it. We should not be interested in tags or classes in html, any small details of the site, all these are implementation details that will be accepted by the programmer and designer. I am interested in how you describe the site in words so that the developer and designer understand what they have to work with.

  3. Make at least 10 changes to the page of any article on the site https://ru.wikipedia.org /, using the developer's tool and submit two screenshots of what was/became (screenshots should have the names 3_before.jpg, 3_after.jpg respectively). It is advisable to work with changing the text on the page, replacing the image, changing styles.

  4. Create a prototype of a low-detail site https://dzen.ru / using the site https://wireframe.cc /. Provide a screenshot of what happened (the screenshot should be named 4_proto.jpg ).

About

Знакомство с веб технологиями. GeekBrains University | Introduction to web technologies. GeekBrains University