myspace civilized
phidias showing frieze of parthenon to his friends
Wednesday, August 09, 2006
myspace Font Emission Typography
I introduced the concept of Font Emission Typography (since relabeled slightly) in my last post. I've since implemented a more systematic approach. This controls four different typographical factors in trying to trace just what the hell is going on with the font-styling in myspace profile pages: color, font-family, font-size, font-styling.

The effects of this are currently on display on my recivilized profile. [Update: I've posted a screenshot to this blog.]

The result is unsightly, but not uninsightful.

Here is the Myspace Eclectic Style Sheet that I'm actually using:

<style type="text/css">

NOTE { ** FONT-COLOR EMISSIONS TOMOGRAPHY ** }
NOTE { for more information... myspacecivilized.blogspot.com }

NOTE { BODY FONTS }
body{color:red; font-family:Georgia,serif; font-size:14px; font-weight:normal; font-style:normal; text-decoration:line-through;}
table td{color:orange; font-family:Georgia,serif; font-size:14px; font-weight:normal; font-style:normal; text-decoration:line-through;}
table table td{color:green; font-family:Georgia,serif; font-size:14px; font-weight:normal; font-style:normal; text-decoration:line-through;}
table table table td{color:blue; font-family:Georgia,serif; font-size:12px; font-weight:normal; font-style:normal; text-decoration:line-through;}
table table table table td{color:magenta; font-family:Georgia,serif; font-size:12px; font-weight:normal; font-style:normal; text-decoration:line-through;}
p{color:yellow; font-family:Georgia,serif; font-size:11px; font-weight:normal; font-style:normal; text-decoration:line-through;}
u{color:lime; font-family:Georgia,serif; font-size:11px; font-weight:normal; font-style:normal; text-decoration:line-through;}

NOTE { namebox text }
.text{color:maroon; font-family:Georgia,serif; font-size:14px; font-weight:normal; font-style:normal; text-decoration:line-through;}

NOTE { body links }
a, a:link, a:visited, a.searchlinksmall, a.redlink:link, a.redlink:visited
{color:aqua; font-family:Georgia,serif; font-size:12px; font-weight:normal; font-style:normal; text-decoration:line-through;}
a:hover, a.searchlinksmall:hover, a.redlink:hover
{color:black; text-decoration:underline;}



NOTE { HEADER FONTS }
NOTE { namebox h1 }
.nametext {color:red; font-family:Verdana,sans-serif; font-size:26px; font-weight:bold; text-decoration:overline;}

NOTE { blurbs h1 }
table table table .orangetext15 {color:orange; font-family:Verdana,sans-serif; font-size:26px; font-weight:bold; text-decoration:overline;}

NOTE { your network h1 }
.blacktext12 {color:purple; font-family:Verdana,sans-serif; font-size:26px; font-weight:bold; text-decoration:overline;}

NOTE { left col h2 }
.whitetext12 {color:yellow; font-family:Verdana,sans-serif; font-size:20px; font-weight:bold; text-decoration:overline;}

NOTE { blog, friend count h2 }
.btext {color:olive; font-family:Verdana,sans-serif; font-size:20px; font-weight:bold; text-decoration:overline;}

NOTE { friend space, about me h2 }
table table table table .orangetext15 {color:green; font-family:Verdana,sans-serif; font-size:20px; font-weight:bold; text-decoration:overline;}

NOTE { friend num h2 }
.redbtext {color:maroon; font-family:Verdana,sans-serif; font-size:20px; font-weight:bold; text-decoration:overline;}

NOTE { interest, detail labels }
.lightbluetext8 {color:navy; font-family:Verdana,sans-serif; font-size:16px; font-weight:bold; text-decoration:overline;}



NOTE { MARGIN FONTS }
NOTE { above upper ad links }
font {color:lime; font-family:Arial,serif; font-size:9px; font-style:italic; text-decoration:underline;}
a font:hover {color:black; text-decoration:underline;}

NOTE { below upper ad links }
a.navbar:link, a.navbar:visited {color:orange; font-family:Arial,serif; font-size:9px; font-style:italic; text-decoration:underline;}
a.navbar:hover {color:black; text-decoration:underline;}

NOTE { footer links }
a.text:link, a.text:visited {color:yellow; font-family:Arial,serif; font-size:9px; font-style:italic; text-decoration:underline;}
a.text:hover {color:black; text-decoration:underline;}





NOTE { some background styling for visibility }
body{background-color:000000; border-width:0px;}
table{background-color:333333; border-width:0px;}
body table{background-color:999999; border-width:0px;}
table table{background-color:cccccc; border-width:0px;}
table table table{background-color:ffffff; border-width:0px;}
table table table td {background-color:transparent; border-width:0px;}
table table table table {background-color:transparent; border-width:0px;}
form{background-color:none; border-width:0px;}
input{background-color:transparent !important; border-width:0px;}
table td, table table td {background-color: transparent; border-width:0px;}
</style>


(Incidentally, the only practical application for FET I can think of would be for a myspace webpage.)

Labels:

» add your own comment

comments

add your own comment ♥
I'm new to myspace and new to CSS. Do you have a diagram or layout of a typical myspace profile - I just need to know how the tables are named. Which box is "table", which is "table table", which is "table table table"? Thank you - your site is wonderful!

Pam
comment by Anonymous Anonymous at 1:13 AM, October 19, 2008  
add your own comment ♥