Kayıtlar

Renk Paletim

Resim
Web/Grafik Tasarım Çalışmalarımda Kullandığım Renkler #e9e8ef #f5dfd5 #ed393a #4251b6 #6ed6df #f2ce20 #56f8bc #42b1ff #fce55b #ff9f1d #e71d35 #30c4b6 #011627 #0eadf1 #fa3263 #f8ad30 #28cda3 #135b4d #fcd76c #686459 #975592 #a1834d #9f353f #cbbb80 #cb3c74 #6d5b97 #e18bb8 #c59169 #c59169 #d2b356 #b66ba4 #f37a29 #d74061 #fdb33a #6d5b97 #1180ae #d9ba2e #6a6d52 #b32f3d #ca457e #83b14f #81313a #45223a #ef5229 #93366b

SEO Uyumlu Sayfa Örneği

Resim
Bu yazıda SEO uyumlu Sayfa Nasıl Hazırlanır? Onu Araştırdım ve YOAST eklentisini baz alarak bir örnek sayfa oluşturdum. Sayfada yazı olarak lorem ipsum hurufat kelimelerini kullandım.

Örnek Sayfa

SEO UYUMLU SAYFA ÖRNEĞİ Lorem ipsum dolor sit amet, seo uyumlu sayfa consectetur adipiscing elit. Donec volutpat blandit risus ornare tempor.
SEO ile ilgili  tanım için Mauris a ipsum venenatis, commodo enim a, dignissim metus. Proin eget molestie odio. Maecenas porttitor urna et elit eleifend euismod. Suspendisse facilisis sem vel lorem tristique auctor. Sed sed ultricies elit. Pellentesque euismod placerat lobortis. Aliquam sollicitudin tincidunt dui, vitae faucibus orci mollis sit amet. Nunc vitae tortor sodales, fermentum tortor eu, luctus risus. Sed eget ligula ac tortor mollis ultricies. Aenean augue ipsum, ornare sit amet tristique et, dapibus vitae lectus seo uyumlu sayfa. Quisque gravida quam at turpis consectetur, et pellentesque nibh gravida. Integer lacinia fringilla turp…

CSS ile Overlay Yapmak

Resim
Resim BaşlığıResim Yazısı. <!DOCTYPE html>
<html>
<head>
<title>CSS Overlay Efekti</title>
<style>
.kapsayici{

width:800px;
height:476px;
overflow:hidden;
text-align:center;
position:relative;
}
.perde{
position:absolute;
top:100%;left:0;right:0;bottom:0;
background:rgba(237,71,74,0.5);
color:#fff;
z-index:1;
padding-top:45%;
transition:top 0.5s;
}
.kapsayici:hover .perde{
top:0;
}
</style>
</head>
<body>
  <div class="kapsayici">
           <img src="/kirmizi-mercedes.jpg" />
     <div class="perde">
         <h3>Resim Başlığı</h3>
         <p>Resim Yazısı.</p>
    </div>
</div>

</body>
</html>
CSS overlay efetki ve diğer pratik bilgiler için Arin Yazılımın videolarını izleyebilirsiniz
https://www.youtube.com/watch?v=3aoOP_1mpws&list=PL-Hkw4CrSVq9GTqLreY9l5MiJJm6EOkal&index=7

Günlük SEO Çalışması

Resim
SEO İş Listesi
Search Console İçinde Yapılması Gerekenler

- Search Console'da Arama Trafiği altındaki Search Analytics panelinden çalışılan anahtar kelimeler için anahtar kelime gösterim, tıklama ve sıralama istatistiğinin incelenmesi.
Burada anahtar kelimelerin konumları ve tıklanma oranlarının yanı sıra o anahtar kelimenin yönlendirdiği sayfaların da incelenmesi gerekir.

- Search Console ekranında Arama Görünümü altında HTML Geliştirmeleri panelinde Meta açıklamalar ile ilgili hataların düzeltilmesi
Bu panelden site içindeki Yinelenen Meta Açıklamalar, Uzun Meta Açıklamalar, Kısa Meta Açıklamalar, Eksik Başlık Etiketleri, Yinelenen Başlık Etiketleri, Uzun Başlık Etiketleri ve Kısa Başlık Etiketleri gibi çeşitli uygulama hataları görüntülenir.

- Google Dizin Durumunun denetlenmesi.
Burada dizine eklenen sayfa sayısını ve robots.txt dosyanız tarafından engellenen sayfa sayısını görebilirsiniz, Ayrıca URL kaldır bölümünden istemediğiniz linklerin arama sonuçlarından ve Google indeksin…

JQuery Toggle Açılır Kapanır Menü

Resim
Menünün Çalışır Hali
Aslına bakarsanız önceden bu şekilde bir planlama yapmamıştım ama menü responsive olmuş :)
Toggle Menüyü Çalıştırmak için Tıkla
Menü Elemanı 1Menü Elemanı 2 Toggle Menüyü Çalıştırmak için Tıkla
Menü Elemanı 1Menü Elemanı 2
Menü Kodları Aşağıdaki Gibidir

<!DOCTYPE html>
<html>
<style>
div.menuKutu{float:left;width:200px;display:block;height:auto;background-color:#269470;cursor:pointer;font-size:14px;font-family:Arial;text-align:center;color:white;padding:5px;font-weight:bold;line-height:18px}
div.menuKutu p{height:50px;line-height:50px;display:none;background-color:#45b0a3;padding:0px;margin:0px;}
div.menuKutu p:hover{background-color:#ebb753;padding:0px 1important;}
</style>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>

</head>
<body>
<script type="text/javascript">
$(document).ready(function(){
    $("div.menuKutu").click(function(){

  if($(th…

SEO'nun Arama Sonuçlarına Etkisi

Resim
Günümüzde insanoğlunun en büyük ortak sorunu çevre kirliliği. Havayı, suyu ve toprağı hiç düşünmeden kirletiyoruz. Çevremizi oluşturan, yaşamamızı sağlayan tüm etmenler bizim ürettiğimi atıklar yüzünden kirleniyor. Giderek dünyamız yaşanması imkansız bir yere dönüşüyor. Karaları, denizleri ve havayı kirlettiğimiz gibi, dünyanın ses dengesini de bozuyoruz. Kullandığımız araçlar ve yüksek sesle dinlediğimiz müzikler yüzünden ses kirliliği diye yeni bir şey icat ettik. Tüm bunlar aslında bir nevi aç gözlülükten ve tatminsizlikten kaynaklanıyor. Sınırlarımızı bilmiyoruz.

Bu açgözlülük ve sınır tanımamazlık sanal ortamda da kendisini gösteriyor. Bilişim teknolojisinin baş döndüren bir hızla ilerlediği şu zamanda büyük bir bilgi bombardımanı altına alınmış durumdayız. Hemen her konu ile ilgili bilgiye her an, her yerden ulaşabildiğimiz gibi; çoğu kez bu yerlerden de bir enformasyon yüklemesiyle de karşı karşıyayız. Nasıl yaşamamız gerektiği, ne yememiz-içmemiz, giymemiz gerektiği gibi pek …