Bilmek istediğin her şeye ulaş

Mobil uyumlu web siteleri nasıl yapılıyor?

Google'ın yeni sitesi GoMo'ya göz at derim. Mobil cihazlarda web sitesi konusunda birçok bilgi ve kaynaklara sahip. İşte adresi: howtogomo.com 
  • Paylaş
1

Erdem Güvercinmobilsiteyap.com sitesinde alt sağ köşede htaccess dosyasını indir düzenle public html dosyası içine at sonra cep telefonundan gir test et

Bunun aslında birkaç yöntemi var.
  1. Sitene ekleyeceğin bir kontrol ile eğer mobil bir cihaz ile gönderiliyorsa mobil sayfaya yönlendirirsin. Bu mobil sayfanın tasarımını da seçeceğin bir UI Framework ile tasarlarsın.

    queness.com/post/6706/9-mobile-framework...

  2. Siteni esnek (responsive) bir yapı ile hazırlarsın. Bu da sana hiçbir mobil yönlendirme yapmanı gerektirmeden her türlü mobil cihazda göze hoş görünen bir site sunacaktır.

    webdesignledger.com/tools/8-useful-respo...
  • Paylaş
1

Odfi, aynen responsive yapılar daha kullanışlı bencede ayrı bir site hazırlamak (mobil versiyon uyumlu) ve su siteyide ayrı bir subdomain de barındırarak host un yükünüde hafifletmiş olursun bu yöntem de gayet kullanışlı bahsedildiği gibi bir sorgu ile yönlendirmeni yapar belirli çözünürlük ölçülerine göre sayfa boyutlarını ayarlar (akıllı telefonlar, tabletler, küçük ekranlı telefonlar) cihaza göre görünüm ayarı sağlarsın.
Hazır bir yapı kullanıyor isen (WP, Joomla ,Drupal, opencart vb. gibi ) bunların eklentileri oluyor onlardan dafaydalabilirsin bildiğim kadarı ile Wordpress de jetpack isimli bir eklenti bu işi yapıyordu ama ne kadar sağlıklı tartışılır ben siteme ekledikten bir süre sonra beğenmeyip kaldırdım.
bkz. - onlinedizifilmizle.net

En basit hali ile CSS Media Queries yardımıyla browser boyutuna göre tasarımı ayarlayarak yapabilirsin. Bu en basit yapım şekli ve en ilkeli. Bir çok kişi tarafından da böyle kullanılıyor.

Onun dışında javascript framework'ler yardımıyla yapabilirsin. Örn: Sencha Touch. Html5, Jquery Mobile( Eksikleri olduğuna inanıyorum. Karmaşık bir yapın varsa tercih etme derim. ) Kendo UI vb. birçok framework bulabilirsin. Zamanında bir liste yapmıştım; inploid.com/post/mobile-web-sayfalari-icin-ui-kutuphaneleri/

Css bilgin iyi ise bunların hiç birisine gerek yok en başta belirttiğim media query işini görür. Bildiğin işi yapmak, yeni bir şey öğrenip deneyim kazanarak uygulamaya geçmekten maliyeti çok daha azdır.
  • Paylaş
Responsive Design desteği sunan bir framwork seçmek en iyi seçenek. Mesela getbootstrap.com bu ve bundan daha başka birçok arayüz kodlama fonksiyonu barındırır. Tarayıcılar yavaş yavaş HTML 5 ve CSS3 desteğine kavuşuyor. Ama bazıları kimi özellikleri sunarken, diğer güncel bir tarayıcı aynı şeyleri desteklemeyebiliyor. Bunun için bir çatı kullanmak ve sadece onu güncellemek zamandan kazandırır. Ama mobil site için ayrı bir tasarım yapmanız elbet gerekecek. Yine bu tür çatılar bu konularda araçlara sahiptir.
  • Paylaş
Css ile

if(browser == mobile)
mobile.csselse

web.css
  • Paylaş
Responsive Design kavramını araştırın. Ya da bir framework kullanın en popüleri bootstrap'dir.
  • Paylaş
Sitenizin mobil uyumlu olması için Responsive= çoklu ekran desteklemesi gerekmektedir. Bu da siteniz sadece mobil değil ipad vs gibi diğer cihazlara da uyumludur.Yani web sayfanıza farklı cihazlardan (akıllı telefon, tablet, tv , masaüstü, notebook vb.) giriş yapıldığında ekranınız şekil değiştirerek kayarak esneyerek bu ekranlara otomatik olarak uyum sağlar. Resimleriniz, videolarınız, yazılarınız bu cihazlara otomatik olarak uyum sağlar ve kullanıcılarınız sitenizden maksimum fayda sağlar. bunun için her cihaza ayrı bir tasarım yapmanıza gerek yoktur. Bu yüzden Responsive site en kullanışlısıdır. Çünkü; Masaüstü sitenizi cep telefonunda görüntüleyebilmeniz, sitenizin mobil cihazlara uygun olduğu anlamına gelmez.
daha fazla bilgii... linkler
ya da sıfırdan mobil uyumlu bir site yapmak için danışabilirsiniz : info@studiowormhole.com

studiowormhole.com/responsive-mobil-uyu...
studiowormhole.com/mobil-uyumlu-web-sitesi-tasarimi
studiowormhole.com/sitenizi-mobil-uyumlu-yapma
studiowormhole.com/responsive-mobil-uyumlu
studiowormhole.com/mobil-site-hizmetlerimiz/
studiowormhole.com/mobil-site-onemi-hakkinda-uzman-gorusleri/
studiowormhole.com/biliyor-muydunuz/
  • Paylaş
HTML, CSS, Javascript (jQuery Mobile unutulmamalı) kullanarak yapısı hazırlanabilir. Bence bir websitenin mobil tarafını yaparken en dikkat edilmesi gereken nokta ise tasarım. Çünkü siteyi ziyaret eden kişide çok küçük ekranlı bir mobil cihaz da olabilir. Bu kişi de siteyi rahatça gezinip kullanabilmeli.
  • Paylaş
Bildiğin html sadece ekran boyutunu ayarlıyorsun ve çok sade bir dil kullanman gerekiyor ki tüm mobil tarayıcılar tarafından çalıştırılabilsin. 
  • Paylaş

CMS sistemlerden birini kullanıyorsanız, (WordPress, Joomla vb.) gerekli eklentileri sizinle paylaşabilirim sitenizin mobil'e uyumlu olabilmesi için. Bol şans.

  • Paylaş
1

Mete Çeri, joomla ve wordpress etkin kullanıyorum. mobil eklentileri nelerdir ?

Css'de media query'ler ile responsive design'lar yapılıyor artık. Eskiden mobil için ayrı bir site normal web için ayrı bir site tasarlanıyordu. Artık bu aşılmakta yavaş yavaş. "Responsive design" diye aratırsan internette eğer birçok bilgiye rastlarsın.
  • Paylaş
2 secenek var ya responsive yapacaksin siteyi veyahut benimde onerecegim mobil icin ayri bi site yapip klasore aticaksin ve burdan subdomain vericeksin sunucudan ayarlicaksin. 1. Secenek daha kolay olsa da 2. Sinin bazi avantajlari var. Mesela tamamen telefona uyumlu olmasi. Mobil cihazlarin ozelliklerini kullanabilmen gibi.
  • Paylaş
Wordpress kullanan birisi olarak, direk mobil uyumlu temaları kullanıyorum. İşimi fazlasıyla kolaylaştırıyor.
  • Paylaş
Şu sitede ücretsiz bir kurs var(google destekli) . Ayrıca güzel dökümanlar tavsiye ederim
capr.ga/jt

Mobil
  • Paylaş
1

Turker İnanmaz, Çok rica edeceğim bir dahaki vereceğiniz linklerde 2-3 kısa reklam linki ile değil de 5-10 tane falan link kullanın ki verdiğiniz bağlantıya hiç ulaşamayalım!
( udacity.com/course/ud893?utm_source=webf... )

mobilsiteyap.com da 1site 10$ üstelik tasarımı bilgisayarınıza indirebiliyosunuz
  • Paylaş
Sonraki Soru
HESAP OLUŞTUR

İstatistikler

7524 Görüntülenme29 Takipçi15 Yanıt