Web-сайт "Процессоры Intel и их характеристики.
История развития.
Выбор логической структуры процессора"

Тип работы:
Курсовая
Предмет:
Программирование


Узнать стоимость

Детальная информация о работе

Выдержка из работы

ОГЛАВЛЕНИЕ

ВВЕДЕНИЕ

1. Логическая структура сайта

2. Физическая структура сайта

3. Шаблон оформления страницы

4. Листинг исходного кода страниц

4. 1Исходный текст шаблона главной HTML-страницы (верстка с использованием фреймов)

4.1. 1Код страницы, загружаемой во фрейм «head»

4.1. 2Код страницы, загружаемой во фрейм «menu»

4.1. 3Код страницы, загружаемой во фрейм «content»

4.1. 4Код страницы, загружаемой во фрейм «podval»

4. 2Код страницы, сверстанной с использованием таблицы

4. 3Код страницы, сверстанной с использованием блоков

4. 4Фрагмент кода, содержащий карту сайта

4. 5Скрипты, использованные на сайте

4. 6Каскадные таблицы стилей (CSS)

5. Порядок разработки сайта

6. Программное обеспечение, использованное при работе над сайтом

7. Тестирование сайта

ЗАКЛЮЧЕНИЕ

СПИСОК ЛИТЕРАТУРЫ

Приложение А

сайт страница шаблон код

ВВЕДЕНИЕ

Интернет-технологии в настоящее время являются самой быстро развивающейся областью информатики. Большинство людей в цивилизованном мире имеют доступ к ресурсам сети Интернет. В начале 90-х годов Интернет задумывался как средство общения и передачи информации. Сейчас Интернет представляет собой хранилище огромного объема информации по любой тематике. Большая часть этой информации находится в свободном доступе и хранится в виде web-страниц, которые и образуют web-сайты, следовательно, чтобы добавить свои данные в Сеть, необходимо иметь представление о способах создания и обслуживания HTML-документов.

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

Если вы задерживаетесь на каком-либо сайте на длительное время и даже не осознаете этого, то, по всей видимости, такой сайт очень хорошо продуман. Вернитесь обратно и попробуйте осмыслить полную картину. Можете ли вы увидеть структуру, организацию? Легко ли воспринимается информация? Понимание движения информационных потоков -- это первый шаг в создании функционального, удобного в работе сайта. Если вы поймете, как работает эта концепция, и примените ее при создании собственного сайта, то вы уже тем самым опередите большинство других разработчиков.

Цель моей работы состоит в том, чтобы самостоятельно спроектировать и реализовать Web-сайт на тему «Процессоры Intel и их характеристики. История развития. Выбор логической структуры процессора».

Задачи:

ознакомиться с современными Интернет-технологиями и, по возможности, использовать их в своей разработке;

изучить основные понятия и программный инструментарий, применяемый для разработки и создания Web-сайтов;

выявить и учесть методы и способы представления на Web-страницах различных видов информации (текстов и изображений);

ознакомиться с основными правилами и рекомендациями по разработке и созданию Web-сайтов и неукоснительно следовать им в своей практике;

определиться со структурой Web-страниц;

представить пошаговую стратегию разработки web-сайта.

1. Логическая структура сайта

Логическая структура сайта представлена таким образом, что с любой страницы сайта можно попасть на любую другую страницу сайта «в 2 клика». Навигация осуществляется при помощи верхнего и бокового меню. В верхнем меню располагаются ссылки на главную страницу сайта, на карту сайта, на глоссарий, а также на страницу со сведениями об авторе; содержание этого меню одинаково для всех страниц сайта. В боковом меню расположены ссылки на информативные разделы сайта; содержание этого меню изменяется в зависимости от того, в каком разделе находится посетитель. Для быстрой навигации можно воспользоваться картой сайта. С каждой страницы сайта есть возможность связаться с автором сайта, написав письмо. Для этого пользователю достаточно иметь подключение к сети Интернет и щелкнуть по ссылке с электронным адресом автора сайта, расположенной внизу каждой страницы. Данная ссылка является ссылкой для автоматического открытия почтовой службы пользователя.

Наглядное представление логической структуры сайта представлено на рисунке 1.

Рисунок 1 — Логическая структура сайта

2. Физическая структура сайта

Сайт представляет собой папку «Курсовая», в которой находится 5 папок и 1 html-документ, ведущий на главную страницу. В первой папке хранятся html-документы, сделанные с использованием фреймов, а также страницы, которые и представляют собой фреймы. Во второй папке находятся html-документы, посвященные истории микропроцессоров. В третьей папке находятся страницы на тему «Выбор логической структуры». В четвертой папке хранятся картинки. В пятой папке располагается каскадная таблица стилей (CSS).

Таблица 1 — Физическая структура сайта

Директория

Имя файла

Описание

Раз-р ф-ла, КБ

/Курсовая

index. html

Главная страница сайта (страница сделана с использованием фреймов)

1

/Курсовая/ frames

karta-frames. html

Карта сайта (страница сделана с использованием фреймов)

1

/Курсовая/ frames

glossariy-frames. html

Глоссарий (страница сделана с использованием фреймов)

1

/Курсовая/ frames

resume-frames. html

Сведения об авторе (страница сделана с использованием фреймов)

1

/Курсовая/ frames

head. html

Шапка сайта для страниц, сделанных с использованием фреймов

2

/Курсовая/ frames

menu. html

Боковое меню для страниц, сделанных с использованием фреймов

2

/Курсовая/ frames

podval. html

Подвал для страниц, сделанных с использованием фреймов

1

/Курсовая/ frames

content. html

Контент главной страницы.

4

/Курсовая/ frames

karta. html

Контент страницы с картой сайта

5

/Курсовая/ frames

glossariy. html

Контент глоссария

44

/Курсовая/ frames

resume. html

Контент страницы со сведениями об авторе

3

/Курсовая/ history

CompanyHist. html

История компании Intel

19

/Курсовая/ history

ProcHist. html

История развития микропроцессоров

8

/Курсовая/ history

Page1. html

Микропроцессоры, выпущенные в период с 1971 г по 1979г

24

/Курсовая/ history

Page2. html

Микропроцессоры, выпущенные в период с 1980 г по 1989г

33

Директория

Имя файла

Описание

Раз-р ф-ла, КБ

/Курсовая/ history

Page3. html

Микропроцессоры, выпущенные в период с 1990 г по 1995г

39

/Курсовая/ history

Page4. html

Микропроцессоры, выпущенные в период с 1995 г по 1998г

27

/Курсовая/ history

Page5. html

Микропроцессоры, выпущенные в 1999г

24

/Курсовая/ history

Page6. html

Микропроцессоры, выпущенные в 2000г

14

/Курсовая/ history

Page7. html

Микропроцессоры, выпущенные в 2001г

18

/Курсовая/ history

Page8. html

Микропроцессоры, выпущенные в 2002г

31

/Курсовая/ history

Page9. html

Микропроцессоры, выпущенные в 2003г

25

/Курсовая/ history

Page10. html

Микропроцессоры, выпущенные в 2004г

35

/Курсовая/ history

Page11. html

Микропроцессоры, выпущенные в 2005г

22

/Курсовая/ history

Page12. html

Микропроцессоры, выпущенные в 2006 г (часть 1)

30

/Курсовая/ history

Page13. html

Микропроцессоры, выпущенные в 2006 г (часть 2)

30

/Курсовая/ history

Page14. html

Микропроцессоры, выпущенные в 2007 г (часть 1)

23

/Курсовая/ history

Page15. html

Микропроцессоры, выпущенные в 2007 г (часть 2)

23

/Курсовая/ history

Page16. html

Микропроцессоры, выпущенные в 2008 г (часть 1)

30

/Курсовая/ history

Page17. html

Микропроцессоры, выпущенные в 2008 г (часть 2)

37

/Курсовая/ history

Page18. html

Микропроцессоры, выпущенные в 2009г

38

/Курсовая/ history

Page19. html

Микропроцессоры, выпущенные в 2010 г (часть 1)

34

/Курсовая/ history

Page20. html

Микропроцессоры, выпущенные в 2010 г (часть 2)

32

/Курсовая/ history

Page21. html

Микропроцессоры, выпущенные в 2011г

46

/Курсовая/ logika

Vvedenie. html

Выбор логической структуры процессора / введение

8

Директория

Имя файла

Описание

Раз-р ф-ла, КБ

/Курсовая/ logika

LogStr. html

Логическая структура

18

/Курсовая/ logika

Vybor. html

Выбор структуры

21

/Курсовая/ styles

main. css

Таблица стилей

9

/Курсовая/ Images

fon. jpg

Фоновая картинка

20

/Курсовая/ Images

fon3. jpg

fon4. jpg

Фоновые картинки для фреймов

10

20

/Курсовая/ Images

favicon. ico

Иконка сайта

2

/Курсовая/ Images

karta. png

Карта сайта

36

/Курсовая/ Images

Me. jpg

Фото со страницы об авторе

23

/Курсовая/ Images

logo. gif

Анимированный логотип сайта

139

/Курсовая/ Images

Boss. jpg

Imidj. jpg

Картинки со страницы «История компании»

19

17

/Курсовая/ Images

2up. png

Картинка стрелки для кнопки «Вверх страницы»

3

/Курсовая/ Photo_proc

*. jpg

В этой папке находятся фотографии процессоров (168 штук), поименованные в соответствие с названием процессора и ядром. Размер каждой картинки не превышает 20 килобайт.

3. Шаблон оформления страницы

Все страницы условно делятся на 4 блока (рис 2). Верхний блок, «шапка», содержит логотип сайта и верхнее меню. Левый — панель навигации по сайту; также левый блок, при прокрутке страницы, становится кнопкой «Наверх». В правом блоке находится информационное наполнение страницы. В нижнем блоке располагается ссылка на электронную почту для связи с автором.

При создании сайта была использована динамическая («резиновая») верстка, т. е. при изменении масштаба меняется только размер шрифта.

Сайт выполнен в едином цветовом стиле. Основными цветами при создании сайта являлись оттенки синего, белый и черный. Для создания эффекта мутно-белого стекла в верхнем меню, боковом меню и подвале использовался белый цвет разного уровня прозрачности. Для создания бликов использовались линейные и радиальные градиенты.

Рисунок 2 — Шаблон страницы

Параметры всей страницы:

Фоновая картинка:. /images/fon. jpg;

Цвет фона: #0071С5;

Шрифт: Verdana;

Размер шрифта: 12pt;

Цвет текста: # 0;

Параметры верхнего блока:

Фоновая картинка:. /images/fon. jpg;(для фреймов)

Ширина: 100%;

Высота: 20%;

Параметры левого блока:

Фоновая картинка:. /images/fon3. jpg;(для фреймов)

Цвет текста: #FFFFFF;

Ширина: 23%;

Стиль шрифта: жирный;

Параметры правого блока:

Фоновая картинка:. /images/fon3. jpg;(для фреймов)

Ширина: 77%;

Параметры нижнего блока:

Ширина: 100%;

Высота: 50px;

4. Листинг исходного кода страниц

4.1 Исходный текст шаблона главной HTML-страницы (верстка с использованием фреймов)

< !DOCTYPE HTML PUBLIC «-//W3C//DTD HTML 4. 01 Frameset//EN» «http: //www. w3. org/TR/html4/frameset. dtd">

< HTML>

< HEAD>

< TITLE>Intel Corporation< /TITLE>

< meta charset="utf-8">

< link rel="shortcut icon" href="images/favicon. ico" >

< /HEAD>

< frameset rows="20%,*" frameborder="0″ framespacing="0">

< frame src="frames/head. html" name="head" scrolling="no" noresize >

< frameset rows="*, 50px" >

< frameset cols="23%,*">

< frame name="menu" src="frames/menu. html" scrolling="no" noresize>

< frame name="content" src="frames/content. html" noresize>

< /frameset>

< frameset >

< frame name="podval" src="frames/podval. html" scrolling="no" noresize>

< /frameset>

< /frameset>

< /frameset>

< /html>

4.1.1 Код страницы, загружаемой во фрейм «head»

< !DOCTYPE html>

< HTML>

< HEAD>

< TITLE>Шапка сайта< /TITLE>

< meta charset="utf-8">

< link href=". /styles/main. css" rel="stylesheet">

< link rel="shortcut icon" href=". /images/favicon. ico" >

< /HEAD>

< BODY id="golova">

< div class="page">

< div class="main">

<a href="content. html" title="На главную" target="content"> <img src=". /images/logo. gif" class="logo" alt="Логотип"> </a>

< /div>

< div class="topmenu">

< p><a href="content. html" tabindex="0″ target="content"> Главная</a><a href="karta. html" tabindex="0″ target="content"> Карта сайта< /a><a href="glossariy. html" tabindex="0″ target="content"> Глоссарий</a><a href="resume. html" tabindex="0″ target="content"> Об авторе< /a></p>

< /div>

< /div>

< /body>

< /html>

4.1.2 Код страницы, загружаемой во фрейм «menu»

< HTML>

< HEAD>

< TITLE>Меню навигации< /TITLE>

< meta charset="utf-8">

< link href=". /styles/main. css" rel="stylesheet">

< link rel="shortcut icon" href=". /images/favicon. ico" >

< /HEAD>

< BODY id="menu">

< aside id="frame-menu">

< div class="leftmenu">

< div class="Lcaption"> <p>Содержание:</p></div>

< p>

<a href=". /history/CompanyHist. html" class="first" target="_top"> • История компании< /a>

<a href=". /history/ProcHist. html" class="first" target="_top"> ‣ История развития микропроцессоров< /a>

<a href=". /logika/vvedenie. html" class="first" target="_top"> ‣ Выбор логической структуры процессора< /a>

< /p>

< /div>

< /aside>

< /BODY>

4.1.3 Код страницы, загружаемой во фрейм «content»

< !DOCTYPE html>

< HTML>

< HEAD>

< TITLE>О компании< /TITLE>

< meta charset="utf-8">

< link href=". /styles/main. css" rel="stylesheet">

< link rel="shortcut icon" href=". /images/favicon. ico" >

< /HEAD>

< BODY id="content">

< div class="inf" id="frame-inf">

/ Информационное наполнение /

< /div>

< /body>

< /html>

4.1.4 Код страницы, загружаемой во фрейм «podval»

< !DOCTYPE html>

< HTML>

< HEAD>

< TITLE>Подвал</TITLE>

< meta charset="utf-8">

< link href=". /styles/main. css" rel="stylesheet">

< link rel="shortcut icon" href=". /images/favicon. ico" >

< /HEAD>

< BODY id="podv">

< footer id="frame-foot">

<p Class="footer"> <b>© 2014 Алексей Илатовский< /b>      По всем вопросам пишите по адресу <a href="mailto: lexaxa251195@mail. ru" title="Отправить письмо"> lexaxa251195@mail. ru</a>

< /p>

< /footer>

< /body>

< /html>

4.2 Код страницы, сверстанной с использованием таблицы

< !DOCTYPE html>

< HTML>

< HEAD>

< TITLE>Процессоры Intel< /TITLE>

< meta charset="utf-8">

< link href=". /styles/main. css" rel="stylesheet">

< link rel="shortcut icon" href=". /images/favicon. ico" >

< /HEAD>

< BODY>

< table id="tab">

< tr>

< td height="20%" width="23%" id="log"> <a href=". /index. html" title="На главную"> <img src=". /images/logo. gif" class="logo" id="tab-log" alt="Логотип"> </a>

< /td>

< td height="20%" id="men">

< div class="topmenu" id="tab-top">

< p><a href=". /index. html">Главная</a>

<a href=". /frames/karta-frames. html">Карта сайта< /a>

<a href=". /frames/glossariy-frames. html">Глоссарий</a>

<a href=". /frames/resume-frames. html">Об авторе< /a></p>

< /div>

< /td>

< /tr>

< tr>

< td>

< aside id="frame-menu">

< div class="leftmenu">

< div class="Lcaption"> <p>Содержание:</p></div>

< p><a href="CompanyHist. html" class="first"> • История компании< /a>

<a href="ProcHist. html" class="first" id="check"> ▾ История развития микропроцессоров< /a>

<a href=". /logika/vvedenie. html" class="first"> ‣ Выбор логической структуры процессора< /a></p>

< /div>

< /aside>

< /td>

< td>

< div class="inf" id="frame-inf">

/ Информационное наполнение /

< /div>

< /td>

< /tr>

< tr>

< td colspan="2″ height="50px">

< footer id="frame-foot">

<p Class="footer"> <b>© 2014 Алексей Илатовский< /b>      По всем вопросам пишите по адресу <a href="mailto: lexaxa251195@mail. ru" title="Отправить письмо"> lexaxa251195@mail. ru</a></p>

< /footer>

< /td>

< /tr>

< /table>

<a href="#" class="up" onclick="return up()">

< div id="vverh"> </div>

< /a>

< BODY>

< /HTML>

4.3 Код страницы, сверстанной с использованием блоков

< !DOCTYPE html>

< HTML>

< HEAD>

< TITLE>История компании< /TITLE>

< meta charset="utf-8">

< link href=". /styles/main. css" rel="stylesheet">

< link rel="shortcut icon" href=". /images/favicon. ico" >

< /HEAD>

< BODY>

< div class="page">

< header>

< div class="main">

<a href=". /index. html" title="На главную"> <img src=". /images/logo. gif" class="logo" alt="Логотип"> </a>

< /div>

< div class="topmenu">

< p><a href=". /index. html">Главная</a>

<a href=". /frames/karta-frames. html">Карта сайта< /a>

<a href=". /frames/glossariy-frames. html">Глоссарий</a>

<a href=". /frames/resume-frames. html">Об авторе< /a></p>

< /div>

< /header>

< aside>

< div class="leftmenu">

< div class="Lcaption"> <p>Содержание:</p></div>

< p><a href="CompanyHist. html" class="first" id="check"> • История компании< /a>

<a href="ProcHist. html" class="first"> ‣ История развития микропроцессоров< /a>

<a href=". /logika/vvedenie. html" class="first"> ‣ Выбор логической структуры процессора< /a></p>

< /div>

< /aside>

< div class="inf">

/ Информационное наполнение /

< /div>

< /div>

<a href="#" class="up" onclick="return up()">

< div id="vverh"> </div>

< /a>

< footer>

<p Class="footer"> <b>© 2014 Алексей Илатовский< /b>      По всем вопросам пишите по адресу <a href="mailto: lexaxa251195@mail. ru" title="Отправить письмо"> lexaxa251195@mail. ru</a></p>

< /footer>

< BODY>

< /HTML>

4.4 Фрагмент кода, содержащий карту сайта

< img id="kart" src=". /images/Karta. png" usemap="imgmap2">

< map id="imgmap2″ name="imgmap2">

< area shape="circle" title="История компании" coords="104,205,63″ href=". /history/CompanyHist. html" target="_top" />

< area shape="rect" title="На главную" coords="220,38,394,76″ href=". /index. html" target="_top" />

< area shape="rect" title="Карта сайта" coords="141,7,252,34″ href="karta. html"/>

< area shape="rect" title="Глоссарий" coords="256,7,364,34″ href="glossariy. html"/>

< area shape="rect" title="Резюме автора" coords="369,7,466,34″ href="resume. html" />

< area shape="rect" title="История микропроцессоров" coords="191,89,421,125″ href=". /history/ProcHist. html" target="_top" />

< area shape="rect" title="1971 — 1979 годы" coords="204,130,410,152″ href=". /history/page1. html" target="_top" />

< area shape="rect" title="1981 — 1989 годы" coords="204,156,410,175″ href=". /history/page2. html" target="_top" />

< area shape="rect" title="1990 — 1995 годы" coords="204,179,410,198″ href=". /history/page3. html" target="_top" />

< area shape="rect" title="1995 — 1998 годы" coords="204,202,410,221″ href=". /history/page4. html" target="_top" />

< area shape="rect" title="1999 год" coords="204,225,410,242″ href=". /history/page5. html" target="_top" />

< area shape="rect" title="2000 год" coords="204,246,410,265″ href=". /history/page6. html" target="_top" />

< area shape="rect" title="2001 год" coords="204,269,410,288″ href=". /history/page7. html" target="_top" />

< area shape="rect" title="2002 год" coords="204,292,410,311″ href=". /history/page8. html" target="_top" />

< area shape="rect" title="2003 год" coords="204,315,410,334″ href=". /history/page9. html" target="_top" />

< area shape="rect" title="2004 год" coords="204,338,410,357″ href=". /history/page10. html" target="_top" />

< area shape="rect" title="2005 год" coords="204,361,410,380″ href=". /history/page11. html" target="_top" />

< area shape="rect" title="2006 год (часть 1)" coords="204,385,305,421″ href=". /history/page12. html" target="_top" />

< area shape="rect" title="2006 год (часть 2)" coords="307,385,410,421″ href=". /history/page13. html" target="_top" />

< area shape="rect" title="2007 год (часть 1)" coords="204,426,305,461″ href=". /history/page14. html" target="_top" />

< area shape="rect" title="2007 год (часть 2)" coords="307,426,410,461″ href=". /history/page15. html" target="_top" />

< area shape="rect" title="2008 год (часть 1)" coords="204,466,305,501″ href=". /history/page16. html" target="_top" />

< area shape="rect" title="2008 год (часть 2)" coords="307,466,410,501″ href=". /history/page17. html" target="_top" />

< area shape="rect" title="2009 год" coords="204,505,410,524″ href=". /history/page18. html" target="_top" />

< area shape="rect" title="2010 год (часть 1)" coords="204,530,306,564″ href=". /history/page19. html" target="_top" />

< area shape="rect" title="2010 год (часть 2)" coords="308,530,410,564″ href=". /history/page20. html" target="_top" />

< area shape="rect" title="2011 год" coords="204,568,410,591″ href=". /history/page21. html" target="_top" />

< area shape="rect" title="Выбор логической структуры процессора / Введение" coords="434,159,585,222″ href=". /logika/vvedenie. html" target="_top" />

< area shape="rect" title="Логическая структура" coords="434,226,585,256″ href=". /logika/LogStr. html" target="_top" />

< area shape="rect" title="Выбор структуры процессора" coords="434,260,585,297″ href=". /logika/vybor. html" target="_top" /> </map>

4.5 Скрипты, использованные на сайте

Скрипт, обеспечивающий корректное отображение тегов языка HTML5 в браузерах Internet Explorer старых версий (ниже 9):

< !--[if lt IE 9]>

< script>var e = («article, aside, figcaption, figure, footer, header, hgroup, nav, section, time»). split (',');

for (var i = 0; i < e. length; i++) {

document. createElement (e[i]);

}

< /script>

< ![endif]-->

Скрипт, делающий видимой кнопку «Вверх страницы», при прокрутке страницы на 900 пикселей:

< script>

window. onscroll = function vverh () {

document. getElementById ('vverh'). style. display = (window. pageYOffset > '900'? 'block': 'none'); }

< /script>

Скрипт, задающий функцию плавной прокрутки страницы вверх:

< script>

var t; function up () { var top = Math. max (document. body. scrollTop, document. documentElement. scrollTop);

if (top > 0) {window. scrollBy (0,((top+100)/-10));

t = setTimeout ('up ()', 20);

} else clearTimeout (t); return false;} < /script>

4.6 Каскадные таблицы стилей (CSS)

html{

height: 100%;

width: 100%;

margin: 0px;

padding: 0px;

}

body{

font-family: Verdana;

font-size: 12pt;

background: #0071c5 url (. /images/fon. jpg) no-repeat;

background-size: 100%;

height: 100%;

width: 100%;

margin: 0px;

padding: 0px;

}

div. page{

height: 100%;

font-size: 0;

line-height: 0;

letter-spacing: -1px;

display: block;

}

div{

line-height: normal;

letter-spacing: normal;

display: inline-block;

}

header{

width: 100%;

height: 20%;

}

. logo{/* Стили логотипа */

display: block;

border-radius: 50%;

border-left: 7px groove #cccccc;

border-right: 7px ridge #cccccc;

border-top: 2px groove #cccccc;

border-bottom: 2px ridge #cccccc;

box-sizing: border-box;

height: 90%;

margin: auto;

margin-top: 2%;

box-shadow: 2px 2px 10px rgba (0,0,0,. 5);

}

div. main{/* Стили блока с логотипом */

margin-left: 2%;

width: 21%;

height: 100%;

}

div. topmenu{/*Стили верхнего меню*/

border-left: 5px groove rgb (200,200,200);

border-right: 5px ridge rgb (200,200,200);

vertical-align: bottom;

height: 50px;

width: 77%;

box-sizing: border-box;

border-radius: 25px 25px;

background-image: linear-gradient (rgba (255,255,255,. 7), rgba (255,255,255,. 9), rgba (150,150,150,. 5));

}

div. topmenu p{margin-top: 15px;}

div. topmenu a{/* Стили кнопок верхнего меню */

font-size: 14pt;

text-decoration: none;

color: #487;

margin-left: 5px;

padding: 15px;

background-image:

linear-gradient (45deg, rgba (255,255,255,. 0) 30%, rgba (255,255,255,. 8), rgba (255,255,255,. 0) 70%),

radial-gradient (100% 80% at 50% 50%, rgba (255,255,255,. 9) 0%, rgba (255,255,255,. 1) 50%, rgba (0,0,0,0) 50%);

background-position: 200% 0, 0 0, 0 0, 0 0;

background-size: 200% 100%, auto, auto, auto;

background-repeat: no-repeat; }

div. topmenu a: hover{

transition: background-position. 5s linear;

background-position: -200% 0, 0 0, 0 0, 0 0;

background-image:

linear-gradient (45deg, rgba (255,255,255,. 0) 30%, rgba (255,255,255,. 8), rgba (255,255,255,. 0) 70%),

radial-gradient (3px 45% at 0% 50%, rgba (0,0,0,. 9), transparent),

radial-gradient (3px 45% at 100% 50%, rgba (0,0,0,. 9), transparent);

}

div. topmenu a: active{

color: rgb (0,0,0);

border-color: #2970a9;

background-image:

linear-gradient (45deg, rgba (255,255,255,. 0) 30%, rgba (255,255,255,. 8), rgba (255,255,255,. 0) 70%),

radial-gradient (3px 45% at 0% 50%, rgba (0,0,0,. 9), transparent),

radial-gradient (3px 45% at 100% 50%, rgba (0,0,0,. 9), transparent),

linear-gradient (rgba (100,100,100,. 2), rgba (255,255,255,. 8), rgba (255,255,255,. 9));

}

aside{/* Стили бокового меню */

background: rgba (200,200,200,. 35);

float: left;

vertical-align: top;

margin-left: 2%;

width: 21%;

border-radius: 15px;

border: 2px groove #ccc;

box-sizing: border-box;

box-shadow: 2px 2px 10px rgba (0,0,0,. 5);

}

div. leftmenu{

margin-right: 0px;

vertical-align: top;

width: 100%;

}

div. leftmenu p{

text-indent: 0px;

text-align: left;

}

div. Lcaption{

border-radius: 13px 13px 0px 0px;

height: 50px;

width: 100%;

background-image: linear-gradient (rgba (255,255,255,. 7), rgba (255,255,255,. 9), rgba (150,150,150,. 5));

}

div. Lcaption p{

text-indent: 0px;

margin-top: 15px;

text-align: center;

font-size: 14pt;

}

div. leftmenu a{/* Стили ссылок бокового меню*/

text-decoration: none;

color: #FFFFFF;

padding-left: 5px;

padding-right: 5px;

display: block;

}

a. second{margin-left:20px;}

a. first{font-weight:bold;}

div. leftmenu a: hover{

color: #dddddd;

}

#check{

color: #dddddd;

background: rgba (0,0,0,. 1);

border-top: 3px ridge white;

border-bottom: 3px groove white;

border-radius: 10px;

}

div. inf{/* Стили блока с контентом */

background: rgba (255,255,255,. 93);

width: 73%;

display: block;

float: left;

border-radius: 3px 3px 15px 15px;

margin-left: 2%;

margin-bottom: 2%;

margin-right: 2%;

box-shadow: 2px 2px 10px rgba (0,0,0,. 8);}

figure {/* Стили блока с картинкой */

width: 35%;

background: #dddeee;

padding-bottom: 5px;

display: block;

float: right;

margin: 15px;

margin-bottom: 10px;

text-align: center;

border: 3px ridge #fff;

border-radius: 8px;

}

. lol{width:25%;}

. lalka{width:100%;border-radius:5px;}

. lol2{width:25%;float:left;}

. IOI{width:30%;}

. IOI2{float:left;width:30%;}

. figly{float:left}

. fifa{clear:both;}

h1,h2,h3,h4{

text-align: center;

Margin: 15px;}

p{

margin: 15px;

font-size: 12pt;

text-align: justify;

text-indent: 20px;

}

p. ankor{

text-align: center;

text-indent: 0;

margin-top: 0;

margin-bottom: 0;

line-height: 25px;

}

blockquote{

margin-left: 40%;

text-align: right;

}

cite{font-size: 11pt;}

footer{/* Стили подвала */

Display: block;

clear: both;

width: 100%;

height: 50px;

margin-top: -50px;

box-sizing: border-box;

border-radius: 15px 15px 0px 0px;

background-image: linear-gradient (rgba (255,255,255,. 7), rgba (255,255,255,. 9), rgba (150,150,150,. 5));

padding-top: 1px;

}

p. footer{

text-align: center;

text-indent: 0;

}

span{font-family: Verdana; }

#vverh{/* Стили кнопки «Вверх страницы» */

width: 25%;

height: 100%;

font-size: 16pt;

position: fixed;

display: none;

bottom: 0%;

left: 0;

background: url (. /images/2up. png) no-repeat 50% 80%;

background-size: 40% 22%;

transition: 1s;

}

#vverh: hover{

background-position: 50% 70%;

background-color: rgba (0,0,0,. 3);

}

a. button27 {/* Стили кнопок «На след. страницу», «На пред. страницу»

display: inline-block;

padding: 5px;

text-decoration: none;

color: #000;

border-radius: 5px;

background: #dcdcdc linear-gradient (#ffffff, #ccc);

box-shadow: 0 0 0 1px #ddd inset, 0 1px 1px #fff;

}

a. button27: hover {

background: #dcdcdc linear-gradient (#fff, #ccc);

box-shadow: 0 0 0 1px #aaa inset, 0 1px 1px #aaa;

}

a. button27: active {

background: #dcdcdc linear-gradient (#ccc, #ddd);

box-shadow: 0 0 0 1px #bbb inset, 0 1px 3px rgba (0,0,0,. 5) inset, 0 1px 2px #fff;

}

p. list{

text-align: center;

text-indent: 0;

}

#menu{/* Стили для страницы бокового меню во фреймах */

background: #0071c5 url (. /images/fon3. jpg) no-repeat;

background-size: 100%;

}

#content{/* Стили для страницы с контентом во фреймах*/

background: #0071c5 url (. /images/fon4. jpg) no-repeat;

background-size: 100%;

}

#kart{/* Стили для карты сайта*/

display: block;

margin: auto;

margin-top: 10px;

margin-bottom: 10px;

}

#podv{/*Стили для страницы с подвалом во фреймах*/

background: #0071c5;

background-size: 100%;

}

div. topmenu a: focus{/* Стили для кнопок верхнего меню*/

transition: none;

color: rgb (0,0,0);

border-color: #2970a9;

background-image:

linear-gradient (45deg, rgba (255,255,255,. 0) 30%, rgba (255,255,255,. 8), rgba (255,255,255,. 0) 70%),

radial-gradient (3px 45% at 0% 50%, rgba (0,0,0,. 9), transparent),

radial-gradient (3px 45% at 100% 50%, rgba (0,0,0,. 9), transparent),

linear-gradient (rgba (100,100,100,. 2), rgba (255,255,255,. 8), rgba (255,255,255,. 9));

}

#frame-menu{/* Стили для блока бокового меню во фреймах*/

width: 91. 5%;

margin-left:8. 5%;

}

#frame-inf{/* Стили для блока с контентом во фреймах*/

width: 94%;

margin-left: 3%;

margin-bottom: 3%;

margin-right: 3%;

}

#frame-foot{/* Стили для блока-подвала */

height: 100%;

margin-top: 0;

}

dl{/* Стили для списка терминов в глоссарии */

margin: 10px;

}

dt{

font-weight: bold;

text-decoration: underline;

}

dd{margin-bottom: 10px;}

a. button2, a. button2: before {/*Стили для кнопки «Вернуться назад» в глоссарии*/

display: inline-block;

font-size: 20px;

color: #fff;

text-decoration: none;

padding: 8px 15px;

border-radius: 100px;

border: solid rgb (4,88,192);

border-width: 3px 10px;

outline: none;

opacity: 1;

transition:. 6s, opacity 0s 999 9999s, visibility 0s 999 9999s;

}

a. button2 {

position: fixed;

right: 15%;

bottom: 15%;

padding: calc (8px + 3px — 1px) calc (15px + 10px — 1px);

border: 1px solid rgba (62,153,239,. 5);

background: linear-gradient (to left, rgb (62,153,239) 1%, #fff 3%, rgb (44,135,232) 8%, rgba (255,255,255,. 3) 50%, rgb (44,135,232) 92%, #fff 97%, rgb (62,153,239) 99%) no-repeat;

}

a. button2: before {

content: «ВЕРНУТЬСЯ НАЗАД»;

position: absolute;

bottom: -7px;

left: -1px;

width: calc (100% - (15px + 10px — 1px)*2);

background: #fff linear-gradient (rgb (58,160,253), rgb (4,88,192) 60%, rgb (49,112,201));

box-shadow: 0 10px 18px rgba (0,0,0,. 5);

}

a. button2: hover {

-webkit-transform: scale (1. 1, 1. 1);

transform: scale (1. 1, 1. 1);

}

a. button2: hover:before {

border-color: #0766d8;

background: #fff linear-gradient (#3fadff, #0766d8 60%, #3279dd);

}

a. button2: focus,

a. button2: active {

-webkit-transform: scale (2, 2);

transform: scale (2, 2);

opacity: 0;

visibility: hidden;

transition:. 4s;

}

table{/*Стили для таблиц*/

width: 100%;

text-align: left;

}

td, th{

vertical-align: top;

padding: 15px;

}

#me{/*Стили для фотографии в резюме*/

width: 100%;

border-radius: 8px;

border: 3px ridge #fff;

box-sizing: border-box;

}

table#tab td{/*Стили для таблиц, при верстке в таблицах*/

padding: 0;}

table#tab{

width: 100%;

height: 100%;

border-collapse: collapse;

}

#log{padding:0. 5%;}

#tab-log{

height: auto;

max-width: 65%;

width: 65%;

margin-top: 2%;

margin-bottom:2. 7%;

margin-left: 22%;}

#tab-top{width: 100%;}

#men{vertical-align: bottom;}

5. Порядок разработки сайта

Таблица 2 — Порядок разработки сайта

Наименование этапов разработки

Этапы разработки

Результат

1

Задание

Просмотр требований к сайту и оформлению курсовой работы

Согласование выработанной идеи проекта с преподавателем

2

Подбор информации по теме

Обзор Интернет-ресурсов в поиске информации

Информация для заполнения сайта

3

Построение логической структуры

Определение взаимосвязи между страницами сайта

Логическая структура сайта

4

Определение физической структуры сайта

Разработка структуры расположения всех файлов сайта на носителе

Физическая структура сайта

5

Разработка дизайна сайта

Разработка общего дизайна сайта (фон, шрифт, цветовая схема, изображения)

Эскизы дизайна всех страниц. Таблица стилей

6

Информационное заполнение (создание сайта)

Верстка html-страниц

Html-страницы (сайт)

7

Тестирование

Проверка функциональности и наполнения сайта. Тестирование сайта в различных браузерах и при различном разрешении экрана.

Устранение выявленных недостатков

8

Составление отчета

Составление отчета по курсовой работе в соответствии с СТО ИрГТУ. 005−2007

Отчет по курсовой работе

6. Программное обеспечение, использованное при работе над сайтом

Notepad++ версия 6.5. 5

Достоинства:

Свободный текстовый редактор с открытым исходным кодом для Windows с подсветкой синтаксиса большого количества языков программирования, в т. ч. HTML и CSS, что позволяет эффективно писать код.

Недостатки:

Создание сайта в редакторе Notepad++ удобнее, чем во встроенном редакторе Блокнот, но, тем не менее, требует много времени на верстку.

Графический редактор Microsoft Office Picture Manager

Достоинства:

Удобный и простой в использовании графический редактор, позволяющий выполнить такие базовые функции, как изменение размера путем обрезки или сжатия для web-страниц.

Недостатки:

Сжатие для web-страниц происходит до ~ 40 килобайт, чего, по требованиям курсовой работы, недостаточно.

Графический редактор Paint. NET версия 3.5. 11

Достоинства:

Бесплатный многофункциональный графический редактор, позволяющий работать со слоями. Есть возможность сохранять картинки в формат со сжатием JPEG, что позволяет уменьшить размер файла в 2 — 3 раза без заметного ухудшения качества.

Недостатков не обнаружено.

Браузер Google Chrome версия 35.0. 1916. 114 m

Бесплатный web-браузер, разработанный Google, на движке Webkit, использовался как основная программа для тестирования сайта.

Недостатков не обнаружено.

Браузер Internet Explorer версия 11.0. 9600. 16 428

Распространенный бесплатный браузер компании Microsoft для операционной системы Windows. Использовался как второстепенное средство тестирования сайта для выявления ошибок.

Недостатки:

Медленная скорость работы по сравнению с другими браузерами.

Браузер Mozilla FireFox версия 29.0. 1

Бесплатный браузер с открытым исходным кодом, разработанный компанией Mozilla. Использовался как второстепенное средство тестирования сайта для выявления ошибок.

Недостатков не обнаружено.

7. Тестирование сайта

Тесты проводились в web-браузерах Google Chrome (рис. 3 и рис. 4), Mozilla Firefox (рис. 5 и рис. 6) и Internet Explorer (рис. 7 и рис. 8) при разрешениях экрана 1600Ч900 и 800Ч600.

Рисунок 3 — Тестирование сайта в Google Chrome при разрешении 1600×900

Рисунок 4 — Тестирование сайта в Google Chrome при разрешении 800×600

Рисунок 5 — Тестирование сайта в Internet Explorer при разрешении 1600×900

Рисунок 6 — Тестирование сайта в Internet Explorer при разрешении 800×600

Рисунок 7 — Тестирование сайта в Mozilla FireFox при разрешении 1600×900

Рисунок 8 — Тестирование сайта в Mozilla FireFox при разрешении 800×600

Вывод:

При тестировании никаких критических различий во внешнем виде сайта в разных браузерах и при разных разрешениях обнаруженоне было.

ЗАКЛЮЧЕНИЕ

В данной курсовой работе рассмотрены актуальные вопросы разработки и создания современного Web-сайта.

При этом мною были решены следующие задачи:

— ознакомление с современными Интернет-технологиями и использование их в своей разработке;

— ознакомление с методами и способами представления на Web-страницах различных видов информации (текстов и изображений);

— ознакомление с основными правилами и рекомендациями по разработке и созданию Web-сайтов и неукоснительное следование им в своей практике;

— определение структуры Web-страниц;

— разработка дизайна для хорошего зрительного восприятия;

— предоставление пошаговой стратегии разработки web-сайта.

В результате проведенных работ на базе выбранных технологий был создан прототип современного Web-сайта на тему «Процессоры Intel и их характеристики. История развития. Выбор логической структуры процессора». Готовый продукт прошел тестирование на адекватность работы в наиболее популярных браузерах при различных разрешениях экрана. Тестирование показало корректную работу сайта.

СПИСОК ЛИТЕРАТУРЫ

Информационный сайт о высоких технологиях. URL: http: //www. all-ht. ru (дата обращения 15. 04. 2014)

Гладченко А. История Intel. [электронный ресурс] URL: http: //www. biztimes. ru/index. php? artid=1266 (дата обращения 16. 04. 2014)

История развития вычислительной техники / Ланина Э. П. — ИрГТУ, Иркутск, 2001. — 166 с.

Процессоры Pentium III, Athlon и другие / Гук М., Юров В. — СПб: издательство «Питер», 2000. — 480 с.

Виртуальный компьютерный музей. URL: http: //www. computer-museum. ru (дата обращения 25. 04. 2014)

Официальный сайт компании Intel. URL: http: //www. intel. com (дата обращения 25. 04. 2014)

Коллекция процессоров Intel. URL: http: //cpu. www. ucoz. ru/ (дата обращения 25. 04. 2014)

Полный справочник веб-мастера. URL: http: //www. htmlbook. ru (дата обращения 5. 05. 2014)

Интерактивные онлайн-курсы по HTML и CSS. URL: http: //www. htmlacademy. ru (дата обращения 5. 05. 2014)

Примеры использования HTML, CSS и JavaScript для решения конкретных задач. URL: http: //shpargalkablog. ru/p/html-css-javascript. html (дата обращения 5. 05. 2014).

СТО ИрГТУ. 005−2007 — Стандарт организации. Общие требования к оформлению текстовых и графических работ студентов

Методическое пособие «Курсовой проект по Информатике для АСУ» БахваловаЗ.А. — 2012. — 29с.: ил.

Приложение А

История развития микропроцессоров

Нумерация процессоров Intel

Каждой категории продукции Intel была присвоена своя цифра.

Первыми изделиями Intel стали микросхемы памяти (PMOS-чипы), которым была присвоена нумерация 1xxx. В серии 2xxx разрабатывались микросхемы NMOS. Биполярные микросхемы были отнесены к серии 3xxx. 4-разрядные микропроцессоры получили обозначение 4xxx. Микросхемы CMOS получили обозначение 5xxx, память на магнитных доменах -- 7xxx, 8-ми и более разрядные микропроцессоры и микроконтроллеры принадлежали к серии 8xxx. Серии 6xxx и 9xxx не использовались.

Вторая цифра обозначала тип продукции: 0 -- процессоры, 1-- микросхемы RAM, 2 -- контроллеры, 3 -- микросхемы ROM, 4 -- сдвиговые регистры, 5 -- микросхемы EPLD, 6 -- микросхемы PROM, 7 -- микросхемы EPROM, 8 -- чипы наблюдения и схемы синхронизации в генераторах импульсов, 9 -- чипы для телекоммуникаций.

Третья и четвёртая цифры соответствовали порядковому номеру изделия.

Для таких процессоров как 8086/88, 186/188, 286, 386, 486 были выпущены сопроцессоры для операций с плавающей точкой, как правило последняя цифра у таких сопроцессоров была 7(8087, 187, 287, 387, 487).

1971 — 1979 годы

Intel 4004: первый процессор, реализованный в одной микросхеме (ноябрь 1971 г)

Четырехразрядный процессор с тактовой частотой — 740 КГц, и быстродействием — 92 000 операций в секунду, состоящий из 2250 транзисторов. Технология производства — 10 мкм. Процессор содержал 4 Кб памяти программ и 640 байт памяти данных, 16 индексных регистров.

Intel 4040, улучшенная версия 4004 (1972 г)

Частота и производительность остались прежними (740 КГц, 92 000 оп/с), но была увеличена память программ до 8 Кб, на 14 инструкций увеличен набор команд (стало 60 инструкций), увеличено количество индексных регистров до 24. Главным нововведением была поддержка прерываний.

Процессор содержал 3000 транзисторов и имел технологию производства — 10 мкм.

Intel 8008 (апрель 1972 г)

Процессоры были созданы по технологии — 10 мкм, содержали 3500транзисторов, размещенных в 18-ти контактном керамическом корпусе. Тактовая частота, в зависимости от модификаций, была 500 или 800 КГц, производительность, в зависимости от модификаций процессоров, составляла 45 000−160 000 операций в секунду, адресуемая память составляла 16 Кб, больше не разделяемая на память данных и память программ, количество инструкций — 65.

Intel 8080 (апрель 1974 г)

Процессоры производились по технологии — 6 мкм, содержали 6000транзисторов, размещенных в 40-контактном керамическом корпусе. Они имели 16-разрядную шину адреса и 8-разрядную шину данных, адресуемую память — 64 Кб, количество инструкций — 80, тактовую частоту — 2 МГц, производительность — до 500 000 операций в секунду.

Intel 8085 (март 1976 г)

Процессоры впускались по технологии — 3 мкм, и содержали 6500транзисторов, размещенных в 40-контактном керамическом или пластмассовом корпусе. В зависимости от модификаций процессоров, тактовая частотаизменялась от 3 до 8 МГц, разрядность шины данных составляла 8 бит, разрядность шины адреса — 16 бит, адресуемая память — 64 Кб, разрядность регистров — 8 бит, количество инструкций — 79.

Intel 8086 (июнь 1978 г)

Процессоры производились по технологии — 3 мкм, и содержали 29 000транзисторов, размещаемых в кристалле размером 5,5×5,5 мм. В зависимости от модификации процессоров линейки, тактовая частота изменялась от 5 до 10 МГц, производительность — от 330 до 750 тыс. операций в секунду, разрядность шины данных составляла 16 бит, разрядность шины адреса — 20 бит, адресуемая память — 1 Мб, количество инструкций — 98. Процессоры содержали 14 16-разрядных регистров. Потребляемая мощность составляла 1,75 Вт.

Intel 8088 (июнь 1979 г)

Технические характеристики, в зависимости от модификаций, изменялись в диапазоне: тактовая частота — 5−10 МГц, количество транзисторов — 29 000, адресуемая память — 1Мб, разрядность регистров — 16 бит, разрядность шины данных — 8 бит, разрядность шины адреса — 20 бит, технология производства — 3 мкм, количество инструкций — 98.

1981 — 1989 годы

Intel 8087 (июнь 1980 г)

Сопроцессоры производились по технологии — 3 мкм, и содержали 45 000транзисторов. В зависимости от модификации, они имели тактовую частоту, изменяющуюся в диапазоне от 4 до 10 МГц.

Intel 80 186 (1982 г)

Процессоры производились по технологии — 3 мкм, и содержали 134 000 транзисторов. В зависимости от модификации процессоров, тактовая частота изменялась от 6 до 25 МГц.

Intel 80 188 (1982 г)

Технические характеристики, в зависимости от модификаций, изменялись в диапазоне: тактовая частота — 6−20 МГц, адресуемая память — 1 Мб, разрядностьрегистров — 16 бит, разрядность шины данных — 8 бит, разрядность шины адреса — 20 бит, технология производства — 3 мкм.

Intel 80 287 (1982 г)

В зависимости от модификации, сопроцессоры работали на тактовой частоте — от 5 до 20 МГц.

Intel 80 286 (февраль 1982 г)

Технические характеристики, в зависимости от модификаций, изменялись в диапазоне: тактовая частота — 6−25 МГц, набор инструкций — x86−16, 16-ти разрядных регистров — 25, техпроцесс — 1500 нм, кол-во транзисторов — 134 000.

1985 г, октябрь. Intel 80 386 DX

Процессор имел 275 000 транзисторов, и создавался по технологии — 1,5−1 (поздние версии) мкм. В процессоре использовалась 32-разрядная шина адреса, позволяющая работать с 4 Гб памяти ОЗУ, и 32-разрядная шина данных. В зависимости от модификации, тактовая частота изменялась от 12 до 32 МГц. Также процессоры могли работать в защищенном режиме, пользоваться виртуальной памятью и эмулировать работу процессоров 8086.

1987 г. Intel 80 387

Сопроцессоры 80 387 работали на той же частоте, что и процессоры 80 386, и поддерживали тактовые частоты — 16, 20, 25 и 33 МГц. Эта линейка сопроцессоров была быстрее сопроцессоров 80 287, и программы, разработанные для сопроцессоров 80 287, были совместимы с новыми версиями сопроцессоров, так что они быстро вытеснили своих предшественников.

Intel 80 386 SX (июнь 1988 г)

Процессоры содержали 275 000 транзисторов, производились по технологии — 1 мкм, и работали на тактовой частоте, изменяющейся, в зависимости от модификации, от 16 до 33 МГц.

Intel 80 376 (январь 1989 г)

Процессор имел полный набор регистров 386-х процессоров и использовал такой же набор инструкций. Для ускорения обработки математических операций предусматривалась возможность подключения математического сопроцессора 80 387 SX. Процессоры этой линейки работали только в защищенном режиме, но не обеспечивали подкачку программ в память и имели 24-разрядную шину адреса и 16-ти разрядную шину данных.

Intel 80 486 DX (апрель 1989 г)

Процессоры состояли из 1,25 млн. транзисторов и производились по технологии — 1 мкм. Разрядность шины данных и шины адреса — 32 бита. Тактовая частота — 25−50 МГц.

1990 — 1995 годы

Intel 80 386 SL (октябрь 1990 г)

Первая модификация процессора работала на тактовой частоте 20 МГц. Чуть позже, 30 сентября 1991 года, была представлена модификация, работающая на тактовой частоте — 25 МГц. Объем адресуемой памяти составлял 4 Гб, разрядность внешних шин адреса и данных — 32. Предусматривалась возможность подключения внешней КЭШ-памяти

Процессоры содержали 855 000 транзисторов, производились по технологии — 1 мкм, и использовали технологию управления питанием, что позволяло снизить энергопотребление.

Intel 80 486 SX (сентябрь 1991 г)

Процессоры отличались от Intel 486 DX отключенным математическим сопроцессором (по сути, это процессоры Intel 486 DX с обнаруженными при производстве дефектами в математическом сопроцессоре), в некоторых модификациях уменьшали объем встроенной КЭШ-памяти первого уровня.

Intel 80 487 (сентябрь 1991 г)

Использовались совместно с процессорами Intel 486 SX для ускорения обработки операций с вещественными числами.

Intel 80 486 DX2 (март 1992 г)

Технические характеристики, в зависимости от модификации, были следующими: тактовая частота — 50−66 МГц, частота внешней шины — 25−33 МГц, КЭШ-память первого уровня — 8 Кб, КЭШ-память второго уровня (на материнской плате) — до 512 Кб, разрядность шины адреса и данных — 32 бита, количество транзисторов — 1, 25 млн.

Intel 80 486 SX2(1992 г)

Процессоры в этой линейке работали на тактовой частоте в два раза превышающей частоты внешней шины, имели КЭШ-память первого уровня — 8 Кб, могли использовать КЭШ-память второго уровня (размещаемая на материнской плате) — до 512 Кб, содержали 0,9 млн. транзисторов, и производились по технологии — 1 мкм.

Intel 80 486 OverDrive (май 1992 г)

Название OverDrive означает процессор с повышенной производительностью, теперь такие процессоры называют Extreme Edition и используют в высокопроизводительных компьютерах.

Intel 80 486 SL (октябрь 1992 г)

Процессоры работали на тактовых частотах — 20, 25 и 33 МГц, содержали 1,25 миллионов транзисторов, КЭШ-память первого уровня — 8 Кб, и внешнюю КЭШ-память второго уровня — объемом до 512 Кб, размещаемую на материнской плате.

Intel Pentium, ядро P5 (март 1993 г)

Всего было выпущено две модификации процессоров (Pentium 60 и Pentium 66), имеющих тактовую частоту — 60 и 66 МГц, и относящихся к первому поколению процессоров класса Pentium.

Частота системной шины была такой же, как и частота ядра. Процессоры выпускались на основе ядра с кодовым именем P5, содержали 3,1 млн. транзисторов и производились по технологии — 0.8 мкм.

Intel 80 486 DX4 (март 1994 г)

Технические характеристики, в зависимости от модификаций, были следующими: тактовая частота — 75−100 МГц, частота внешней шины — 5−33 МГц, КЭШ-память первого уровня — 16 Кб, КЭШ-память второго уровня (располагалась на материнской плате) — до 512 Мб, разрядность шины данных и адреса — 32 бита, кол-во транзисторов — 1,6 млн.

Intel 80 386 EX (август 1994 г)

Основным отличием от процессоров 80386SX было использование технологии, позволявшей снижать тактовую частоту для экономии энергии, пониженное рабочее напряжение и наличие ряда встроенных в процессор периферийных устройств, таких как таймер, счетчик, сторожевой таймер, контроллеры последовательного и параллельного портов, контроллер DMA, система управления питанием и так далее.

Intel Pentium, ядро P54C (октябрь 1994 г)

Эти процессоры относились ко второму поколению процессоров класса Pentium. Они производились по технологии — 600 нм, содержали 3,2 млн. транзисторов, КЭШ-память — 16 Мб. В зависимости от модификаций процессоров, использовалась тактовая частота, изменяющаяся в диапазоне от 75 до 120 МГц, превышающая тактовую частоту шины FSB в 1,5 раза.

Intel Pentium OverDrive, ядро P24T (февраль 1995 г)

Первые процессоры OverDrive на базе ядра P54T устанавливались в Socket 2 или Socket 3 и предназначались для модернизации компьютеров, работающих на базе 486 процессоров.

В марте 1996 года были выпущены процессоры OverDrive на базе ядра P5T, но работающие на тактовой частоте, равной 120−133 МГц. В этом же месяце были выпущены процессоры OverDrive на базе ядра P54CT (тактовая частота — 125−166 МГц) для модернизации компьютеров с процессорами Pentium на базе ядра P54C (тактовая частота — 75−100 МГц).

Intel Pentium, ядро P54CQS (март 1995 г)

Процессоры этой линейки производились по технологии — 350 нм, содержали 3,3 млн. транзисторов и основывались на микроархитектуре P5. Работали на тактовой частоте — 120 МГц, с системной шиной FSB — 60 МГц. Они содержали КЭШ-память первого уровня (8 Кб — память программ и 8 Кб — память данных). Рабочее напряжение составляло 3,135−3,6 В, а потребляемая мощность — 12,81 Вт.

Intel Pentium, ядро P54CS (июнь 1995 г)

Процессоры линейки были основаны на микроархитектуре P5, содержали 3.4 млн. транзисторов, производились по технологии — 350 нм, и имели тактовую частоту, изменяющуюся, в зависимости от модификации, от 133 до 200 МГц.

Рабочее напряжение составляло 3,135−3,6 В, а расчетная потребляемая мощность изменялась, в зависимости от модификаций процессоров, от 11,2 до 15,5 Вт.

Intel Pentium Pro, ядро P6 (ноябрь 1995 г)

Процессоры производились по технологии — 500 нм (Pentium Pro 150, Pentium Pro 180, Pentium Pro 200) и 350 нм (Pentium Pro 166, Pentium Pro 180, Pentium Pro 200), и содержали 5,5 млн. транзисторов. Процессоры, производимые по технологии — 500 нм, содержали 256 Кб КЭШ-памяти второго уровня, а процессоры, производимые по технологии — 350 нм, имели второй уровень КЭШ-памяти объемом, равным 512−1024 Кб.

Второй уровень КЭШ-памяти размещался отдельно от ядра процессора и соединялся с ним высокоскоростной шиной. Работал второй уровень КЭШ-памяти на тактовой частоте, равной тактовой частоте процессора. Первый уровень КЭШ-памяти у всех процессоров был 16 Кб (8 Кб — память программ и 8 Кб — память данных).

Процессоры работали на частоте, равной 150−200 МГц, с системной шиной FSB, работающей на тактовой частоте, равной 60 МГц для процессоров Pentium Pro 150 и Pentium Pro 180 и 66 МГц для остальных процессоров. Рабочее напряжение составляло 3,1 (Pentium Pro 150) и 3,3 В (для остальных процессоров), а потребляемая мощность — 29,2−47 Вт.

1995 — 1998 годы

Intel Pentium MMX, ядро P55C (январь 1997 г)

Процессоры этой линейки (Pentium MMX 166, Pentium MMX 200 и Pentium MMX 233) производились по технологии — 350 нм, состояли из 4,5 млн. транзисторов, имели КЭШ-память первого уровня — 32 Кб, работали на тактовой частоте — от 166 до 233 МГц, и использовали шину FSB с частотой — 66 МГц. Существовали встраиваемые модификации процессоров на этом ядре.

ПоказатьСвернуть
Заполнить форму текущей работой