Jamie Edwards
05-28-2008, 11:08 AM
Installing it today, I found the install screen (HTML page based) was made with Adobe ImageReady, Photoshop and probably Dreamweaver - I found it amusing :)
Spot the give-aways in the source, as well as the ugly tag-soup :o
Build dynamic, interactive pages that harness the power of the Web to deliver superior quality. Built-in support for today's modern Web standards makes it easy to optimize your sites for accessibility and cross-browser compatibility.
<html>
<head>
<title>Microsoft Expression Studio</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<!-- ImageReady Preload Script (StudioInstallUI.psd) -->
<script type="text/javascript">
<!--
<!--
function newImage(arg) {
if (document.images) {
rslt = new Image();
rslt.src = arg;
return rslt;
}
}
function changeImages() {
if (document.images && (preloadFlag == true)) {
for (var i=0; i<changeImages.arguments.length; i+=2) {
document[changeImages.arguments[i]].src = changeImages.arguments[i+1];
}
}
}
var preloadFlag = false;
function preloadImages() {
if (document.images) {
StudioInstallUI_04_over = newImage("images/StudioInstallUI_04-over.gif");
StudioInstallUI_05_over = newImage("images/StudioInstallUI_05-over.gif");
StudioInstallUI_06_over = newImage("images/StudioInstallUI_06-over.gif");
StudioInstallUI_07_over = newImage("images/StudioInstallUI_07-over.gif");
preloadFlag = true;
}
}
// -->
function MM_preloadImages() { //v3.0
var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}
function MM_swapImgRestore() { //v3.0
var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
}
function MM_findObj(n, d) { //v4.01
var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
if(!x && d.getElementById) x=d.getElementById(n); return x;
}
function MM_swapImage() { //v3.0
var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
}
//-->
</script>
<!-- End Preload Script -->
<style type="text/css">
<!--
<!--
body {
background-color: #000000;
background-image: url(images/bg.jpg);
font-family: Segoe UI, Tahoma, Arial, Helvetica, sans-serif;
}
body {
background-color: #000000;
margin-left: 0px;
margin-top: 0px;
margin-right: 0px;
margin-bottom: 0px;
background-image: url(images/bg.jpg);
}
a:link {
color: #FFFFFF;
}
a:visited {
color: #CCCCCC;
}
a:hover {
color: #FFFF00;
}
a:active {
color: #FFFF00;
}
.style1 {
color: #FFFFFF;
font-size: 12px;
padding-left: 10px;
padding-right: 10px;
}
.style2 {
color: #FFFFFF;
font-size: 12px;
font-weight: bold;
padding-left: 10px;
}
.style3 {
font-size: 14px;
padding-left: 20px;
padding-bottom: 20px;
padding-right: 180px;
color: #000000;
}
.style4 {
font-size: 18px;
font-weight: bold;
padding-left: 10px;
padding-right: 200px;
color: #000000;
}
.style5 {
color: #FFFFFF;
font-weight: bold;
font-size: 16px;
padding-left: 20px;
}
-->
</style></head>
<body bgcolor="#FFFFFF" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0" onLoad="preloadImages();MM_preloadImages('images/WindowsVista_over.gif','images/WindowsXP_over.gif')">
<!-- Slices -->
<div align="center">
<table id="Table_01" width="500" height="560" border="0" cellpadding="0" cellspacing="0">
<tr>
<td height="150" background="images/StudioInstallUI_01.gif"><a href="http://go.microsoft.com/fwlink/?LinkId=82542" target="_blank"><img src="images/StudioInstallUI_01.gif" alt="More information on Microsoft Expression Studio" width="500" height="150" border="0"></a></td>
</tr>
<tr>
<td height="210" valign="bottom" background="images/StudioInstallUI_02.gif"><p class="style4" _locID="Heading">Better Designer Tools for Better End-User Experiences </p>
<p class="style3">Microsoft® Expression® Studio takes your creative possibilities to a new level.</p></td>
</tr>
<tr>
<td height="10">
<img src="images/InstallCDUIver3_03.gif" width="500" height="10" alt=""></td>
</tr>
<tr>
<td height="120" bgcolor="2d2d2d"><p class="style5" align="center">To install, select your Operating System:</p>
<p align="center"><a href="VistaInstall.html" target="_self" onMouseOver="MM_swapImage('Image4','','images/WindowsVista_over.gif',1)" onMouseOut="MM_swapImgRestore()"><img src="images/WindowsVista.gif" name="Image4" width="235" height="55" border="0"></a> <a href="XPInstall.html" target="_self" onMouseOver="MM_swapImage('Image5','','images/WindowsXP_over.gif',1)" onMouseOut="MM_swapImgRestore()"><img src="images/WindowsXP.gif" name="Image5" width="235" height="55" border="0"></a></p></td>
</tr>
<tr>
<td height="15" bgcolor="2d2d2d" class="style1" align="center">More about <a href="http://go.microsoft.com/fwlink/?LinkId=82542" target="_blank">Expression Studio</a>...</td>
</tr>
<tr>
<td>
<img src="images/StudioInstallUI_08.gif" width="500" height="10" alt=""></td>
</tr>
<tr>
<td height="50" background="images/StudioInstallUI_09.gif"> </td>
</tr>
</table>
</div>
<!-- End Slices -->
</body>
</html>
Jokes aside, I am finding the editor to be very good and is producing clean HTML code. It leaves a lot more to the designer than what Dreamweaver does, but for me that is a good thing.
Spot the give-aways in the source, as well as the ugly tag-soup :o
Build dynamic, interactive pages that harness the power of the Web to deliver superior quality. Built-in support for today's modern Web standards makes it easy to optimize your sites for accessibility and cross-browser compatibility.
<html>
<head>
<title>Microsoft Expression Studio</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<!-- ImageReady Preload Script (StudioInstallUI.psd) -->
<script type="text/javascript">
<!--
<!--
function newImage(arg) {
if (document.images) {
rslt = new Image();
rslt.src = arg;
return rslt;
}
}
function changeImages() {
if (document.images && (preloadFlag == true)) {
for (var i=0; i<changeImages.arguments.length; i+=2) {
document[changeImages.arguments[i]].src = changeImages.arguments[i+1];
}
}
}
var preloadFlag = false;
function preloadImages() {
if (document.images) {
StudioInstallUI_04_over = newImage("images/StudioInstallUI_04-over.gif");
StudioInstallUI_05_over = newImage("images/StudioInstallUI_05-over.gif");
StudioInstallUI_06_over = newImage("images/StudioInstallUI_06-over.gif");
StudioInstallUI_07_over = newImage("images/StudioInstallUI_07-over.gif");
preloadFlag = true;
}
}
// -->
function MM_preloadImages() { //v3.0
var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}
function MM_swapImgRestore() { //v3.0
var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
}
function MM_findObj(n, d) { //v4.01
var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
if(!x && d.getElementById) x=d.getElementById(n); return x;
}
function MM_swapImage() { //v3.0
var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
}
//-->
</script>
<!-- End Preload Script -->
<style type="text/css">
<!--
<!--
body {
background-color: #000000;
background-image: url(images/bg.jpg);
font-family: Segoe UI, Tahoma, Arial, Helvetica, sans-serif;
}
body {
background-color: #000000;
margin-left: 0px;
margin-top: 0px;
margin-right: 0px;
margin-bottom: 0px;
background-image: url(images/bg.jpg);
}
a:link {
color: #FFFFFF;
}
a:visited {
color: #CCCCCC;
}
a:hover {
color: #FFFF00;
}
a:active {
color: #FFFF00;
}
.style1 {
color: #FFFFFF;
font-size: 12px;
padding-left: 10px;
padding-right: 10px;
}
.style2 {
color: #FFFFFF;
font-size: 12px;
font-weight: bold;
padding-left: 10px;
}
.style3 {
font-size: 14px;
padding-left: 20px;
padding-bottom: 20px;
padding-right: 180px;
color: #000000;
}
.style4 {
font-size: 18px;
font-weight: bold;
padding-left: 10px;
padding-right: 200px;
color: #000000;
}
.style5 {
color: #FFFFFF;
font-weight: bold;
font-size: 16px;
padding-left: 20px;
}
-->
</style></head>
<body bgcolor="#FFFFFF" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0" onLoad="preloadImages();MM_preloadImages('images/WindowsVista_over.gif','images/WindowsXP_over.gif')">
<!-- Slices -->
<div align="center">
<table id="Table_01" width="500" height="560" border="0" cellpadding="0" cellspacing="0">
<tr>
<td height="150" background="images/StudioInstallUI_01.gif"><a href="http://go.microsoft.com/fwlink/?LinkId=82542" target="_blank"><img src="images/StudioInstallUI_01.gif" alt="More information on Microsoft Expression Studio" width="500" height="150" border="0"></a></td>
</tr>
<tr>
<td height="210" valign="bottom" background="images/StudioInstallUI_02.gif"><p class="style4" _locID="Heading">Better Designer Tools for Better End-User Experiences </p>
<p class="style3">Microsoft® Expression® Studio takes your creative possibilities to a new level.</p></td>
</tr>
<tr>
<td height="10">
<img src="images/InstallCDUIver3_03.gif" width="500" height="10" alt=""></td>
</tr>
<tr>
<td height="120" bgcolor="2d2d2d"><p class="style5" align="center">To install, select your Operating System:</p>
<p align="center"><a href="VistaInstall.html" target="_self" onMouseOver="MM_swapImage('Image4','','images/WindowsVista_over.gif',1)" onMouseOut="MM_swapImgRestore()"><img src="images/WindowsVista.gif" name="Image4" width="235" height="55" border="0"></a> <a href="XPInstall.html" target="_self" onMouseOver="MM_swapImage('Image5','','images/WindowsXP_over.gif',1)" onMouseOut="MM_swapImgRestore()"><img src="images/WindowsXP.gif" name="Image5" width="235" height="55" border="0"></a></p></td>
</tr>
<tr>
<td height="15" bgcolor="2d2d2d" class="style1" align="center">More about <a href="http://go.microsoft.com/fwlink/?LinkId=82542" target="_blank">Expression Studio</a>...</td>
</tr>
<tr>
<td>
<img src="images/StudioInstallUI_08.gif" width="500" height="10" alt=""></td>
</tr>
<tr>
<td height="50" background="images/StudioInstallUI_09.gif"> </td>
</tr>
</table>
</div>
<!-- End Slices -->
</body>
</html>
Jokes aside, I am finding the editor to be very good and is producing clean HTML code. It leaves a lot more to the designer than what Dreamweaver does, but for me that is a good thing.