İçerik bölümlerini ekleyelim

Geriye 3 tane bölümümüz kaldı. Daha sonra sitemiz bitiyor. Hakkımızda, Duyurular ve Kurumsal bölümlerini oluşturacağız. http://html5doctor.com/designing-a-blog-with-html5/ Hakkımızda bölümü üç ayrı yazıdan oluşacak. Şirketimiz hakkında, referanslar, tarihçe ve kalite felsefemiz. Bunları tek bir bölümde (section) ama 3 ayrı makalede oluşturacağız. Duyurular bölümü ise bir blog gibi olacak. Tıpkı facebook veya twitter’da paylaşıldığı gibi haber formatında olacak. Devam linkine tıklandığında yazının devamı görülecek. Kurumsal bölümü ise şirket ile ilgili bilgileri barındıracak. Yine blog gibi çalışacak. Kenarda en son makalelerin başlantılarını içeren bir bağlantı listesi olacak. Burada da şirketin finansal tabloları gibi TTK’nın emrettiği kurumsal bilgileri barındıracağız. Şimdi hakkımızda bölümünün makaleleri ile işe başlayalım ve boş bir makale oluşturalım. Makalelerimizin yine Google tarafından tanıması için microdata kullanacağız. <section> <article itemscope itemtype="http://schema.org/Article"> <header> <span itemprop="name"><a name="baslik"...
Patreon üyelerine özel içerik.
To view this content, you must be a member of Mutlu's Patreon at "Merakli Bilişimci Üye..." or higher tier
Already a Patreon member? Refresh to access this post.

İçerik ve alt bilgi kısımlarını da Bootstrap için uygun hale getirelim

Genellikle bu tarz şirket sayfalarında ürünleri ya da hizmetleri gösteren 940 piksel genişliğinde bir ana resim bulunur. Bizim de elimizde şöyle bir resim olsun: Bu resmi icerik adlı section etiketimizin hemen altına anaResim adlı div kutusunun içine yerleştireceğiz ki ilk mesajımızın hemen üstünde ama üs kısımın da hemen altında bulunsun. <div id="anaResim"><img src="anaResim.jpg" alt="Ana Resim"/></div> Daha sonra mesaj kısmının olduğu yeri ve altında bulunan bilgi kısmındaki article’ları yerleştirmemiz gerekiyor. Geniş mesajımız tüm sayfayı kaplasın, ürünlere göz atın linkimiz de hemen altında yeralsın. Daha önce yaptığımız gibi satırları oluşturalım. <div id="mesaj"> <div class="row"> <div class="span12"> <h1><strong>İstanbul'daki en hızlı, en kaliteli ve en uygun fiyatlı matbaayı mı arıyorsunuz?</strong></h1> </div> </div> <div class="row"> <div id="inceleyin" class="span4 offset8"> <a class="btn btn-primary btn-large" href="urunler.html">Ürünlerimizi inceleyin</a> </div>...
Patreon üyelerine özel içerik.
To view this content, you must be a member of Mutlu's Patreon at "Merakli Bilişimci Üye..." or higher tier
Already a Patreon member? Refresh to access this post.