Creative-Blog

Mavi Radyo Sitesi

Mavi Radyo Sitesi Tasarımı

Bir istek üzerine yapılan bu mavi radyo sitesi tasarımını size sunuyorum. İsteyen arkadaşa kodlayıp verdikten sonra sitemde yayınladım. Kullananlar hayrını görsün. =)

- Mavi ve mavi tonları kullanıldı.

- Arkaplana çizgili açık renklerde mavi bir arkaplan eklenerek tasarıma uygun hale getirildi.

- Tasarımın üst tarafının soluna açık mavi renklerinde bir radyo resmi, sol tarafına ufak bir radyo ve orta tarafınada iple bağlanmış sosyal medya butonları eklendi.

- Tasarımın sağ tarafına hoverli menüler, reklam alanı (90x90) , ve haftanın videosu bölümü eklendi.

- Alt kısmına 468x60 reklam alanı eklenerek reklam olanağı sağladı.

Not: Önizleme için resmin üstüne yada kodların altındaki yazıya tıklayanız.

Css Bölümüne:

Tasarım Üzerine:

<table width="960" cellspacing="0" cellpadding="0" border="0">     <tbody>         <tr>             <td width="960" height="273" background="https://img.webme.com/pic/c/creative-blog/m-r-s_01.png">             <table width="960" height="184" cellspacing="0" cellpadding="0" border="0">                 <tbody>                     <tr>                         <td width="585" valign="top" height="184"><a href="#" _fcksavedurl="#">                         <div id="Sosyal-Paylas1"> </div>                         </a>  <a href="https://twitter.com/" _fcksavedurl="https://twitter.com/">                         <div id="Sosyal-Paylas2"> </div>                         </a>  <a href="https://www.facebook.com/" _fcksavedurl="https://www.facebook.com/">                         <div id="Sosyal-Paylas3"> </div>                         </a>                         <div id="Ekstra-Yazi1">Buraya Ekstra Yazı Eklenebilir.</div>                         </td>                         <td width="375" valign="top" height="273">                         <div id="MRS-Radyo">                         <div style="text-align: center"><object width="200" height="30" data="http://www.palfm.com.tr/WebPlayer/Swfs/PalPlayer.swf?RID=1&strNO=1&ap=1" type="application/x-shockwave-flash">                         <param value="http://www.palfm.com.tr/WebPlayer/Swfs/PalPlayer.swf?RID=1&strNO=1&ap=1" name="movie" />                         <param value="transparent" name="wmode" />      </object></div>                         </div>                         <div id="Ekstra-Yazi2">Buraya Ekstra Yazı Eklenebilir.</div>                         </td>                     </tr>                 </tbody>             </table>             </td>         </tr>         <tr>             <td width="960" height="51" background="https://img.webme.com/pic/c/creative-blog/m-r-s_02.png"> </td>         </tr>         <tr>             <td width="960" valign="top" height="400" background="https://img.webme.com/pic/c/creative-blog/m-r-s_03.png" align="center">             <table width="960" cellspacing="0" cellpadding="0" border="0">                 <tbody>                     <tr>                         <td width="61"> </td>                         <td width="643" valign="top">                          <div id="Icerik">

Tasarım Altına:

</div>                         </td>                         <td width="12"> </td>                         <td width="193" valign="top">                         <table width="193" cellspacing="0" cellpadding="0" border="0">                             <tbody>                                 <tr>                                     <td> </td>                                 </tr>                                 <tr>                                     <td width="193" height="35" background="https://img.webme.com/pic/c/creative-blog/m-r-s-menu-baslik.png">                                     <div class="MRS-Baslik">Başlık Eklenecek</div>                                     </td>                                 </tr>                                 <tr>                                     <td>                                     <div id="MRS-Menu">                                     <ul>                                         <li><a href="#" _fcksavedurl="#">Eklenecek </a></li>                                         <li><a href="#" _fcksavedurl="#">Eklenecek </a></li>                                         <li><a href="#" _fcksavedurl="#">Eklenecek</a></li>                                         <li><a href="#" _fcksavedurl="#">Eklenecek</a></li>                                         <li><a href="#" _fcksavedurl="#">Eklenecek</a></li>                                         <li><a href="#" _fcksavedurl="#">Eklenecek </a></li>                                         <li><a href="#" _fcksavedurl="#">Eklenecek </a></li>                                         <li><a href="#" _fcksavedurl="#">Eklenecek</a></li>                                     </ul>                                     </div>                                     </td>                                 </tr>                                 <tr>                                     <td width="193" height="35" background="https://img.webme.com/pic/c/creative-blog/m-r-s-menu-baslik.png">                                     <div class="MRS-Baslik">Başlık Eklenecek</div>                                     </td>                                 </tr>                                 <tr>                                     <td>                                     <div id="MRS-Menu">                                     <ul>                                         <li><a href="#" _fcksavedurl="#">Eklenecek </a></li>                                         <li><a href="#" _fcksavedurl="#">Eklenecek </a></li>                                         <li><a href="#" _fcksavedurl="#">Eklenecek</a></li>                                         <li><a href="#" _fcksavedurl="#">Eklenecek</a></li>                                         <li><a href="#" _fcksavedurl="#">Eklenecek</a></li>                                         <li><a href="#" _fcksavedurl="#">Eklenecek </a></li>                                         <li><a href="#" _fcksavedurl="#">Eklenecek </a></li>                                         <li><a href="#" _fcksavedurl="#">Eklenecek</a></li>                                     </ul>                                     </div>                                     </td>                                 </tr>                                 <tr>                                     <td width="193" height="35" background="https://img.webme.com/pic/c/creative-blog/m-r-s-menu-baslik.png">                                     <div class="MRS-Baslik">Reklam Alanı</div>                                     </td>                                 </tr>                                 <tr>                                     <td align="center">                                     <div id="Reklamlar"><a href="#" _fcksavedurl="#"><img border="0" src="https://img.webme.com/pic/c/creative-blog/m-r-s-reklam.png" _fcksavedurl="https://img.webme.com/pic/c/creative-blog/m-r-s-reklam.png" alt="" /></a><a href="#" _fcksavedurl="#"><img border="0" src="https://img.webme.com/pic/c/creative-blog/m-r-s-reklam.png" _fcksavedurl="https://img.webme.com/pic/c/creative-blog/m-r-s-reklam.png" alt="" /></a><br />                                     <a href="#" _fcksavedurl="#"><img border="0" src="https://img.webme.com/pic/c/creative-blog/m-r-s-reklam.png" _fcksavedurl="https://img.webme.com/pic/c/creative-blog/m-r-s-reklam.png" alt="" /></a><a href="#" _fcksavedurl="#"><img border="0" src="https://img.webme.com/pic/c/creative-blog/m-r-s-reklam.png" _fcksavedurl="https://img.webme.com/pic/c/creative-blog/m-r-s-reklam.png" alt="" /><br />                                     </a></div>                                     </td>                                 </tr>                                 <tr>                                     <td width="193" height="35" background="https://img.webme.com/pic/c/creative-blog/m-r-s-menu-baslik.png">                                     <div class="MRS-Baslik">Haftanın Videosu</div>                                     </td>                                 </tr>                                 <tr>                                     <td align="center">                                     <div id="Video"><iframe height="150" src="http://www.youtube.com/embed/WgKExOneYqs" frameborder="0" width="170" allowfullscreen=""></iframe></div>                                     </td>                                 </tr>                             </tbody>                         </table>                         </td>                         <td width="51"> </td>                     </tr>                 </tbody>             </table>             </td>         </tr>         <tr>             <td width="960" height="151" background="https://img.webme.com/pic/c/creative-blog/m-r-s_04.png">             <div id="Reklam"><a href="#" _fcksavedurl="#"><img border="0" alt="" src="https://img.webme.com/pic/c/creative-blog/m-r-s-reklam-buyuk.png" _fcksavedurl="https://img.webme.com/pic/c/creative-blog/m-r-s-reklam-buyuk.png" /></a></div>             <a href="http://creative-blog.tr.gg/" _fcksavedurl="http://creative-blog.tr.gg/">             <div id="CB"> </div>             </a></td>         </tr>     </tbody> </table>

Ana Sayfa Kodu:

<table width="530" cellspacing="0" cellpadding="0" border="0">                             <tbody>                                 <tr>                                     <td>                                     <div id="MRS-Blog">                                     <div id="MRS-Basliklar">Buraya Başlık</div>                                     <div id="MRS-Resim"><img border="1" src="http://www.animated-gifs.eu/avatars-100x100-horror/0039.gif" _fcksavedurl="http://www.animated-gifs.eu/avatars-100x100-horror/0039.gif" alt="Animated avatar 100x100" /></div>                                     <div id="MRS-Icerik">Buraya blog içeriği gelecek...</div>                                     <div id="MRS-Devam"><a href="#" _fcksavedurl="#">Devamını Gör...</a></div>                                     </div>                                     </td>                                     <td>                                     <div id="MRS-Blog">                                     <div id="MRS-Basliklar">Buraya Başlık</div>                                     <div id="MRS-Resim"><img border="1" src="http://www.animated-gifs.eu/avatars-100x100-horror/0039.gif" _fcksavedurl="http://www.animated-gifs.eu/avatars-100x100-horror/0039.gif" alt="Animated avatar 100x100" /></div>                                     <div id="MRS-Icerik">Buraya blog içeriği gelecek...</div>                                     <div id="MRS-Devam"><a href="#" _fcksavedurl="#">Devamını Gör...</a></div>                                     </div>                                     </td>                                 </tr>                                 <tr>                                     <td> </td>                                     <td> </td>                                 </tr>                                 <tr>                                     <td>                                     <div id="MRS-Blog">                                     <div id="MRS-Basliklar">Buraya Başlık</div>                                     <div id="MRS-Resim"><img border="1" src="http://www.animated-gifs.eu/avatars-100x100-horror/0039.gif" _fcksavedurl="http://www.animated-gifs.eu/avatars-100x100-horror/0039.gif" alt="Animated avatar 100x100" /></div>                                     <div id="MRS-Icerik">Buraya blog içeriği gelecek...</div>                                     <div id="MRS-Devam"><a href="#" _fcksavedurl="#">Devamını Gör...</a></div>                                     </div>                                     </td>                                     <td>                                     <div id="MRS-Blog">                                     <div id="MRS-Basliklar">Buraya Başlık</div>                                     <div id="MRS-Resim"><img border="1" src="http://www.animated-gifs.eu/avatars-100x100-horror/0039.gif" _fcksavedurl="http://www.animated-gifs.eu/avatars-100x100-horror/0039.gif" alt="Animated avatar 100x100" /></div>                                     <div id="MRS-Icerik">Buraya blog içeriği gelecek...</div>                                     <div id="MRS-Devam"><a href="#" _fcksavedurl="#">Devamını Gör...</a></div>                                     </div>                                     </td>                                 </tr>                                 <tr>                                     <td> </td>                                     <td> </td>                                 </tr>                             </tbody>                         </table>

Tasarımın Önizlemesini Gör

Mavi Radyo Sitesi