Website tasarımında gereken araçlar

Web site tasarımı yaparken çeşitli araçlar (Tool) kullanırız bunlar offline ve online olarak ikiye ayrılırlar.

Bu yazımda sizlere Online araçların ne olduğunu ve adreslerini paylaşıyorum.

Yardımcı olmasını umarım.

 

Color Hex

Color Hex sitesi website tasarlarken kullanılan renk kodunun tüm renk modellerini RGB, HSL, HSV ve CMYK kodlarını ayrıca Triadic, Monochromatic ve Analog renk hesaplamalarınıda yaparak bizlere sunmaktadır.

Dummy Image

Web sitede imaj boyutları belirlerken imaj kullanmak yerine Dummy Image kullanırız. Böylece hem KB olarak siteyi düşük tutarız. İmajların boyutlarıda üzerinde yazdığı içinde alandaki imajın ölçülerinide hızlıca görmüş oluruz.

FreePik (Vector,Image,Icon)

Ücretsiz foto, icon ve vector çalışmaları alabileceğiniz güzel bir kaynaktır. Birçok foto icon ve vektör çalışmayı buradan temin ediyorum gayet kullanışlı ve ücretsiz. Ayrıca ücretli ürünlerde bulunmaktadır.

Bootstrap

Açık kaynak kodlu web geliştiricileri için Html, Css ve Js kodlarının taze bir şekilde servis edildiği web sitesidir. Js ve Css kodlarınızı buradan besleme yaparak kullanabilirsiniz. Örnek temalar ve çeşitli örneklerle yenilikleri takip edebilirsiniz.

FontAwesome

Ikonik fontlar ve css araçları kullanmak için tüm geliştiricilerin kullandığı site.

Enable Javascript

Yaygın web tarayıcılarında javascript devredışı bırakılmış olabilir nasıl açılacağını yönergelerle kullanıcılara anlatan site yönlendirmeniz yeterli.

Graphic Google

Google tarafından Grafiksel öğelerin toplandığı yer olarak algılanabilir Fikir vermesi açısından güzel bir site. Grafik Google, temel olarak üç kelimeyle (Grafik + Git + ogle = Grafik Google) kombinasyon yaratan yaratıcı bir addır. Grafik anlamı “Grafik, bir nesnenin tasarım, resim veya tasviridir”, anlamı “Taşı, Devam Et, İlerleme” ve “aşkla birine bakmak” anlamını çevirmek anlamına gelen “Grafik” anlamı. Grafiksel Google’ın tam anlamı “Grafikler oluşturuyoruz, bu herkesin bu grafikleri görmekten hoşlanacağını online hale getiriyoruz”.

.htaccesstools

Bu sitede, örneğin hotlink koruması, parola koruması veya vurma botlarının engellenmesi için .htaccess dosyaları yaratmak için çeşitli jeneratörler bulacaksınız.

Sadece web araçları değil faydalı olabilecek web blog ve sayfalarıda işinize yarayacaktır. En son gelişmeleri ve yenilikleri takip edebileceğiniz sayfalar aşağıdadır.

Codrops

Codrops, son web eğilimleri, teknikleri ve yeni olasılıklar hakkında makaleler ve öğreticiler yayınlayan bir web tasarım ve geliştirme blogudur. Codrops ekibi, ücretsiz, ilham verici ve yenilikçi içerik sağlamaya adamıştır.

BluePrint

Blueprint, ortak arayüz öğelerinin, kalıplarının ve web üzerindeki etkileşimlerin çoğunu kapsayan React UI bileşenlerinin bir koleksiyonudur. Blueprint’i kullanmak, zararlı ve kullanımı kolay bir kullanıcı ara yüzüyle sonuçlanmanızı ve ürününüzü oluşturan atom parçalarını değil ürününüzü inşa etmeye odaklanmanızı sağlar.

Maplace.js

Maplace.js, Google Haritalar’ı web sitenize yerleştirmenize, harita üzerindeki konumlar için hızla işaretçiler ve kontrol menüsü oluşturmanıza yardımcı olur.
JQuery ve Google Maps API v3 gerektirir; bu nedenle her ikisini de sayfanıza yerleştirmelisiniz.

Flexible.Js

Flexible Grid System bir Responsive CSS Framework‘üdür.
Bu framework sayesinde web uygulamalarınızı hiç olmadığı kadar esnek şekilde kodlamanız mümkündür.

Xml Sitemaps

Her website için olmazsa olmazıdır sitemap
Xml sitemaps sitenizin tüm link katmanlarını çıkartır.
Google veya diğer arama motorlarına xml olarak site hariyanızı gönderebilirsiniz.

Icon Convert

Her websitenin rozetidir iconlar.
Png formatındanki logonuzu ico ya çevirmek için bu siteden faydalanabilirsiniz.
Icon converter sitesinde logonuzu uygun ölçülerde ico ya çevirebilirsiniz tavsiyem 128px olarak çevirip favicon yapmanız.

Bir yanıt yazın