Selam dostlar. Bugün gerçektende harika, süper ötesi bir yazı geliyor. Biliyorsunuz ki Flash yani swf dosyaları artık yavaş yavaş Google amca tarafından indexlenebiliyor. Fakat hala birçok sorun aşılmış değil. Peki çok kolay bir şekilde Seo yapmak istersek? Evet mümkün! Google amcayı öyle bir şekilde yönlendireceğiz ki direkt olarak Html okur gibi okuyacak!

Peki Deep Linking methodu nedir? Şimdi arkadaşlar hemen adres satırına bakalım. Geçmiş aktif değil mi? Yani site adresleri belirli şekilde dağılmış. Parçalara dağılmış halde duruyorlar. İşte Swf dosyaları bundan sonra direkt adres satırından “sayfa yenilenmeden” veri alabilecek güçte!

Swf nin Js Api ile iletişim halinde olduğunu biliyorduk zaten. Bunu kullanan geliştiriciler SWFAddress projesini yaratmışlar. Aynen yukarıda belirttiğim gibi sayfa yenilenmeden adres satırından veri almak, swf yi seolu hale getirmek çok çok kolay. Birkaç adet dosya ve birkaç satır kodcuk ile herşeyi yapabilir güçteyiz!

Peki nasıl kuracağız?

Öncelikle bu adresteki dosyayı yüklüyorsunuz. Şu anda en son versiyonu 2.3 . Neyse zip arşivi halindeki dosyaları çıkarıyorsunuz. İçerisinde örnekler ve gerekli dosyalar var. Biz örnekler içerisideki dosyaları kullanacağız. Çünkü gereksiz, büyük projelerde kullanan fazladan satırlara şimdilik ihtiyacımız yok.

Samples->Cs3 klasörü içerisindeki SWFAddress ve swfobject isimli klasör + SWFAddress.as ve SWFAddressEvent.as yi kendi swf dosyalarınızın olduğunu yere kopyalayın. İşte oldu. Gerekli dosyaların tamamı yüklendi…

Peki nasıl uygulayacağız? ( Deep Linking – Adres Satırı yöntemi )

Arkadaşlar ilk olarak Deep Linking denilen yöntemi deneyeceğiz. Yani adres satırından alınan verileri direkt olarak metin alanına verip göstereceğiz.

Öncelikle html kodlarımız önemli;

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<!-- saved from url=(0014)about:internet -->
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
    <head>
        <title>Bir Öğrenci Klasiği Örnekler</title>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <style type="text/css">
        /*<![CDATA[*/
            html, body, #website {
                height: 100%;
                overflow: hidden;
            }
            body {
                background: #CCCCCC;
                font: 86% Arial, "Helvetica Neue", sans-serif;
                margin: 0;
            }
        /*]]>*/
        </style>
        <script type="text/javascript" src="swfobject/swfobject.js"></script>
        <script type="text/javascript" src="swfaddress/swfaddress.js"></script>
        <script type="text/javascript">
        /*<![CDATA[*/
            swfobject.embedSWF('index.swf', 'website', '100%', '100%', '9.0.45',
                'swfobject/expressinstall.swf', {}, {bgcolor: '#FFFFCD', menu: 'false', wmode: 'opaque'}, {id: 'website'});
        /*]]>*/
        </script>
    </head>
    <body>
        <div id="website">
            <p>In order to view this page you need Flash Player 9+ support!</p>
            <p>
                <a href="http://www.adobe.com/go/getflashplayer">
                    <img src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif" alt="Get Adobe Flash player" />
                </a>
            </p>
        </div>
    </body>
</html>

Burada swfobject sayesinde Js api içerisine swf dosyamızı yüklüyoruz. Bu sayede veri iletişimini sağlayacağız. Neyse bu kodları localhostta çalıştırıp deneyelim. Normalde adres satırı şöyle olacaktır;

localhost/ornek/index.html# Burada en önemli kısım # ve ondan sonrası. Hatırlarsanız Html de ? ile gösterilirdi. Fakat burada bilerek ayrılmışki karışmasın diye. Neyse eğer bu şekilde olduysa Js ve Html tarafında herşey tamamlanmış demektir. Ardından ise As3 kısmına geçeceğiz;

Bir tane metin alanı yaratın. Bu alanın adını ise degisken yapın. Şimdi adres satırından verileri alıp içeride gösteceğiz;

 import SWFAddress;
        import SWFAddressEvent;
SWFAddress.addEventListener(SWFAddressEvent.CHANGE, addressChange)
function addressChange(e:Event){
	var deger:String = SWFAddress.getValue();
       degisken.text = deger;
	}

Gördüğünüz kodda öncelikle sınıflarımızı dahil ediliyoruz. Sonra addressChange yani adres değiştiği anda verileri al diyoruz. SWFAddress.getValue(); sayesinde adres satırındaki # işaretinden sonraki bütün veriler alınıyor.

Eğer ki kodlarımızı denerseniz verilerin sayfa yenilenmeden swf içerisinde gözüktüğünü görürsünüz. Ayrıca diyelim ki ilk merhaba sonra hoşçakal yazdınız. Geri tuşuna bastığınızda ise merhaba tekrar adres satırına gelecek ve içeriye alınacaktır. İstersek adres satırına veri de yollayabiliriz. Evet yapabiliriz! :D Aşağıdaki örneğe bakalım;

import SWFAddress;
        import SWFAddressEvent;
SWFAddress.setTitle("site adı");
SWFAddress.setValue("merhaba");
	}

Bu örnekte setTitle dediğimiz sayfa adı. Diğeri ise # dan sonra merhaba verisini yolluyor. Fark ettiyseniz get ile alıyor, set ile veriyor. Bunun mantığı burada aslında. Son olarak verileri parametler yani değişkenler olarak almak istersek? Yani Html deki gibi sayfa=1&yazi=3 gibi birden fazla değişkeni çekmek istersek? İşte onun içinde bir yöntem mevcut;

import SWFAddress;
       import SWFAddressEvent;
       SWFAddress.getParameter("sayfa");
       SWFAddress.getParameter("yazi");

Bu kodlar ile de #?sayfa=sayfa6&yazi=yazi5 şeklinde bir iskelet kurabiliriz. Ayrıca unutmadan; istersek Swf içerisinden adres satırına ileri-geri yaptırabiliriz. Bunun içinde SWFAddress.forward(); ve SWFAddress.back(); kodları mevcut…

Peki nasıl uygulayacağız? ( SEO yöntemi )

Eğer ki bu yazıya sadece SEO için girdiyseniz “amma da uzattın” diyerek bana biraz kızabilirler. Fakat gerçekten de çok güzel bir sistemi tanıtıyorum. Bunun herkes tarafından anlaşılmasını isterim…

Arkadaşlar swf tarafında bizim yapacağımız pek birşey yok. Önemli kısım ise Js ve PHP veya ASP tarafında gerçekleşiyor. Swf verilerimizi hep Php veya Asp çıktısından hazır olarak alır. Bundan yola çıkarak bir fikir bulmuştum. Bu çıktıları sadece Swf değilde; botlarda kullanabilir hale getirmeyi planladım. Botların Php iskeletine yönlendirilmesi akıllıca bir hareketti. Fakat bütün bir iskeleti tanımlamak zor gelmişti. İşte SwfAddress bu yöntemin üzerine kurulmuş. Botları iskelete değilde; sadece çıktıya aktarıyordu… Kodlarımız;

Bu kodlarımız index.php ye;

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
    <head>
        <script type="text/javascript" src="<?php swfaddress_optimizer('/swfaddress/swfaddress-optimizer.js?flash=8'); ?>"></script>
        <title><?php swfaddress_title('SWFAddress Website'); ?></title>
        <meta http-equiv="content-type" content="text/html; charset=utf-8" />
        <style type="text/css">
        /*<![CDATA[*/
            html, body {
                height: 100%;
                overflow: hidden;
            }
            body {
                background: #CCCCCC;
                font: 86% Arial, "Helvetica Neue", sans-serif;
                margin: 0;
            }
            #content {
                height: 100%;
            }
        /*]]>*/
        </style>
        <script type="text/javascript" src="<?php swfaddress_resource('/swfobject/swfobject.js'); ?>"></script>
        <script type="text/javascript" src="<?php swfaddress_resource('/swfaddress/swfaddress.js'); ?>"></script>
    </head>
    <body>
        <div id="content">
            <div>
                <h1><a href="<?php swfaddress_link('/'); ?>">SWFAddress Website</a></h1>
                <ul>
                    <li><a href="<?php swfaddress_link('/about/'); ?>">SWFAddress Website / About</a></li>
                    <li>
                        <a href="<?php swfaddress_link('/portfolio/'); ?>">SWFAddress Website / Portfolio</a>
                        <ul>
                            <li><a href="<?php swfaddress_link('/portfolio/1/?desc=true&amp;year=2001'); ?>">SWFAddress Website / Portfolio / 1</a></li>
                            <li><a href="<?php swfaddress_link('/portfolio/2/?desc=true'); ?>">SWFAddress Website / Portfolio / 2</a></li>
                            <li><a href="<?php swfaddress_link('/portfolio/3/?desc=false&amp;year=2001'); ?>">SWFAddress Website / Portfolio / 3</a></li>
                        </ul>
                    </li>
                    <li><a href="<?php swfaddress_link('/contact/'); ?>">SWFAddress Website / Contact</a></li>
                </ul>
            </div>
            <div><?php swfaddress_content(); ?></div>
        </div>
        <script type="text/javascript">
        // <![CDATA[
            (new SWFObject('<?php swfaddress_resource('/website.swf?datasource=datasource.php'); ?>', 'website', '100%', '100%', '8', '#CCCCCC', 'high')).write('content');
        // ]]>
        </script>
    </body>
</html>

Arkadaşlar burada bazı önemli noktalar var. Her sayfanın adresleri kodları içerisinde belirtilmiş halde. Bu sayede herşey belirli. Unutmayalım; Google amca ve diğer arama motorları kodları okurlar. İnsan gibi sitelerde dolaşamazlar. İşte bu adresleri alıyorlar ve gerekli yerlere gidiyorlar. Kodları direkt olarak “seo” isimli klasördeki örnekten aldım. Neyse birde bu kodlara göre datasource.php olması lazım. Onun kodları da şöyle;

<?php
$swfaddress = preg_replace('/^(.+)\/$/', '$1', $_GET['swfaddress']);
switch($swfaddress) {
        case '/':
            echo('<p>Quisque libero mauris, ornare in, faucibus ut, facilisis nec, quam. Mauris quis felis ac nisl laoreet adipiscing. Nunc libero. Vivamus nec libero. Fusce neque odio, interdum a, pharetra sit amet, mattis non, nisl. Donec quis metus et pede gravida pharetra. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos hymenaeos. Sed tincidunt ipsum ut mi. Sed tincidunt porta ipsum. Curabitur sem risus, egestas et, ultricies sed, sollicitudin a, nulla. Praesent eget lectus sed erat commodo ultrices. Donec purus enim, nonummy ut, iaculis sit amet, convallis a, est. Mauris consequat, elit et scelerisque posuere, dui est convallis quam, vitae dignissim tortor odio consectetuer leo. Donec turpis velit, varius id, tincidunt sed, sodales id, eros.</p>');
            break;
        case '/about':
            echo('<p>Suspendisse vitae nibh. Curabitur laoreet auctor velit. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos hymenaeos. Etiam tortor. Sed porta diam vel augue. Praesent sollicitudin blandit lectus. Duis interdum, arcu vel convallis porttitor, magna tellus auctor odio, ac lobortis nulla orci vel lacus. Morbi tortor justo, sagittis et, interdum eget, placerat et, metus. Ut quis massa. Phasellus leo nulla, tempus sed, mattis mattis, sodales in, urna. Fusce in purus. Curabitur a lorem quis dolor ultrices egestas. Maecenas dolor elit, tincidunt vel, tempor ac, imperdiet a, quam. Nullam justo. Morbi sagittis. Ut suscipit pulvinar ante. Cras eu tortor. In nonummy, erat eget aliquet molestie, sapien eros pretium lorem, eu pretium urna neque eu purus. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos hymenaeos. Pellentesque scelerisque lorem ut ligula.</p>');
            break;
        case '/portfolio':
            echo('<p>Fusce at ipsum vel diam ullamcorper convallis. Morbi aliquet cursus lacus. Nunc nisi ligula, accumsan sit amet, condimentum nec, ullamcorper a, lectus. Vestibulum ut lectus. Ut rutrum mi nec lectus. Morbi quis nibh. Pellentesque congue, lorem quis porta tincidunt, tellus tortor venenatis leo, vel porttitor massa massa nec dui. In interdum euismod magna. In hac habitasse platea dictumst. Donec erat. Donec nunc ipsum, lobortis ac, feugiat sit amet, vehicula et, tellus. Donec in lacus ac metus condimentum gravida. Duis vehicula. In a neque in purus hendrerit molestie. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas.</p>');
            break;
        case '/portfolio/1':
            echo('<p><img src="' . $base . '/images/1.png" alt="Portfolio 1" width="400" height="300" /><br />');
            echo((isset($_GET['desc']) && $_GET['desc'] == 'true') ? 'Atlantic Hit Mix Calendar<br />' : '');
            echo((isset($_GET['year']) && $_GET['year'] != '') ? $_GET['year'] . '<br />' : '');
            echo('<br /><a href="http://www.sergeevstudio.com">Photos by Lyubomir Sergeev</a></p>');
            break;
        case '/portfolio/2':
            echo('<p><img src="' . $base . '/images/2.png" alt="Portfolio 2" width="400" height="300" /><br />');
            echo((isset($_GET['desc']) && $_GET['desc'] == 'true') ? 'Atlantic Hit Mix Calendar<br />' : '');
            echo((isset($_GET['year']) && $_GET['year'] != '') ? $_GET['year'] . '<br />' : '');
            echo('<br /><a href="http://www.sergeevstudio.com">Photos by Lyubomir Sergeev</a></p>');
            break;
        case '/portfolio/3':
            echo('<p><img src="' . $base . '/images/3.png" alt="Portfolio 3" width="400" height="300" /><br />');
            echo((isset($_GET['desc']) && $_GET['desc'] == 'true') ? 'Atlantic Hit Mix Calendar<br />' : '');
            echo((isset($_GET['year']) && $_GET['year'] != '') ? $_GET['year'] . '<br />' : '');
            echo('<br /><a href="http://www.sergeevstudio.com">Photos by Lyubomir Sergeev</a></p>');
            break;
        case '/contact':
            echo('<p>Nulla nec nunc id urna mollis molestie. Suspendisse potenti. Aliquam vitae dui. In semper ante eu massa. Praesent quis nunc. Vestibulum tristique tortor. Duis feugiat. Nam pharetra vulputate augue. Sed laoreet. Mauris id orci ac nisl consectetuer sollicitudin. Donec eu ante at velit cursus gravida. Suspendisse arcu.</p>');
            break;
        default:
            echo('<p><!-- Status(404 Not Found) -->Page not found.</p>');
            break;
    }
?> ?>

Burada switch döngüsünde direkt olarak swf nin içerisindeki yerlerin verileri var. Adres satırına bakıyorlar ve ona göre yazdırıyorlar. Google amca da sadece bu yazıları görüp, indexliyor. Sonra aynı adrese tıklayan kişi swf ile karşılaşıyor ve bum; SEO görevini tamamladı…

Arkadaşlar aslında SwfAddress dahilinde birçok fonksiyon daha var. Docs isimli klasörden hepsine ulaşabilirsiniz…

Evet arkadaşlar bugün gerçekten güzel bir yazı oldu. Tekrar görüşmek üzere hoşçakalın…