????????? ??????? ? ??????? ????????. ?????? ?????? ???????? 27 ??????? 1994 ???? ?? ????????? ????????????? ??-???? ??????? Hotwired. ??? ?????? ????????? 468 ?? 60 ????????, ? ?????? ???? ??????, ?????? ???? ????? ?????????? ???????? ????????. ?? ?????? ??????? ??? ?????????? ????? 468 ?? 60 ????????, ????? ?? ???? ?????? ????? ?????????. ?????? ??????? ?????????? ????? ???? ?? ????????? ???????, ???? ????????? ???? ??????? (?? ?????????? ??????? ? ??????? ??????????????? ??????). ????? ??????????????, ??? ?????? ??????? ??? ????? ????????? ??????? ???????, ?? ??? ?? ???? ??????? ??????????? ?????? 470 ?? 60, ??????? ??????? ????? ????????????, ??? ??? ???????? ?????? ? ????? ?????.

??????????? ??????? ????????

468×60
468×120
500×100
234×60
120×60
150×60
160×60
320×60
270×60
230×60
100×100
240×100
170×100
400×40
180×80
200×80
100×200
125×125
160×120
125×250
250×250
120×240
120×800
120×600
160×600
160×400
250×130
384×115
120×90
88×31

??? ??????????? ???????? ? ???? ?????? ??????? ????????? ?? ???????? ??????? ???????????? ?????? ?????? ? ??????? ??? ????????? ????? ????????, ????????? ????? data:url ????? ???????? ?????????? ???????? ? ???????.

????? ?????? data:URL

<img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADYAAAAKCAMAAADII105AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAFdQTFRFrnsAqncA16QA39OvsowzyrBt3aoAto8z7NNvy5sQwI0A4Lk4z6g0x5QAwqht28Jv/8wA/9Ib1KEAupMz58ph//nC/9tB///d/+Vv7L0UzpsA//Cc+Pj4Zr1LNgAAAHRJREFUeNqU0FkKgDAMBNDRutXdaq3Wuf85jaL/6ZDCYyBQAkqqin+UhLypaaav1PJZcyG4r9USfYyb91uMPROIIVxvwsAEwrTdIelawwSCpd0ltpQf6wmu53LKrNLqCWLO6zqfn5PqCRbZSI5ZIa2etwADAF/7KlmRn64EAAAAAElFTkSuQmCC" alt="image"/>

??? data:[<??? ??????>][;base64],<??????>

??????????? ??????? ????? ???????????? ??????? ???????? ? CSS:

background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADYAAAAKCAMAAADII105AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAFdQTFRFrnsAqncA16QA39OvsowzyrBt3aoAto8z7NNvy5sQwI0A4Lk4z6g0x5QAwqht28Jv/8wA/9Ib1KEAupMz58ph//nC/9tB///d/+Vv7L0UzpsA//Cc+Pj4Zr1LNgAAAHRJREFUeNqU0FkKgDAMBNDRutXdaq3Wuf85jaL/6ZDCYyBQAkqqin+UhLypaaav1PJZcyG4r9USfYyb91uMPROIIVxvwsAEwrTdIelawwSCpd0ltpQf6wmu53LKrNLqCWLO6zqfn5PqCRbZSI5ZIa2etwADAF/7KlmRn64EAAAAAElFTkSuQmCC) top left no-repeat;

??? ?????? ?????????? data:URL

?? ??? ????? ?? ?????? ???????????:

1. ?????????? ?????? ??? ????????????? base64 ??? ???????? ??? ?? ?????????
2. ??????? Internet Explorer 5-7 ?? ???????????? data:URL

?????? ?????????? ???????? ????????? php ???????:

<?php echo base64_encode(file_get_contents("stars.png")) ?>

?????? ?? ???????? ????? ?????? ????? ???????? ???????? Internet Explorer ??????????????? ????? ??????, ??????? ????? ??????????? ?? ?????? ????????? ???????? ????????????. ?????????? ?????????? ???? ? ????????? ????????? ?????????????? ???????? ??????, ??????? ???????? ??????????? ????? ? ??? ?????, ??????? ? ?????? ????????? ??????.

???????? ??????????: websiteoptimization.com

????????? ?????? ?????, ??? ????? ???????? ????? ??? select, file, checkbox, radio ?? ????????? ?????????? ?????????? CSS. ?? ??? ?? ????, ???? ????????? ???????? ? ?????? ??????? ????????? ???? checkbox ? ????? ????????????? ??? ????? ?????? ????, ? ???????? ?? ????? ?? ????? ????????? ?????? ??? ????? ????? ?????? ?????????? ?????? ???????.

??? ????? ? ??????????? ????????? ???? ?????. ???? ?????? ??????? ? ???, ??? ??????? checkbox ???????? ?????????, ?? ????????? ?? ??????? ??????????? display:none, ? ????? ???????? opacity:0 (????????? ?? ???? ???????? ????? ????????? ? ??????? «???????? ?????????? ???? ? ?????????? ?????????«).

????? ???????, ??????? ?????????? ?? ????????, ???????? ????????????, ?? ????????? ??????????, ????? ???????, ?????????. ? ? ?????, ? ??????? ?????????? checkbox ???????? ????????? ? ?????????, ?? ??????? ??????????, ??? ?????? ????????? ?????????? checkbox ? ??? ????? ?? checkbox ???????? ? ????? ???????? ????? ?????, ???? ????????? ????????? ?? ???????? ? ?????????? ????????? ? ?????? ?????????.

  
/*---------- ????? ??????? -----------*/
input {
margin:0;padding:0;
opacity:0;
filter:progid:DXImageTransform.Microsoft.Alpha(opacity=0);
}
.checkboxOn {
background:url(f_logincheckbox_on.png) no-repeat 0 3px;
}
.checkboxOff {
background:url(f_logincheckbox_off.png) no-repeat 0 3px;
}

/*---------- ?????? ????????? ??????-----------*/

function logincheckboxCheck () {
  if (document.getElementById("checkbox1").checked) {
	document.getElementById("checkboxDiv").className="checkboxOn";
   }
	else {
	 document.getElementById("checkboxDiv").className="checkboxOff";
	}
}

/*---------- ???????-----------*/

<div id="checkboxDiv" class="checkboxOn">
	<input type="checkbox" id="checkbox1" onclick="logincheckboxCheck();" class="checkboxOn" checked="checked"/> <label for="checkbox1">????????? ????</label>
</div>

?????? ????????? ???????????????. ?????????? ?????????? ????? ?? ?????? ?????? ?????????? Chebox

? ??????????, ????? ???????? ??? ???????? ???????? ????? ?????? ???????? ?? ???? ???????? ???? ???????? ??????? ???????? ??? ?????????? ????????.

????????????? ?????????? ????????? ???????? ??????? ???????????? ??????? ??????? ?????????????, ????????, ??????????? ?????????? ? ????? ? ??????, ??? ??????????? ??? ???????? ??????????.

?? ??? ????? Microsoft ??????????? ????? ????-?????? ???????????? ????????(Expression Web SuperPreview) ??? ???????? ??????????????? ???????, ??????? ????? ? ??????? Expression Web 3 (????????? ? ??? ?????? ????? ????????? ? ??????? «????? ?????????? ??? ???????? ????????????????? ???????«). ????? ????-?????? ????? «????????? ???????» ??? ?????????? ?????????? ?? ??, ??? ????? Expression Web 2 ??????? ???? ???????????? ????????? ??????? Dreamweaver.

??? ?????? ????? ????????, ??? Expression Web ??? ???? ?? ???????????, ??????? ????? ?????? ? Microsoft ????????, ??? ? ?????? Microsoft Expression Studio, ? ??????? ??? ?????? ??? ?????? ????????. ? ?????? ???? ???????? ?????? Microsoft Expression Blend – WYSIWYG-?????????? ??? ?????????????? ????????????????? ?????????? ??????????, ??????????? ?? ?????? . Microsoft Expression Media — ??????????? ?????????? ??? ???????? ????????? ?????-??????. Microsoft Expression Design — ???????????????? ?????????? ??? ???????????? ??????? ? ?????????? ???????????, ??????? ????????? ????????? ???????????? ???????? ????????????????? ?????????? ??? ?????????? ? web-??????????. ????????? ???? ?????? ?????????? 699$, ????????? Expression Web 2 – 299$. ????? ??????? ? ???, ??? ??? ??????????? ?????????, ??????? ??????? ? ?????? ?????? ?????? ????????, ??? ?????? ????? ????????? ??????? ? ?????.

Microsoft Expression Web 2 ?????????? ? ?????? WYSIWYG ??????????, ??????? ????? ??? ???????? ??????? ??????? ??? ???????????. ? ?????? ??????? ????? ????????, ??? ?? ???????? ???????? ??????? ?? Microsoft ???? ???????? Adobe, ?? ??? ?????? ??????? ? ?? ????? ??????? ???????????? ???????. ????? ???????? ???????? ??? ??? ??????????? ???? ???????? ???????. ?????? ??? ??????????? ????????? ??????? ? ???????? ? ???????? ???????? ??????. ?? ????????? ????? ????????????? ? ????? ???????? 1024?768, 800?600, 640?480. ?????? ???????? ??????? ??? ???????????, ??? ?? ??? ???????? ???????, ??????????????? ???????? ??????? ?? ?????????? ????? ?????? ? ??????? ?????. ????? ???????, ????? ?????????? ? ?????????????? ??????? ?????? ??????? ?????? ?? ??? ????????.

?? ????, ?????? ???????? ???????, ??????? ? ?????? ? ???? ??????????? ???????? ?????????????.

??????? ????? ?? ?????? ?????

????? ?? ???????? ???????? ????????????? ?????????? ???????????? ???????????? ???????????? ???????? ????????? ???????????? ????????? ?????????? ??????, ? ????? ?????????? ????????? ?????? ?? ?????? ? ????? ??????? ????????? ????????????? ??????. ?? ????, ?????? ??????? ????????? ??????????? ????? ????????? ?? ????????? ??????, ? ????????? ??????? ????? ???????? ? ?????????????? ????????? ???? ??????, ?? ?????? ??????????? ?? ????????? ????? ???????? ? ???????????? ???????? ? ????????? ??????? ?? ??????????? ?????.

? ???? ??????? ? ????????? ???????? ????????? ?????????? ??? ?????? ??? ??????? ????????????? ??????, ??? ??????????? ????? ????? ?????????????? ? ? ???? ???????, ????? ????? ???????? ?? ???, ???? ??????????? ????????? ?????? ??????.

?????? ??????, ???????? ????????? ?????

???? ??????? ??????, ??????? ????? ????????? ???????? ???????? ?????? ? ??????, ?????????? ?? ???? ?????, ????? ???????? ? ???????? ???????? ?? ??????????? ??????. ?? ?????, ????? ????????? ????????? ???? ????. ???? ????? ????? ??????? ? ?????? ?????????? ??????, ??????????? ???? ?????? ???????????????????????????????? ? ?????????? ????????? ?????, ?? ?????? ??????? ????? ?????????? ?????. ??? ????????? ?????? ?????? ???????????????, ??????????? ????????? ?????? ??????, ??? ???????, ????? ? ?????, ??? ??? ??????? ? ????? (??????? ??????? ????????? ????? ????? ??????? ? ??????? «???????? ??????? ????????? ?????»).

?????????? ???????

?? ?????? ????? ??????????? ???????? ?????? ?? ??????????? ????????. ?? ????, ? ??????????? ????????? ??????????? ??? ???????? ???? ? ????????? ????? ? ??????????? ????? ????????? ??????????? ?????????, ??????? ????? ??????????. ????? ????????, ??? ????? ????? ????? ?? ????? ??????? ??????????? ???????? ???????, ??? ??? ? ??? ??? ??????? ????? ????? ????????? ???????? ????? ??? ???????, ?????????? ??? ????????????????, ???????. ???? ???? ????? ??????????? ? ????????? ????????, ??? ??? ?????, ????? ????????????? ?????????? ???????? ? ??????? ???????????? ??????.

??????? ???????? ????????? ?????????.

?? ???? ????? ??????????? ??????? ???????? ????????? ?????????. ?? ???? ??? ????????? ???, ??????? ??? ????????? ?? ?????? ????? ???????, ??????????? ? ?????. ??? ??????? ?????????? ????? ?????? ???? ???? ????? ???? ??????? ?? ??????????? ????? ???????? ??????? ??????? ????????, ? ??????? ?????? ???????? ????????? ???????? ???????? ??????????? ?????????.

??????? ???? ?????????? ?????????.

?? ????????? ????? ??????????? ??????? ???? ???????????? ? ?????????? ????????? ??????? ???????????? ????? ??????????? ??? ?????? ??????, ???? ??????? ??????? ?? ??????? ???????????? ??????.

??? ?????? ????????????? ????? ???????? ???????????? ??????????? ??? ?????? ???????? ???????????? ?????? ???????? ??????. ? ???? ?????? ???????? ??? ??????????? ??????? ????? ????????? ? ??????? (»?????????????? ????? ????????????«). ?????, ??? ????????? ?? ????????????? ?????, ??? ? ???????? ???????? ?? Microsoft ?????? FrontPage ???? ??? ???? ?????????? ??? ????????????? – Expression Web .

?? ??? ????? ????? ???????? ??? Microsoft ??????? ????? ??????? ? ??????? ???????? ????? ?????????? ??? ????????? Expression Web SuperPreview. ??? ????????? ??? ????????????????? ????????? ???????. ?????? ?????? ???????? ?????? ???? ??????, ? ??????? ????? ????????????? ??????? ?????? ? Internet Explorer 6 ? 7 ?????? ? ??????? ??? ????? ???????. ? ????????? ?????? Expression Web 3, ????? ????? ????????????? ??????? ?? ???? ?????????? ?????????.

????????? Expression Web SuperPreview ?? ???? ???????? ????????????? ???????????. ??? ?????? ????????? ??? ?????????? ????????? ? ??????? ????????? ???????? ???????. ? ????????? ???? ??????? ????????? ??????????? ????????? ??????? ?? ????????????, ?????? ??????? ?????? ? ??? ????????? ?????? ??????????? ????. ? ????????? ???????? ??????? ?????????? ???????????? ?????????? ???????? ? ??????????? ???????? ??????????? ????????. ?????? ???????? ??????? – ??????? ??????? ?? ????????? ? ???????????. ????? ?????? ??, ??? ? ????????? ??????????? ??????????? ?????????????? ????????? ??????? ? ?????????? ????? ?????????, ??????? ????? ?????????? ??? ??????????, ??? ?????????.

??, ???????? ?? ??? ??? ????????????, ????????? ????? ??? ???????????? ??? ??? ???? ???????????. ??????? ?????? ????????? ????? ???? ?? ?????????? ??? ?? ???????. ????? ????? ?????? ???????? ????????? ??????? ?????? ???????? ? ??? ????, ? ??????? ?? ????????? ?????? ????????. ????? ???????, ?????? ????????? ????????????????? ???????? ? ?????. ????? ?????? ??????????? ????????? ??, ??? ??? ?????????? ???????? ??????? ?????? ? ?????????? 1024 ???????? ? ? ?????? ???????? ??????????? ?????? (????? ?????? ?????????????? ????????).

????? ??? ???? ????????? ?????????? ?? ????? ??? ???????? ????????, ??????? ?? ????? ???????? ?????????? IETester ??? Multiplie IE.

?????? ??????????? ??????? ???????????? ??????? ????????????????? ????????.«???????» — ???????????????? ?????? ???????? ? ??????.

?????? ????????? ?????? ? ????????-????????? ? ??????, ??? ? ??? ???????????? ?????? ???????. ? ??????????? ??????? ? ????????-????????? ?????? ??????? ????????? ? ???? ??????? ???????????? ???????????, ? ??????? ? ??????? ???????? ???????? ? ???????? ??????????? ??????. ????? ?????? ?????????? ????? ??? ???????????

? ??????????? ?????????? ?????? ?????? ????????? ??, ??? ?????????? ?? ?????? ?????? ?????????? ??????? ? ?????? ???????? ?????????? ? ???????????? ??? ????? ?????????? ???????????, ??? ?????????? – ?????? ???????. ??????? ? ???????? ????? ???? ??? ????????????? ?????? ? ??????????????, ??? ????????? ? ??????????? ?????? ? ?????? ?? ??? ?????? ????????? ????? ?????.

?? ???? ? ?????? ?????? ??????????? ?????? ??????? ? ????????? ????????. ? ?????? ????????? ???????????? ?? ???????, ? ??????, ????????? ?? ?????????. ????? ???????, ????? ???????? ????, ??? ? ??????????? ?? ?????????? ?????? ?????????? ??????? ? ?????? ????? ??????????.

? ?????????? ??????? ????? ?????? ???? ???? ??? ????????. ?????? ??? ????? ???????? ?????? ??????????? ??? ????????? ?????, ????? ???????, ???? ?????? ?? ???????? ???? ????? ??? ?????????? ???????? ?? ??? ???????????, ???? ???, ?? ????????? ??????? ??????????? ?? ????? ??????. ?????????? ????? ?????? ? ???, ??? ? ??????????? ?? ?????????? ??????, ?????? ?? ?????????? ???????? ? ?????? ????? ????????? ????? ????????? ???????????? ??????? ???????? ??????????? ??????. ??? ?????? ?????????? ??????? ???????.

?????? ????? ??????? ? ?????????? ????????? ?????? ? ???? ???????? ????????? ??????? ? ????? ??????(ul/ol) ????????????? ?? ??????, ? ? ???????? ?????? ???????? ??????????? ??????? ? display:inline-block. ? ?????????? ??????? ???????, ? ??????? ? ?????? ???????? ????????? ?? ?????? ? ?? ?????????? ??????? ?? ?????????? ??????. ??? ?????? ?????????? ??????? ?????? .

??? ???? ???? ????????? ??????? ??? ?????????? ?????????? ??????? ? ?????? ? ??????????? ?? ?????????? ????? ??????????????? ???????? ??????????????? ? ????????. ????? ???????, ? ????? ?????? ??????????? ????????? ????????????? ???????? ??????? ? ????????-???????? ????? ????? ??????, ??? ????? ???????. ????????? ?????.

?????? ? ???? ???? ???????????? ???????? ?? ?.?? — Zodios!

?.?? – ??? ????? ?????? ???????, ?? ??????? ??????? ? ???????? ????? ??????????, ??????????, ?????? ??? ????????, ?????????? ?????, ???????????? ????, ????? ??????, ???????????? ???????? ? ???????????? ? ????? ??????????.

??????????? ???? ?????????, ???????, ???????? ?? ?????? ? ??? ????????? ????????, ?????????? ?????? ??? ?????? ????. ?? ??? ????? ??? ??????????????? ????????? ????? ??????????? ????????? ??????? ??? ??? «????? ??? web ??????????? ? ?????????????????» ?????????? ?????????? ??????? ? ????? ?????.

? ????? ??? ????? ???????????. ? ????? «????? ??? web ??????????? ? ?????????????????» ???????????? ????? ????? ??????????? ?????????, ??????? ?????????????? ????????????? ? ??????? ??? ????? ?????????? ????????????? ???? ??????????. ? ????????, ??????? ???????? ?????? ????? ????????????? ?????? – ???????? ?????????? ????????. ?? ?????? ?? ??, ??? ????? ????????? ??????, ??????? ??????? ?? ?????? ??????? ??????????? ? ????????. ??, ???????? ?? ???, ? ????? ???????? ????? ????? ???????? ???????, ??????? ?????? ?????????? ?????? ???????? ??????? ????? ??????????, ???? ?????????? ?? ??????? ????? ???????????? ?????????. ???? ???????????? ????? ?????????? ??????, ??????? ??? ???????????.

• ??? ????? ?? ?????? ????? ?????????, ??? ????? ??????? ?????? ??? ???.
• ??????????? ???? ????, ? ???? ?? ????????????? ???????????.
• ??????????? ???? ?????????, ?????????? ?? ??????????? ? ?????? ???????? ? ????? ?? ????.
• ???????? ???????? ???????? ???????????? ????????.
• ?????? – ??????, ?????????? ????????.
• ?????? ??? ????? ???????.
• ?? ??????????? ???? ??????! ????????? ???????? ????? ? ????????? ??? ?????????.
• ????????? ??????????? ????????????? ? ?????????? ????? ??????.
• ??????? ?? ??????????? ? ???? ???????.
• ?????????? ?????(??????, ?????????).
• ???-????? = ??????? + ?????????
• ??????????? ???????????.
• ???????? ?????, ?? ???????? ??? ?????????????
• ?????????? ????????????? ?????????.
• ??????????? 2-3 ?????? ??????????.
• ????????? ???????? ?????, ????? ? ??????, ?? ?? ????????????????.
• ???? ???????, ??? ??????? ?? ???????.
• ??????? ????????? ???????? ?? ??????.
• ??????????? ??? ?????????????? ?????? ? ?????? ??? ????? ??????.
• ?????????? ??????? URL-?????????.
• ?????????? ????????????? ?????? ?????? ? ????? ???-????. ?????? ?????? – ?????????????? ?????? ??????????.
• ?? ????????? ???????? ???????????????? ????????? ?????????.
• ??????? ??????? ???????????? ??????????.
• ???????? ??? ???? ??????????????, ????????, ??? ????????? ?????? ??????? ?????.
• ????????? ? ?????? ????? ???????? ?????? ????? ????.
• ?????????? ???????? ???? ? ????? ?????? ??????.
• ?????????? ???? ? ????????????? ??????????.
• ??????????? ????????? ????? ? ????? ??????????.
• ????????? ?????????? ????? ????????? ??? ?????????? ?????.

????? ???? ???????? ???????????? ????? ? ????? ???????? ????? ????? ? ??? ??? ??????????? ???????? ? ?????? ??????? ? ? ???????? ???????????? ??????? ?????????? ?????????? ??????? ? ??????.

????? ?? ??? ???? ?? ??????, ??? ? ??????? ?????? ?????? ??????? ?????? ?????? ???????. ???????? ???? ?????????? ????????, ???????? ????? ?????? ??????? ?????? ?? ??????? ??????????????. ???? ?? ???????? ???????? ????? ?????? – ????? ?????????? ???????????? ????? ?????????? (?????????????? ?????? ?? Dreamweaver). ? ????? ???????? ??? ???????? ????????? ??? Dreamweaver, ??????? ????????? ??????? ?????? ????????? ?????.