3 Ağustos 2015
minimalcoding
1478 0

En Çok Kullanılan 5 Front-End Framwork’ü

Son yıllarda mobil tasarımlarım da hız kazanmasıyla, front-end geliştiricilerinin kullandığı web dillerinin ve araçların sayısında hızlı bir artış olduğu bilinen bir gerçek. Frameworkler bu yoğun çalışmaların hem yönlendirici hem de kılavuzu olma işlevini yerine getirerek, arayüz geliştirme sırasında, son kullanıcı ihtiyaçlarının karşılanmasında maksimum esnekliği kazanmakta geliştiricilere ciddi anlamda katkıları olan web kütüphaneleri olarak kabul edilebilirler.

Html, Css, JavaScript gibi dillerin bileşenlerinden derlenen, front-end frameworklerinden, kullanım kolaylığı açısından ve kullanıldıkları projelerle daha kolay fikir edinmemizi sağlamaları, aynı zamanda ulaşılabilir kaynakları fazla olduğu için geliştiricilerin sıklık tercihlerine göre, en popüler framworklere bu yazımızda yer vereceğiz.

Devamı

Devamı
16 Temmuz 2015
minimalcoding
1004 0

Html5 Canvas Kullanımı

Html5 özelliklerinden olan “canvas” html web sayfalarında ihtiyaç duyulan grafik ihtiyaçları için oluşturulmuş nisbeten yeni bir özelliktir. Oluşturulabilecek grafiklerin başlıcaları, geometrik şekiller, metinler ve resimlerdir.

Devamı

Devamı
7 Temmuz 2015
minimalcoding
581 0

CSS Tüm Media (Medya) Tipleri

Farklı medya alanları için farklı CSS tanımlamları yapmak gerekebilir. Daha önceki yazılarımızdan hatırlayacağınız gibi mobil cihazlar ve print yapıları için ayrı CSS sitilleri tanımlamıştık, bu yazımıda CSS içerisinde kullanılan diğer medya tiplerinin ne olduğunu bir tablo üzerinde ifada etmeye çalışacağız.  Devamı

Devamı
5 Temmuz 2015
minimalcoding
3672 0

CSS Responsive Media Query Nedir? Nasıl Kullanılır?

Artık günümüz teknolojisinde yaygın olarak kullanılan mobil cihazlar (Akıllı telefonlar, Tabletler vb.) internet erişimi sağlamsıyla birlikte kullanıcıların siteyi daha rahat dolaşabilmeleri için farklı ekran çözünürlüklerinde web sayfalarının, farklı görüntüleme modellerinin oluşması ihtiyacını doğurdu. Ülkemizde ve Dünyada en çok kullanılan arama motoru olan Google geçtiğimiz ay tüm iltişim kanallarından  responsive (mobil duyarlılık ) özelliğini üst sıralara çıkma kriteri olarak baz alacağını duyurdu. Yani responsive design artık olmazsa olmazlar arasında yer aldı. Peki oluşturulan web sitelerini mobil duyarlı hale nasıl getireceğiz? Html yapımızda oluşturmuş olduğumuz iskeleti farklı erkan modlarında CSS Media Query özelliği ile istediğimiz şekle ve formata sokma imkanımız mevcut. CSS sitil dosyasına ekleyeceğimiz @media yapısı ile belirtmiş olduğumuz genişlik aralıklarında Html yapımızda oluşturmuş olduğumuz taglere farklı davranış biçimleri atayabilir ve istemiş olduğumuz responsive görünümü elde edebiliriz. İşinizi dahada kolaylaştırmak adına oluşturulmuş bir çok front-end frameowrkü mevcut (Foundation,Bootstrap vb) bizim tavsiyemiz en yaygın olarak kullanılan Twitter Bootstrap’tır. İçerisinde hazır olarak gelen responsive grid yapısıyla daha hızlı mobil uyumlu websiteleri oluşturabilirsiniz. Şimdi resposnive yapı için @media özelliğinin nasıl kullanıldığını örneklerle inceleyelim.  Devamı

Devamı
3 Temmuz 2015
minimalcoding
1265 0

Print CSS Nedir? Nasıl Kullanılır?

CSS ile yazıcıdan çıktısı alınacak olan sayfanın istenmeyen alanlarının kaldırılmasını @media print özelliği ile yapmamız mümkün, ilgili sitil dosyasına çıktıda gözükmesini istemediğimiz alanları gizleyebilir , kullanıcılara daha yalın bir web sayfası çıktısı alma imkanı sağlayabilirsiniz. Makale türünden bir web sayası düşündüğümüzde örneğin bir haber sitesi ya da bir blog sitesini ele alacak olursak, kullanıcı deneyiminden yola çıkarak yazıcıdan ilgili makele yazısı, başlığı ve görsel alanlarının çıkması daha doğru olacaktır. Bu gibi durumda menü, yan menü, sayfa sonu (footer) gibi alanları gizlememiz gerekecektir. Okuduğunuz bu makalede çıktı almak için klavyeden Windows kullanıcılar için Ctrl+P Mac kullanıcıları için Cmd+P  tuşuna basarak  çıktı ön izleme ekranından print CSS’in nasıl çalıştığını görebilirsiniz.Şimdi Print CSS’in nasıl kullanılacağına bakalım.

Devamı

Devamı
26 Haziran 2015
minimalcoding
1517 0

Javascript ile input alanlarına sadece rakam girebilmek

Html form elemanlarından, içerisine bilgi girişi yapılacak olan alanların integer veri tipi (sadece sayısal değer) taşımasını talep edebiliriz. örneğin T.C kimlik no ,kredi kartı kart numarası, telefon numarası , posta kodu vb alanlar sadece sayı girişi yapıla bilecek alanlardan bazılarıdır. Bu gibi durumlarda kullanıcıların bu alanlara string veri tipi (metinsel)  girişini engellemek kullanıcı deneyemi açısından da olumlu olacaktır. Bu işlemi yapabilmek için klavyenin ilgilisiz tuş yapılarını kilitlemek gerekecektir. Bunun için Javascript’in .keyCode (tuş kodları) yapısını kullanmamız yeterli olacaktır. (Javascript Key Code tablosuna buradan ulaşabilirsiniz.) şimdi bu yapının nasıl oluşturulduğuna ve kullanım yapısını inceleyelim..

Devamı

Devamı
25 Haziran 2015
minimalcoding
802 1

Css ile IE10’da input elemanlarından temizleme butonunu kaldırmak.

Internet explorer (ie) de input alanlarının  içine bilgi girişi yapıldığında yanında temizleme butonu (clear field Button,X button) çıkmaktadır, bu özellik kullanıcılara kolaylık sağlasada istenmeyen durumlarda bu butonu gizlemek isteyebilirsiniz. CSS stil dosyanıza ekleyeceğiniz tek satırlık bir kod ile bu yapıyı görünmez kılabilirsiniz.

Devamı

Devamı