Merhaba sevgili blog okuyucuları alan! Bu yazıda bir seçim yaptım 10 -ve HTMLşablonlar İniş Sayfa(sıradan insanlarda bir sayfa), bence daha başarılı ve yüksek bir dönüşümle. Bir zamanlar, açılış sayfaları yapmaya başladığımda ( 4 yıllar önce), sanatçı benden çok kendim ve bu yüzden şablonlar arıyordum. Doğal olarak etrafta sadece tüketim malları, tasarımcılar, ücretli şablonlar vardı. Şimdi tabii bu konu daha basit, çeşitli konularda çok mantıklı şablonlar var ama yine de bakmanız gerekiyor.
dikkatinize sunuyorum 10 HTML tek sayfalık şablonlar. Tarayıcının neden olduğunu söyleyemem G Krom, dosyaların virüslü veya istenmeyen yazılımlar içerdiğine inanıyor (bu tür dosyalarım yoktu ve yok), Google veritabanında sitenin yaptırım altında olduğuna dair bir işaret yok, dosyalar güvenilir ve yaygın bir hizmet tarafından kontrol edildi virüstotal.com/ru/... Bununla henüz çözemedim. Eğer ikna olmadıysam, dosyaları kendiniz kontrol edin. İlk dosyanın ekran görüntüsünü ekleyeceğim, gerisini kendiniz kontrol edin.
Bu makaleyi 29.07.2016 tarihinde editliyorum. Yukarıdakileri silmedim, şimdi olmasına rağmen G Krom sitemi dikkate almıyor ve bir güvenlik riski oluşturuyor. Nasıl yaptığımı ve hangi hizmeti kullandığımı aşağıdaki yazılardan birinde yazacağım.
2. Başka bir video gözetimi açılış sayfası. Güzel tasarım, açılır formların animasyonu, açılır açıklamalı mükemmel galeri, incelemeler;
3. Şablon "Kapıların montajı". Basit ve tematik tasarım, geri bildirim formu, incelemeler;
4. Şablon "Uluslararası kargo taşımacılığı". Güzel tasarım, geri bildirim formları, kaydırıcılı geri sayım, açılır pencerelerde etkinliklerin açıklaması;
5. Şablon "Kargo taşımacılığı". Mükemmel tematik tasarım, geri bildirim ve sipariş formları, animasyonlar;
6. "Sipariş edilecek mutfaklar" şablonu. Tematik tasarım, geri bildirim formları, kaydırıcılı geri sayım, açılır pencerelerde açıklamalar;
7. Başka bir şablon "Sipariş edilecek mutfaklar". Tasarımda minimalizm, geri bildirim formları, galeri;
8. Şablon "Daire ve ofislerin onarımı ve dekorasyonu." Güzel ve hafif tasarım, geri bildirim formları, incelemeler;
9. Şablon "Kirpik". İyi tasarım, geri bildirim formları, fiyat listesi, galeri;
10. Şablon "Otomobil bayisinin restorasyonu". Güzel tasarım, kaydırıcı, galeri, geri bildirim formu şeklinde gezinme;
Umarım kendiniz için ilginç bir şey bulmuşsunuzdur ve şablonları kullanmışsınızdır.
Herhangi bir sorunuz varsa veya yardıma ihtiyacınız varsa, makaleye yorumları yazın, herkese cevap vereceğim, herkese yardım edeceğim.
Selam. Tek sayfalı siteler bugün hala popülerdir ve bunun iyi bir nedeni vardır. Tam teşekküllü çok sayfalı sitelere göre bir takım avantajları vardır. Tek sayfalık bir sayfada (açılış sayfası olarak da bilinir), bir kişi tek bir fikre, tek bir ürüne odaklanır, bu da teklifinizi dikkati dağılmadan incelemesine ve bir başvurudan ayrılmaya daha istekli olmasına olanak tanır.
"TAMAM"- diyorsun - "Kendime bir açılış sayfası yapmaya karar verdim ama programlama hakkında hiçbir şey anlamıyorum"... Ve bu bir sorun değil. Artık, kodu incelemeden profesyonel bir web sitesi oluşturmak için birçok araç var. Bunlardan biri, WPBackery veya ELEmentor oluşturucu içeren popüler WordPress CMS'dir.
Bu makalede, iş, mal satışı, ajanslar, serbest çalışanlar ve diğer herhangi bir konu için uygun harika açılış sayfası wordpress şablonları sağladım. Sonuçta, bu tür şablonlar kendiniz ve teklifiniz için özelleştirilebilir ve özelleştirilmelidir.
Birçok şablon, paralaks efektleri, düz tasarımlar, tam ekran fotoğraflar ve videolar gibi modaya uygun zil ve ıslık kullanır. Mobil cihazlar için uyarlama her şablona dahildir.
Yeter tartışma, seçimi izleyelim!
not Bir Açılış sayfasının ne olduğunu daha ayrıntılı olarak bilmek istiyorsanız, o zaman bu soruyu ayrıntılı olarak analiz ettiğim ve 27 açılış sayfası örneği verdiğim yer.
CMS WordPress'te bir açılış sayfası (açılış sayfası) oluşturmak için 40 premium şablon seçeneği
1. Köprü
Benim için bu en iyi şablon, çünkü çeşitli konularda 376'dan fazla demoya sahip. Bu şablonu kullanarak tamamen farklı duygular iletebilirsiniz. Güçlü ve sezgisel.
Bu inanılmaz tema, özelleştirilebilir bir kaydırıcıya, tamamen özelleştirilebilir başlıklara, mega menülere, görüntülü telefonlara, sabit veya yapışkan başlıklara, başlıklar için çeşitli logolara, etkileşimli öğelere, 7 farklı portföy düzenine ve daha fazlasına sahiptir ve bu da sonsuz olasılıklar sunar.
Ürününüzün veya teklifinizin benzersiz bir sunumunu yapın. Metinde görsel talimatlar ve ayrıca video talimatları vardır.
2. The7
Yalnızca bir açılış sayfası oluşturmanıza değil, aynı zamanda ek ayarlar olmadan ana proje sitesine entegre etmenize olanak tanıyan gelişmiş ve benzersiz bir şablon sistemi. Şablon, açılış sayfalarında talep edilen birçok hazır blok stili içerir - ekip sunumu, galeri, portföy. Sayfaları önceden yüklemenin güzel efektleri de mevcuttur.
Bu arada The7 artık blogumda.
3. BeTema
Betheme, işlevsellik ve önceden ayarlanmış düzen seçeneklerinin sayısı açısından en büyük şablondur. Bugüne kadar, bu temayı temel alan 400'den fazla demo açılış sayfası var, bunlardan herhangi birini seçip ihtiyaçlarınıza göre uyarlayabilirsiniz. Betheme'deki hazır açılış sayfaları aktif olarak kullanılmaktadır:
- kaydırma efektleri - paralakstan tasarım öğelerinin animasyonlu dönüşümlerine
- tam ekran arka plan videoları
- "Sosyal" düğmeler
- animasyonlu sayaçlar
- çevrimiçi başvuru formları
- portföy bölümleri
- "Çalışanlarımız" bölümü
Birkaç demo daha:
Tema güncellemeleri otomatik olarak yapılır, eklenti güncellemeleri butona tıklanarak yapılır. Demo siteleri Revolution Slider'ı kullanır. Şablon, sayfalar için 5 düzen, 20 özel başlık, Google haritaları için sınırsız stil, birçok şık simge sunar.
Muffin Builder aracı, herhangi bir web geliştirme bilgisi olmadan herhangi bir tasarım oluşturmanıza yardımcı olacaktır. İstenirse, şablonun ana kodunu etkilemeden css kuralları ve js betikleri ekleyebilirsiniz.
Konuyla ilgili seçim:
Ronneby, yüksek performansa ve genişletilmiş seçenekler paneline sahiptir. WordPress açılış sayfaları oluşturmak için en iyi premium eklentiler şablona eklendi. Şablonun geliştiricileri, kullanıcı desteğine özel önem veriyor - sorunun nasıl çözüleceğini açıklayan herhangi bir soru hızlı bir şekilde yanıtlanmalıdır. Tema zaten iki dil için yerelleştirildi, ancak çeviri dosyaları da ona eklenmiş ve siteler için çok dilli destek düzenlemenize olanak tanıyor.
Başka bir örnek demo:
5. Jüpiter
Esnek ve aynı zamanda özelleştirmesi kolay şablon. Tüm olası temalar için 72 sözde dış görünüm içerir. Uygun yönetici. panelinde, yeni başlayanlar bile sayfa oluşturucuyu ve ayarları anlamayı kolay bulacaktır.
240 sayfalık kullanışlı eğitimler ve web sitenizin nasıl harika görünmesini sağlayacak 20 video eğitimi var!)
Jüpiter şablonu aynı zamanda SEO dostudur. Google PageSpeed kontrolleri iyi performans gösterir, bu da arama motorlarının sitenizi seveceği anlamına gelir.
Şablon temiz, derli toplu ve kaliteli tipografi kullanılmıştır. Paralaks gibi görsel efektlerin kullanılması nedeniyle temanın canlı olduğu ortaya çıkıyor ve böyle bir siteye bakmak çok keyifli.
6. WoodMart
En büyük WordPress koleksiyonlarından biri. Şablonlar profesyonel web programcıları tarafından yazıldı ve tasarımlar nitelikli görsel ve UX uzmanları tarafından çizildi. Bu sayede, her biri bir bilgisayarda, cep telefonunda, tablette kullanıma hazır herhangi bir şablonu güvenle koyabilirsiniz. Dahil edilen premium eklentiler:
- WPBackery
- kaydırıcı devrimi
- WooCommerce (çevrimiçi mağaza) ile harika uyum
7. Brooklyn
Brooklyn'in farklı konularda 16 demo görünümü var. Sayfaların modern stili, resimlerin ve yazı tiplerinin birleşimi, bu temaya sahip herhangi bir siteye zarafet katıyor. Portföy bloğu güzelce yürütülür. Şablon ajanslar, ticari şirketler için idealdir. Şablonlar, güven ve güven veren koyu renklerde yapılmıştır. Şablon duyarlı ve tüm cihazlarda harika görünüyor.
Kimseyi kayıtsız bırakmayacak pürüzsüz ve hafif bir şablon. Yüksek kaliteli tipografi ve arayüz öğeleri, bu oyunun şık görünmesini sağlar. awwwards gibi çeşitli tanınmış yarışmaların ve derecelendirmelerin adayı ve kazananı. Aralarından seçim yapabileceğiniz 30'dan fazla farklı temaya sahiptir
Web sitesi yalnızca mobil cihazlara uyum sağlamakla kalmaz, aynı zamanda ziyaretçiler için en uygun görünen görselleri de sunar.
9. H-kodu
Şablon yenidir, ancak kendini çoktan kanıtlamıştır. 8 temaya (çok sayfalı, açılış, kurumsal, portföy, blog, e-ticaret, taslaklar), her biri 3-12 dış görünüme sahiptir. Güzelliğe ve düzenliliğe ek olarak, bu şablon sadece farklı widget ve öğelerden oluşan bir cephaneliğe sahiptir. İnişinizin güzel ve işlevsel görünmesini sağlayabilirsiniz. Kaydırıcıya mı ihtiyacınız var? Lütfen. Portföy, incelemeler, faydalar gösterilsin mi? Ve budur.
10. Yerli
Native, bir girişimi teşvik etmek için güçlü bir araçtır. Tema tabanlı WordPress açılış sayfası şablonları, sitenin anlamsal blokları arasında hareket etmek için çeşitli paralaks efektleri kullanır. Genişletilmiş belgeler ve eğitim videoları, acemi CMS kullanıcılarının yönetim panelinin işlevselliğini hızla anlamasına yardımcı olacaktır. Visual Composer, Layer Slider ve Slider Revolution eklentileri, şablona ücretsiz bir uygulama olarak gelir.
11. göze çarpan
Salient, duyarlı bir tasarıma sahip çok yönlü bir temadır ve popüler bir seçimdir. Kaydırma üzerindeki birinci sınıf tipografi ve paralaks efektleri, açılış sayfası deneyimini geliştirmeye yardımcı olur. Kare hızı optimizasyonu, içerik blokları arasında sorunsuz animasyon geçişleri sağlar. Şablon, hızlı sayfa yüklemeye ve trafik tasarrufuna katkıda bulunan uyarlanabilir görüntü boyutlarını kullanır.
12. Mücevher
TheGem, yaratıcı projeler için SEO için optimize edilmiş ve duyarlı bir düzen ile tamamlanan modern bir temadır. Sayfaların düşük ağırlığı, yüklenme hızları ve iyi düşünülmüş UX, şablonun yüksek performansını garanti eder. Bir açılış sayfası kullanarak işletmenizi tanıtmanız gerekiyorsa, en azından Google arama sonuçlarında yüksek konumlar sağlayacak seo dostu kodu nedeniyle bu şablonu satın almaya değer. Açılış sayfalarının mevcut 11 demo versiyonu, çeşitli projelerin ihtiyaçlarını dikkate alır.
TheGem'deki site için tasarım öğeleri, Visual Composer eklentisi kullanılarak yapılandırılır. Açılış sayfası bloklarında (portföy, incelemeler, hizmetler) büyük miktarda içeriğin görüntülenmesi, yükleme - otomatik veya "düğme ile" ve ayrıca sekmeler arasında geçiş yapmak için bir kaydırıcı aracılığıyla düzenlenir. Şablon, açılış sayfasının içeriğini kaydırırken görünen bölüm bileşenlerini yüklemek için 6 animasyon seçeneği sunar. İçerik bloklarının arka planı, vimeo ve youtube'dan videolar olabilir veya html5 kullanılarak sitenin dosya sisteminden alınabilir.
13. Pazarlama Uzmanı
Marketing Pro, dönüşüm, pazarlama ve seo düşünülerek tasarlanmış bir şablondur. Üzerindeki 9 demo sitesinin her biri, belirli bir pazarlama nişinin özellikleri göz önünde bulundurularak oluşturulmuştur. Duyarlı açılış sayfası tasarımına bir bonus, etkinlik düzenleme blokları için stilize şablonlardır.
Oshine, en çok satan yaratıcı temalardan biridir. Harika bir tasarıma ve güçlü işlevselliğe sahip bu şablon, yaratıcı projeler ve iş için açılış sayfaları oluşturmak için kullanılabilir. Her biri mükemmel sonuçları elde etmenize yardımcı olmak için özenle hazırlanmış elli özelleştirme modülü. "Geri al / yinele" seçeneği ve belirli eylemleri "kısayol tuşlarına" ayarlama yeteneği, yapılandırma sürecini basitleştirir.
15. Cehennem
Jevelin, açılış sayfası ve tek sayfalık wordpress siteleri oluşturmayı kolaylaştıran birinci sınıf bir duyarlı tasarım şablonu. Konu, projenin kısa sürede başlatılmasına yardımcı olacaktır. Çeşitli özelleştirme araçları sayesinde - farklı düzenlerde 9 başlık seçeneği, her biri ayrı ayrı şekillendirilebilen 40 benzersiz öğe, sosyal ağlarda yeniden gönderileri düzenlemek için yerleşik işlevsellik, portföy bölümü için 6 stil çözümü - görünümleri özelleştirme her zamankinden daha hızlı...
16. Kalyum
Kalium, çeşitli profesyonel alanların temsilcilerinin hizmetlerini tanıtacak bir web sitesi almak için başvurdukları bir konudur. Kalium site tasarımında tipografiye özel bir vurgu yapılır - bundan yazı tiplerini yönetmek için özel bir kitaplık sorumludur. Şablon 4000 yazı tipi kullanabilir - Google, Typekit, Font Squirrel, premium ve özel (kullanıcı tarafından yüklenir).
17. Gelen
Gelen; uygulamalar, e-kitaplar, video kursları ve benzer ürünler için tek sayfalık siteler oluşturmayı kolaylaştıran bir şablondur. Tasarım özelleştirmesi, açılış sayfalarının Açılış Sayfası Oluşturucu görsel oluşturucusu kullanılarak yapılır. Şablon ayrıca, tanıtılan her ürüne bir site içinde açılış sayfası biçiminde bir mini bölüm tahsis edilmesine olanak tanır ve WooCommerce'deki ürün kategorisi bölümleri için kullanılabilir.
18. Bozulmamış
Intact, internet iş ihtiyaçlarınızı çözmenize yardımcı olmak için tasarlanmış çok seçenekli bir temadır. Modern bir açılış sayfasının şu önemli bileşenlerini içerir: "Tarife planları" ve "Şirket çalışanları" blokları, incelemeleri olan bir kaydırıcı, tematik simge kümeleri, abonelik formları, çevrimiçi danışman.
19. Kuyruklu yıldız
Comet, Visual Composer ve için tamamen duyarlı piksel mükemmel bir şablondur. Kullanıcılara, aşağıdaki efektlerin uygulandığı açılış sayfaları için 5 dış görünüm sunulur: metin için kaydırıcı, paralaks, arka plan videosu - youtube'dan içe aktarılır veya html5'e gömülür, hareketli yakınlaştırma kaydırıcısı. Yeni kullanıcılar, wordpress açılış sayfaları oluştururken tema ayarlarını kolayca bulabilir - talimatlar ve video eğitimleri çevrimiçi olarak mevcuttur.
20. Öncü Motor
Bir açılış sayfası oluşturmak için ihtiyacınız olan her şeye sahip çok yönlü bir WordPress teması:
- Herhangi bir sırayla bir şablona "montaj" için 200 blok;
- herhangi bir aşamada uyarlanabilirlik;
- Tamamen tasarlanmış 35 sayfa - metin ve fotoğrafları kolayca değiştirebilirsiniz;
- hızlı indirme hızı - ortalamadan %94 daha hızlı.
Geliştirme tasarımı satın almadan önce değerlendirilebilir. Görsel düzenleyicide renk şemaları ve ayarlar değiştirilir. Yazarlar her zaman destek sözü verirler.
Geliştirici, inşaattan veterinerlik hizmetlerine kadar farklı konularda bir web sitesi şablonu sunar. Basit ve etkili açılış sayfaları, avantajlarınızı, çalışma koşullarınızı ve diğer gerekli ayrıntıları potansiyel müşterilere iletmenize yardımcı olacaktır. Tasarım duyarlı ve Retina monitörlerden mobil cihazlara kadar tüm cihazlarda iyi görünüyor. Portföy, çalışma saatleri, takvim ve özel simgeler için eklentiler var.
22. İnkübatör
Yazarlar, geliştirmeleri hakkında “Yeni başlayanlar için ideal bir tema” diyor. 2019'un hafif minimalist tasarımı, çevrimiçi mağazalar, etkinlik ajansları ve bir kartvizit veya daha büyük bir projeye daha fazla geliştirme için diğer birçok iş türü için uygundur. Dahil:
- görsel tasarımcı - ayrıntılar çevrimiçi olarak değişir;
- mobil uyarlanabilirlik;
- WooCommerce en iyi çevrimiçi mağaza teması eklentisidir;
- herhangi bir dil için destek.
23. Phlox Pro
Yalnızca istediğiniz metni değiştirebileceğiniz otuz demo içeren çoklu şablon şablonu. Ayrıca kaydırıcılar ve efektler için 90'dan fazla şablon, ayrı sayfalar için 130'dan fazla seçenek sunarlar. Bir kartvizit sitesini veya daha büyük bir kaynağı tanıtmak için kullanışlı olacak 9 temel eklenti dahildir. Tüm bunlar indirimli, şimdi 30 dolara satılıyor. En popüler açılış sayfası şablonlarından biri.
24. Porto
Açılış sayfaları ve kartvizitler için başka bir çoklu şablon tasarımcısı. Programlama öğrenmeye gerek kalmadan üstbilgi ve altbilgi seçimi için sonsuz sayıda seçenekle temiz kod. "Grid" eklentisi sayesinde öğeleri kolayca değiştirilebilen birçok tasarım. Gelişmiş arama ile tek sayfalık bir mağazadan tam teşekküllü bir mağazaya kolayca dönüştürün. Destek her zaman soruları yanıtlamaya hazırdır.
İlginizi çekebilir:
25. XTRA
Aşağıdakilerden farklı olan, iniş için ucuz ve popüler çoklu şablon:
- profesyonel tasarım boşlukları - sadece 55 adet;
- optimizasyon nedeniyle hızlı yanıt;
- sürükle ve bırak yöntemini kullanarak ayarlama;
- 200'den fazla içerik bloğu;
- 1000'den fazla seçenek.
Herhangi bir konuda profesyonel siteler, bir tıklama ile kolayca yükleyebilir ve kullanabilirsiniz. "Sıkıcı" olmayan, taze ve güzel görünen modern tasarımlar.
26. Cad
"Yeni nesil çoklu şablon" cesur bir ifadedir, ancak yazarlar ürünleri hakkında böyle söylüyor. Sadece 35 $ karşılığında şunları alabilirsiniz:
- Güzel bir "Avrupa" tasarımına sahip 200 açılış sayfası;
- WooCommerce ve gelişmiş sipariş formları;
- bir dakika içinde kurulum;
- portföy ayarları, kaydırıcılar.
Elementor görsel düzenleyici eklentisi gerçekten en son sürüme güncellendi ve kullanımı çok kolay.
27. Gemi
"9500 arasında en iyisi" - geliştiricilere dikkat edin. Şablon, hiç kodlama yapmamış kişilere odaklanır. Tasarımın özelleştirilmesi, bire bir modda çalışmanıza, üçüncü taraf ayarları kullanmamanıza ve 300 şablondan birinin tam çalışma işlevselliğini hemen kullanmanıza izin veren görsel eklenti yapıcı Elementor kullanılarak gerçekleştirilir. . Kurulumu kolay ve hızlı.
28. Amedeo
Alışılmadık bir renk düzeninde güzel tasarım. Vurgu sadece zarif tasarıma değil, bir sette satın alınması önerildi:
- bir çevrimiçi mağaza için WooCommerce eklentisi;
- gelişmiş iletişim formları için eklenti;
- farklı tarzlarda kaydırma efektleri seçimi;
- bir dizi animasyon.
Kartvizitler ve çevrimiçi alışveriş için temiz ve anlaşılır WordPress şablonu. Mağaza modunda, ürün özellikleri için ayarlar vardır, bunlara göre arama yapın.
29. Bolge
Modern, şık, düz bir tarzda sevimli açılış sayfalarından oluşan bir seçki. Elle çizilmiş öğeler, potansiyel müşterilerin öne çıkmasına ve hatırlanmasına yardımcı olacaktır. Fiyata, görsel bir düzenleyiciden bir arka plan veya portföy yerleştirmek için bir paralaks etkisine kadar ana eklentiler ve widget'lar dahildir. Masaüstü ve mobil sürümlerde farklı bir görünüm özelleştirebilirsiniz, uyarlanabilirlik varsayılan olarak verilmiştir.
30. Makoto
Tasarımcılar, fotoğrafçılar, sanatçılar için çeşitli çözümler. Portföy yerleşimi için faydalı ön ayarlar, kopyalamaya karşı koruma sağlamanıza, kullanıcı göz atarken yüklemenize ve bu da yükleme süresinden tasarruf etmenize olanak tanır. Kolay video indirme. Blog yazmak için bir seçenek var. Infographics yerleştirmek için öğeler hazırlanır. Görsel tasarımcı, tüm ayrıntıları kolayca özelleştirmenize yardımcı olacaktır.
32. Peyzaj
Geliştiriciler, peyzaj hizmetleri, bahçe yardımı ve eko-temalar için ilginç bir "yeşil" tasarım yaptılar. Ancak, boşluk başka amaçlar için kullanılabilir. Güzel simgeler, temiz Google yazı tipleri, mükemmel yanıt hızı ve Retina cihazlarda da dahil olmak üzere görünüm, WordPress temasının yaygın olarak kullanıldığını gösterir.
33. Kalabalık Mermer
WordPress'in en son sürümü için yapılmıştır. Şablon sürekli güncellenmektedir. Çevrimiçi mağazanın işlevselliği, gelişmiş arama ve sipariş için uygun eklenti sayesinde sağlanır. Ayrıca etkinlikler, takvim tarihleri ve kayıt için ön ayarlar vardır. Elementor tarafından yeni sayfalar oluşturmak için kullanılır. Herhangi bir ek eklentiyi destekler.
34. İnanç
Yaratıcı "müzikal" tema, parlak tasarımıyla ziyaretçiler tarafından hatırlanacak ve site sahibi şunlarla ilgilenecek:
- açılış sayfası ve iç sayfalar için gelişmeler - kaynağın geliştirilmesi için sınırsız bir fırsat;
- tek tıklamayla kurulum;
- WYSIWYG'yi kurmak;
- müzik, video, kaydırıcı efektleri ekleme yeteneği.
Özenle hazırlanmış bu Bootstrap tabanlı ücretsiz HTML açılış sayfası şablonları listesinde harika, hayranlık uyandıran ve yaratıcı ürünlerden bazılarını bulacaksınız. Modern web teknolojisinin genişlemesi nedeniyle bu temalar, geliştirme sürecinizi daha hızlı, daha rahat ve son derece faydalı hale getirir.
Satış ve kullanıcı etkileşimlerinin yalnızca açılış sayfalarına çok fazla bağlı olduğunu bildiğiniz için, yalnızca en iyi dereceli şablonları seçmelisiniz. Bu nedenle, bu derlenmiş liste, daha az çabayla gösterişli, çekici ve mobil cihazlar için optimize edilmiş bir web sitesi oluşturmak isteyen kullanıcılara yardımcı olacaktır.
Mükemmel web siteleri oluşturmak için çevrimiçi olarak sınırsız sayıda kaynak mevcuttur. Yalnızca en iyi ücretsiz HTML açılış sayfası şablonlarını topladık. Okumaya başlayın ve muhteşemliğin tadını çıkarın.
titan
İşte Titan, birden fazla demo ve yüzlerce HTML dosyası içeren üst düzey, çok amaçlı, ücretsiz bir web sitesi şablonu. Maceraları seven insanlar için üretildi çünkü Titan, içinde çok fazla eğlence barındırıyor. Bu ücretsiz HTML şablonuyla, sayısız hazır bileşenle hayalinizdeki web sitesini oluşturabilirsiniz. Açılış demosu o kadar mükemmel ki bir sonraki promosyonunuz için onu seçebilirsiniz. Ücretsiz HTML açılış sayfası şablonları dünyasında Titan gerçekten mükemmel bir şablon. Şablonu indirelim ve istediğinizi oluşturalım.
Özellikleri:
- Eşsiz ve Zarif Tasarım
- Temiz ve yorumlanmış kod
- Duvar Düzenleri
- Çalışma İletişim Formu
- Özel Google Haritalar
- Geri sayım saati
- Blog ve Portföy
- Mağaza Düzenleri
Yeni yaş
New Age, son derece takdire şayan, gerçekten gelişmiş, mükemmel yanıt veren, en iyi ücretsiz HTML açılış sayfası şablonlarından biridir. Bu şablon, sağlam iş, tanıtım aracı ve gerçek site oluşturma için kusursuz bir seçimdir. Bootstrap açılış sayfası şablonları, kullanıcıların sitelerin dünyadaki her cihazda görünmesini sağlamak için duyarlı web siteleri sunar. Bir uygulama açılış sayfası olduğundan, web uygulamasını ve diğer ürünleri de görüntülemek için ondan yardım alınabilir. Cesur tipografi, yeni tasarım, çok sayıda renkli bölüm ve kolay özelleştirme ile öne çıkan şablonu herkes için en uygun hale getirir.
Özellikleri:
- Cesur, Renkli, Çekici
- Temiz, Semantik İşaretleme
- Özel Sabit Gezinme Menüsü
- DAHA AZ Dosya Dahil
- Özel Düğme Stili
- HTML5 / CSS Cihaz Modelleri
Yaratıcı
İyi tasarlanmış ve son derece işlevsel bir şablon, başarıya giden yolu harika bir şekilde açabilir. Ücretsiz HTML açılış sayfası şablonları gördüğümüzde, onların işlevselliğini ve güvenilirliğini de inceleriz. Bu nedenle, Creative gibi bir şablon, ücretsiz Bootstrap açılış sayfalarında büyük bir giriş yapar. Açılış siteleri ve ürün vitrini oluşturmak için tek sayfalık bir şablondur. Zengin özelliklere sahip bu tema, çoklu evren ve güçlü bir şablona ihtiyacınız olduğunu düşünüyorsanız büyümenizi artırabilir.
Özellikleri:
- Tam Duyarlı
- Modern, Yaratıcı Tasarım
- Son Derece İşlevsel
- İyi organize edilmiş şablon
- Vurgulu Efektli Görüntü Izgarası
- Işık kutusu galerisi
MobApp
MobApp, canlı bir renk şemasına sahip ücretsiz bir Bootstrap 4 açılış sayfası şablonu. Mobil veya masaüstü uygulamaları için açılış sayfaları yapmak için bu harika bir seçim. Başlangıçta, başlık bölümü metin ve ekran görüntülerini içeren en önemli kısımdır, ancak bunu istediğiniz şekilde düzenleyebilirsiniz. Her bölüm daha fazla özellik, medya ve daha fazlasını eklemek için tasarlanmıştır. Yapışkan gezinme, fareyle üzerine gelme efektleri, CTA'lar, düzgün kaydırma ve daha çekici fırsatlar şablonla birlikte sunulur. En iyi ücretsiz HTML açılış sayfası şablonlarından biridir.
Özellikleri:
- Tek Sayfa Düzeni
- Yapışkan gezinme
- Canlı renkler
- Üzerine gelindiğinde Animasyon
- atlıkarınca kaydırıcı
- Sosyal Medya Simgeleri
- Fiyatlandırma Planları
- Simgeleri temalaştır
- Tam Duyarlı
- Duyarlı Burger Menüsü
Kar
Ücretsiz HTML açılış sayfası şablonları, yeni ürünleri piyasaya sürmek ve promosyonu başlatmak için web siteleri oluşturmaya ihtiyaç duyan herkesi faydalı kılar. Birçok Bootstrap açılış sayfası arasında, Snow güzel, son derece esnek, mobil uyumlu, yeni yüzlü ve web yöneticileri için çok yönlü bir şablondur. Kullanıcı arayüzü odaklı, paralaks için optimize edilmiş, iyi belgelenmiş, tamamen ilgi çekici ve tamamen verimli bir şablon. Birden çok seçeneğe, ilgi çekici içeriğe, çekici tasarıma ve doğal cazibe merkezlerine sahip siteler oluşturmak için kullanın.
Özellikleri:
- paralaks arka plan
- Önceden yapılandırılmış Şablonlar
- E-posta Kayıt Formu
- Sosyal Medya Simgeleri
- Görsel olarak ilgi çekici
- Esnek özelleştirme
Küçük Uygulamalar
Small Apps, şaşırtıcı, sansasyonel, güçlü, estetik ve duyarlı ücretsiz bir açılış sayfası şablonu. Bootstrap 3 ve HTMl5 ile oluşturulan şablon, çok fazla çaba harcamadan iniş siteleri oluşturmanız için size eşsiz bir fırsat sunar. Kodlar temiz ve iyi organize edilmişse, arama motorları en üst sıralarda yer alan kodları tercih edecektir. Küçük Uygulamalar ile siteniz hem SEO dostu hem de mobil uyumlu olacaktır. Tasarım Bootstrap yapımı olduğu için hem daha büyük hem de daha küçük ekranlara doğal olarak uyum sağlayacaktır.
Özellikleri:
- Mobil uyumlu düzen
- CSS3 Animasyonları
- Çapraz tarayıcı desteği
- Tam genişlikte ve kutulu düzen
- Cazip İletişim Formu
- Yazı Tipi Harika Simgeler
Açılış sayfası
Ücretsiz HTML açılış sayfası şablonlarının çarpıcı özelliklerinden biri, hepsinin inanılmaz derecede işlevsel olmasıdır. Özellikle, okuduğunuz liste çok verimli, fazlasıyla çok ayetli, tamamen mobil uyumlu ve elbette tamamen dövülebilir şeylerle dolu. Teknoloji dünyasındaki sınırlamalar nedeniyle insanların teknoloji hakkında daha az farkında olduğu bir zaman vardı. Günümüzde insanoğlu, modern buluş ve keşifler sayesinde şimdiye kadarki en iyi zamanlarını yaşıyor.
Özellikleri:
- Önyükleme 4 Çerçevesi
- Yazı Tipi Harika Simgeler
- Cihaz Modelleri Mevcuttur
- Eylem çağrısı
- Sorumlu tasarım
- Sosyal Medya Düğmeleri
münhasırlık
Açılış sayfaları için ücretsiz web sitesi şablonları, sorunsuz bir web sitesi oluşturmak için bazı mükemmel seçeneklerdir. Ayrıcalık, profesyonel kullanıcılar için basit bir düzene ve güçlü seçeneklere sahiptir. Yapışkan navigasyon, kahraman başlığı, sayaçlar, Google Haritalar ve diğer birinci sınıf özellikler ile web sitenizi kolayca organize etmek için oradasınız. Bu nedenlerden dolayı, en iyi ücretsiz HTML açılış sayfası şablonlarından biridir. Üstelik entegre jQuery eklentileri ile çok daha fazlasını tamamlayabilirsiniz. Ayrıca, özellikle kodlama geçmişi olmayan kişiler için kullanımı çok kolaydır.
Özellikleri:
- Tam genişlikte Başlık
- Önyükleme 4 Şablonu
- Yapışkan üst gezinme
- Google Haritalar Entegre
- Temiz Tipografi
- Hareketli Sayaçlar
- Güzel Fiyat Tablosu
- Google yazı tipleri
- Ayrıntılı Altbilgi Alanı
Mavi Uygulama
Blue App, HTML5, CSS3 ve Bootstrap 3 tabanlı ağır, göze çarpan, muhteşem, olağanüstü, pratik ve çok kullanışlı ücretsiz bir açılış sayfası şablonudur. ziyaretçilerin ilgisini çekecek bir düzen. Ücretsiz HTML açılış sayfası şablonlarının tümü, kimliğinizi kullanmak ve sunmak için tatmin edici değildir. Sadece birkaçı talebinizi zevkle karşılayabilir. Blue App, şüphesiz ücretsiz Bootstrap açılış sayfası şablonları arasında harika bir birleşmedir.
Özellikleri:
- Tek Sayfa Şablonu
- HTML 5 ve Önyükleme 3
- paralaks arka plan
- Düzgün Kaydırma
- Güzel iletişim formu
- Ücretsiz Açılış Sayfası
Notlar
İnsanlar, web sitelerini rakipsiz ve sıra dışı hale getirmelerine yardımcı olan en uygun şablonları keşfetme yolunda ilerlemek zorundadır. Ücretsiz HTML açılış sayfası şablonları okyanusunda bunaldığınızda ve bir umut ışığı ararken listeyi oluşturduk. Göze hoş gelen tasarım, akıcı yanıt veren düzen, ilgi çekici renk şeması ve Notes'un minimal havası her kullanıcıyı memnun eder. Ürün lansmanı ve vitrin sayfası için, e-posta adreslerini toplamak ve meraklı kitleniz hakkında bilgi edinmek için şablonu kullanın.
Özellikleri:
- İyi Optimize Edilmiş Kod
- Şık Navigasyon
- Google yazı tipleri
- CSS3 Animasyonu
- Kolayca Özelleştirilebilir
- Tarayıcılar Arası Uyumluluk
Avilon
Avilon temiz, zengin özelliklere sahip ve herkes için bir açılış sayfası oluşturmak için uygun şekilde oluşturulmuştur. Ücretsiz HTML açılış sayfası şablonları listesinde Avilon, güçlü ve güçlü bir duruş sergiliyor. Kusursuz tasarım ve güçlü seçeneklerle, geliştirici veya geliştirici olmayanlar, tanıtımları için rahatça bir web sitesi oluşturabilir. Bootstrap 4 ile yapılan Avilon, işinizi bir sonraki seviyeye taşımaya hazır. Ayrıca, kullanıcılar Font Awesome simgelerinden faydalanabilir. Google Yazı Tipleri ve degrade efekti içerdiğinden bahsetmiyorum bile.
Özellikleri:
- Tek Sayfa Düzeni
- Paralaks Etkisi
- Yapışkan üst gezinme
- Renk Düzeninde Gradyan
- Sosyal Medya Bağlantıları
- kaydırma animasyonu
- Işık kutusu galerisi
- Yazı TipiMüthiş Simgeler
- Fareyle üzerine gelindiğinde yakınlaştırma
- akordeonlar
- Çok Seviyeli Açılır Aşağı
- Özel Liste Öğesi
Lucy
Lucy, kullanıcıların hem yaratıcı hem de yaratıcı olmalarına rağmen geride kaldıkları yolda onlara yardımcı olan en yüksek kaliteli özelliklerin tümüne sahiptir. Aynı zamanda parıldayan, şaşırtıcı, hızlı tempolu, kullanıcı dostu, dikkat çekici ve yenilikçidir. Sadece bu tema temiz ve basit bir tasarıma sahip olmakla kalmaz, aynı zamanda kullanıcıların istediği gibi siteler oluşturmanın gerçekten kolay bir yolunu gösterir. Eşzamanlı tasarım kurallarını uygulayan bu site şablonu, ücretsiz HTML açılış sayfası şablonlarının örnek bir düzenlemesidir.
Özellikleri:
Kıvrılmış
Hedef kitlenizi sunduğunuz hizmeti / ürünü indirmeye veya satın almaya ikna etmek, kesinlikle bir açılış sayfasının en önemli amacıdır. Ücretsiz HTML açılış sayfası şablonları hakkında bu blogun oluşturulması, işleri doğru yaptığınızdan emin olmaktır. Görünüşe göre, başarının zirvesine ulaşmak isteyen girişimciler, doğru şablonu bulmak için zamanlarını boşa harcamak istemeyebilirler. Mükemmel temayı seçmenin önemini göz ardı etmenin bir yolu yok çünkü o olmadan potansiyel müşterilerinizi kaybedeceksiniz.
Özellikleri:
- Eşsiz, Modern ve İlgi Çekici
- Kullanımı Kolay Şablon
- Duyarlı Düzen
- Son teknoloji
- Açılış Sayfası için En İyisi
- E-posta Listesi Oluşturma Aracı
Uygulama Açılışı
Hatta bazen güzel ve verimli şablonu bulmaktan yoruluyoruz, böylece kullanıcılar iniş siteleri yapma çabasında herhangi bir karmaşıklıkla yüzleşmek zorunda kalmıyorlar. Burada, yalnızca size kolaylık olması için en üst düzey ve duyarlı ücretsiz HTML açılış sayfası şablonlarından bazılarını derledik. Çevrimiçi reklamcılık, gerçek dünyadan tamamen farklıdır. Burada, kullanıcıların işlem yapılabilir düğmelere tıklama eğiliminde olması için içeriğinizi sunmanız gerekir. App Landing gibi özel bir şablonun bu işi en uygun şekilde yapabileceğinden bahsetmiyorum bile.
Özellikleri:
- Zarif ve Minimal
- Dokunmatik Dostu Tasarım
- SEO Odaklı İşaretleme
- Kullanıcıyı Etkileyen Öğeler
- Kazançlı Renk Düzeni
- İndirmesi Ücretsiz
iniş sıfır
Landing Zero, birinci sınıf, büyüleyici, etkileyici bir şekilde oluşturulmuş, inanılmaz derecede mobil uyumlu ve indirmesi ücretsiz bir açılış sayfası şablonu. Tam genişlikte bir video arka planı, mobil için optimize edilmiş düzen, kolay özelleştirme olanağı, e-posta abonelik formu ve iyi cilalanmış bir tasarıma sahiptir. Bu Bootstrap tabanlı şablonla web yöneticileri, ürünlerinizle daha fazla müşteriyi etkileşime geçirmek için nişe özel bir açılış sayfası oluşturabilir. Çok fazla zaman ve para harcamadan Landing Zero, çabalarınızı kolay ve rahat hale getirmenize yardımcı olur. Bootstrap çerçevesiyle birleşen yeni tasarım, bu şablon, ücretsiz HTML açılış sayfası şablonlarına büyük bir ektir.
Özellikleri:
- Temiz Duyarlı Tasarım
- Tam Ekran Görüntü
- Video Arka Planı
- İyonik Yazı Tipi Simgeleri
- Düzgün Kaydırma
- Harika galeri
AKAD
Fikrinize uyan ve her ikisine de ihtiyaç duyan ücretsiz HTML açılış sayfası şablonları bulmak için muhtemelen birçok sorunla karşılaştınız. Ancak binlerce ücretsiz şablon kafanızı karıştırabilir ve iyiyi kötüden ayırt etme duygunuzu engelleyebilir. Bu çaba hiç bu kadar kolay olmamıştı. Emin olabilirsiniz. İnsanların zihninde yer edinecek etkileyici bir hamle yapabilmeniz için size yardımcı olmak tek görevimiz. AKAD'ı gelişmişlik ve mükemmellik örneği olarak alın. Her tutkulu insan için izlemesi kolay yolu çizen iyi hazırlanmış bir web şablonu. Ayrıca daha az eforla daha çok iş yapmak için modern özelliklere sahiptir.
Özellikleri:
Arka bahçe
Backyard'ı bir açılış sayfası oluşturmak için denemeden önce, son derece işlevsel bir web şablonunun nasıl göründüğünü gerçekten bilmiyorsunuz. Ve önceden derin kodlama bilginiz olmadığında nasıl çalıştığını. Bu güçlü açılış sayfası şablonu, site oluşturmayı daha kolay ve daha rahat hale getirdi. Bildiğiniz gibi, siteyi farklı ekran boyutlarında iyi bir şekilde uyarlamak da aynı derecede önemlidir. Ancak Backyard, en son web teknolojileri üzerine kurulmuştur ve bu nedenle kullanıcılarınız için daha fazla işlevsellik sunabilirsiniz. Renk varyasyonları, çoklu başlık stilleri, temiz işaretleme, paralaks optimizasyonu ve yanıt verme, tümü etkileyici ve göz alıcı bir web sitesi içindir.
Özellikleri:
- Paralaks Arka Planları
- Fiyatlandırma Tablosu Dahil
- %100 Duyarlı Şablon
- Çoklu Düzenler ve Renk şemaları
- Aktif İletişim Formu
- Mailchimp Şirketi
ak balıkçıl
Bir dizi ücretsiz HTML açılış sayfası şablonunda, Egret rakipsiz ve emsalsiz bir katılımdır, buna hiç şüphe yok. Birçok şablonu birkaç titiz kriterle inceledikten sonra, bu son maddelere karar verdik. Sonuçta çöpe harcayacak vaktin yok. Ve rahat çalışma çabanıza değer veriyoruz. Ürün açılış sayfaları için, Ak balıkçıl, acınızı hafifletebilecek ve sizi şaşırtmacalardan kurtarabilecek takdire şayan bir sayfadır.
Özellikleri:
- Süper Kaliteli Tasarım
- Ajax İletişim Formu
- Farklı Renk Şemaları
- Kolay ve Kullanışlı
- Posta Çipi Desteği
- Ücretsiz Açılış Sayfası
Land.io
Bu akıllara durgunluk veren şablona göz atın ve anında açılış sayfaları oluşturmaya başlayın. Land.io, ücretsiz HTML açılış sayfası şablonlarından oluşan mükemmel bir bileşimdir. Dikkatli ve samimi bir çabayla hazırlanmış bir şablon, kullanıcının talebini tam anlamıyla karşılayabilir. Performans ve işlevsellik o kadar şaşırtıcı ki, onu sevmelisiniz ve böylece ziyaretçiler sitenizi ziyaret ederken de memnun kalacaklar. Bootstrap 4, HTMl5, Saas, video bölümü, YouTube gömme ve iyi yorumlanmış kod gibi birçok özellik size ekstra bir yol kat etmenizi sağlayacaktır. Ancak, ücretsiz Bootstrap açılış sayfası indirmek için Land.io'yu edinin.
Özellikleri:
- %100 Duyarlı Tasarım
- Basit, Hızlı ve Güvenilir
- Fiyatlandırma Bölümleri
- Video Bölümü Mevcut
- CSS 3 ve HTML 5
- Kolay ve sağlam
Plüton
Pluto, yaratıcı bir şekilde tasarlanmış, harika bir şekilde yanıt veren, gerçekten işlevsel, inanılmaz şekilde dövülebilir ve bahsetmiyorum bile, tamamen ücretsiz bir açılış sayfası şablonu. Ayrıca, bu şablon, platformları ve ekran boyutları ne olursa olsun, birden fazla cihazda harika bir şekilde çalışır. Ücretsiz HTML açılış sayfası şablonları arasında Pluto, bir açılış sayfası aracılığıyla vizyonunuzu göstermek için doğru araçtır. Tabii ki, ücretsizdir ve hiç karmaşık olmadığı için herkes kullanabilir.
Özellikleri:
- Temiz, Malzeme Tasarımı
- Modern Web Teknolojisi
- Mobil Uyumlu Çerçeve
- Özelleştirmesi kolay
- Ücretsiz Açılış Sayfası
- HTML5, CSS3, Önyükleme3
Yaratıcı Bölge
CreativeZone, bir dijital ajans, sanat stüdyosu, başlangıç, tasarım firması ve iş sitesi için harika bir site şablonu. Açılış sayfası şablonları oluşturmak, hayal gücünüzü gerçek tuval üzerine çizmek istediğinizde çabanızı büyük ölçüde destekleyecektir. Çağdaş tasarım trendleri ve güzel düzenler, mücadelenizi acısız ve konforlu hale getirmek için var. Gerçek odağınızı iş fikrine verin ve CreativeZone gibi gerçek bir mücevherle onları öne çıkarın. Projeyi kesinlikle hiçbir komplikasyon ve daha fazla fayda olmadan gerçekleştireceksiniz.
Özellikleri:
- Tek Sayfa Şablonu
- Duyarlı Düzen
- Arka Plan Videosu
- Paralaks Etkisi
- Retina için hazır Galeri
- Geçerli İşaretleme
Hava
Air, sağlam, şaşırtıcı, çekici ve zarif olduğundan, bunu ücretsiz HTML açılış sayfası şablonları listesine ekledik. Gerçekten de yüksek kaliteli ve üstün bir şablon. Doğru tasarımı bulamadıysanız, Air nihai gereksiniminiz için orada. Tamamen duyarlı bir düzen ve işlevsel olarak verimli Bootstrap teması, verimliliği hemen kaputun altında artırabilir. Ayrıca Air, diğer ücretsiz açılış sayfalarında sınırlı olan özellikleri içerir.
Özellikleri:
- Şaşırtıcı Tasarım
- Mobil Ekranlara Uyarlanabilir
- Güzel renk tonu
- Pürüzsüz Animasyon
- Flex kaydırıcı ile kaydırma
- Tuval Dışı Menü
dağ kralı
Daha önce sorunsuz bir açılış sayfası oluşturabildiniz mi? Değilse lütfen Mountain King'i deneyin. En azından korkusuz deneyiminizi garanti edebiliriz. Aslında, ücretsiz HTML açılış sayfası şablonları arasında göze çarpan bir eklentidir. Vahşi hayal gücünde bile, Mountain King'in sağladığı bu kadar özgürlüğün tadını çıkaramazsın. Sürüş sırasında esnekliği seven tutkulu web yöneticileri için kesin bir seçimdir. Minimal tasarım, ücretsiz vektör simgeleri, tuval dışı menü, güzel düzen - her şey orada, sadece sizin için.
Özellikleri:
- duvar galerisi
- CSS3 Animasyonları
- Duyarlı Tuval Dışı Menü
- Temiz ve yorumlanmış kod
- Ücretsiz Vektör Simgeleri
- duvar galerisi
iniş sumo
İnsanları harika yapan nedir? Elbette yaptıkları işler; dikkat çekici, özgün ve yaratıcı bir çalışma. Bu tür oluşturmayı göstermek için yardım için bazı araçlara ihtiyacınız var. Landing Sumo, premium bir ürün olmasına rağmen ücretsiz bir sürümü de mevcuttur, şaşırtıcı, bol, sağlam, zarif ve büyüleyici bir şablondur. Sumo'nun akıcı animasyonu ve renk şeması, dikkat etmeniz gereken bazı çekici konulardır. Başka bir deyişle, ücretsiz HTML açılış sayfası şablonları içinde, Landing Sumo karşı konulmaz bir icattır.
Özellikleri:
- Harika renk kombinasyonu
- nefes kesen tasarım
- Taze ve temiz
- Dokunmatik Ekran Dostu
- Temiz yorumlu işaretleme
- Ücretsiz Sürüm Mevcut
Aktif Kutu
Temiz ancak sağlam, minimal ancak çekici bir şablon arıyorsanız, ActiveBox'tan başka hiçbir yere bakmamalısınız. Ayrıca, daha iyi kullanılabilirlik ve gerçek işlevsellik için bu temayı hiç şüphesiz seçin. Her şeyden önce, ücretsiz HTML açılış sayfası şablonları, kullanıcıları etkili web siteleri oluşturmak için daha da güçlü kılan bazı harika özelliklere sahiptir.
Özellikleri:
- Süper Havalı Tasarım
- Temiz ve güçlü
- Çok Amaçlı Şablon
- Her Ekrana Ayarlanabilir
- Özelleştirmesi kolay
- Etkileyici Kalite
sedna
Sedna, site oluşturma konusunda size muazzam bir esneklik sağlayan harika bir şekilde oluşturulmuş, duyarlı ücretsiz HTML5 tek sayfalık bir şablondur. Bu özenle oluşturulmuş ücretsiz HTML açılış sayfası şablonları listesi, bazı harika ürünler biriktirdi. Sadece Sedna ücretsiz bir şablon değil, aynı zamanda düzenlemesi de kolay. Sedna, genellikle ücretsiz öğelerde bulunmayan özellikleri size verecektir.
Özellikleri:
çatal
Yüksek kaliteli kalite için Forkio, cesur duruşunu ücretsiz HTML açılış sayfası şablonları arasında gösteriyor. Sizinle çarpıcı, göz alıcı ve akıllara durgunluk veren bir şablonu paylaşmaktan mutluluk duyuyoruz. Sitelerinizi ziyaretçileriniz için unutulmaz kılacak çok sayıda çekici özellik içeren tek sayfalık bir şablondur. Ve Forkio, boyutlarına veya türlerine bakılmaksızın herhangi bir projeye göre ayarlanabilir.
Özellikleri:
- Tek Sayfa Şablonu
- Bootstrap ile Oluşturuldu
- Minimal Tasarım
- Sezgisel Düzen
- Mobil Cihazlar için Duyarlı
- Mevcut Ücretsiz
Sonunda
Ücretsiz HTML açılış sayfası şablonları, web siteleri oluştururken hızlı ve verimli olmanın ıstırabını hafifletecektir. HTML5 ve CSS3 ile yapılmış tüm yüksek kaliteli ücretsiz Bootstrap açılış sayfası şablonlarını almak için bu listeyi kullanın. Daha fazlası için sitemizi ziyaret edin.
» Ücretsiz Açılış Sayfası WordPress Temaları - TOP 30
Ücretsiz Açılış Sayfası WordPress Temaları - TOP 30
Bu makale, sizin için doğru olabilecek en iyi açılış WordPress şablonlarına bir göz atacaktır. Hepsi bir ekran görüntüsü ve tasarımın bir demosunu içerecektir, böylece temayı değerlendirebilir ve beğenirseniz hemen indirebilirsiniz.
Çok sık, WordPress için iniş şablonları bir ücret karşılığında dağıtılır, ancak sizin için topladım en iyi ve ücretsiz aramanızı kolaylaştırmak için bu makalede.
Ayrıca ilginizi çekebilir
Hosting arayanlar için
1.
Web sitenizi zahmetsizce oluşturmanıza yardımcı olacak tek sayfalık bir temadır. Öte yandan, profesyonelce çizilmiş bir tasarıma sahip, bu temaya "güzel" dememizi sağlayan paralaks kaydırma. Bu şablon, yeni başlayanlar ve küçük işletmeler için uygundur.
2.
Çok işlevli bir WordPress temasıdır. Canlı bir arayüz, klasik paralaks efekti ve temayı izlemeyi daha da keyifli hale getiren diğer animasyonları içerir. Zerif Lite, kod açısından da iyi yazılmış bir tarayıcılar arası temadır.
3. Alhena Lite
Alhena Lite, çevrimiçi mağazanızı kolayca özelleştirebilmeniz için WooCommerce eklentisiyle tamamen entegre olan ücretsiz bir kurumsal WordPress temasıdır.
4.
Tamamen duyarlı olan ve kolay web sitesi oluşturma için birçok popüler özelliği içeren temiz, basit bir iş temasıdır.
5. Palmalar
Palmas, kişisel veya moda blogları için uygun modern, açık renkli bir temadır. Bu şablon ayrıca Yoast SEO, GravityForms, Pirate Forms, W3 Total Cache ve daha pek çok eklentiyi de destekler.
6. Birahane
Brasserie, bir restoran, kafe veya yemek sitesi için mükemmel olan basit bir WordPress temasıdır. Animasyon efektlerinin yanı sıra çok sayıda işlevsellik içerir.
7.XT Kurumsal lite
XT Corporate lite, küçük bir ürün veya hizmete uyan basit ve minimalist bir temadır.
8.
- bu açık renklerde yapılmış hoş bir temadır. Çeşitli animasyonlar ve görsel olarak hoş geçişler ve paralaks efekti içerir. Ek olarak, Freesia Empire, Breadcrumb NavXT, WP-PageNavi, Contact Form 7, Jetpack by WordPress.com, Polylang, Newsletter, bbPress ve WooCommerce gibi eklentileri destekler.
9.
- Küçük veya orta ölçekli işletmelerin sunumları için uygun bir konudur. İniş yapısının eksiksiz yönetimi için çok sayıda özellik ve eklenti içerir.
10.
Çok fazla işlevselliğe sahip çok yönlü bir konudur. Duyarlıdır, tüm öğeler paralaks efektiyle canlandırılmıştır. Bir sayfa kolayca özelleştirilebilir ve bu nedenle değiştirilenleri gerçek zamanlı olarak izlemenizi sağlar. Mevcut açılış teması ayrıca çok sayıda temel WordPress eklentisini de destekliyor.
11. FotoGrafik
FotoGraphy, fotoğrafçılar veya tasarımcılar için uygun bir açılış sayfasıdır. Sadeliği ve çok sayıda özelliği, onu daha da ölçeklenebilir ve özelleştirilebilir hale getirir.
12. İntegral Tema
İntegral Tema, reklam öğeleri, işletme sahipleri veya aracılar için uygun tek sayfalık bir paralaks temasıdır. Ayarlamanız sadece birkaç dakikanızı alır.
13. Kare
Kare, her tür site için kullanılabilecek minimalist bir temadır. Küçük ve orta ölçekli işletmeler için en uygunudur. Square, birçok popüler WordPress eklentisi için özelleştirilmiştir ve SEO için optimize edilmiştir.
14. canlandırmak
Enliven kaliteli bir çalışma zamanı temasıdır. Kalite ve güzelliği tek bir şişede birleştirdiği için buna premium diyebilirim. Ayrıca birçok popüler eklentiyi destekler ve son derece özelleştirilebilir.
15. Latte
Latte, fotoğrafçılar için bir şablondur. Portföyünüzü yeterince gösterebilmeniz ve kendinizden bahsedebilmeniz için her şeye sahiptir. Kurulum birkaç tıklamayla gerçekleşir.
16. Pazartesi
Pazartesi, bir iş veya serbest çalışan için uygun zarif bir temadır. Yanında çok sayıda özellik ve eklentiler ve eklentiler taşır.
17. İş Dünyası
İş Dünyası, bir iş temasıyla ilgili bir şablondur. Stil ve kaliteyi birleştirir. İş dünyası, kişisel, kurumsal veya fotoğrafçının web sitesi için de özelleştirilebilir. Yetenekleri, ondan neredeyse istediğiniz her şeyi yapmanızı sağlar.
18.
- Bu, açık renklerde yapılan hoş bir temadır. Küçük ve orta ölçekli işletmelerin yanı sıra kişisel bir web sitesi için mükemmeldir. İçinde, ne istersen özelleştirebilirsin. Bu şablonu daha da iyi ve çekici kılan birçok özellik ve eklenti.
19. Tek ton
Onetone, İnternette "Ben" sunmaya uygun tek sayfalık bir WordPress şablonudur (portföyünüzü gösterin ve / veya kendinizden bahsedin).
20. Kalk
Arise, küçük bir ürün veya küçük işletme için mükemmel olan minimalist tek sayfalık bir WordPress temasıdır. İçinde gereksiz bir şey yok, sadece en önemli şeyler.
21. Yün
Woot, bir çevrimiçi mağaza işleten koyu renklerde minimalist bir şablondur. WooCommerce ve diğer birçok popüler eklenti ile çalışır.
22. Batı
West, bir ajans, küçük işletme veya portföy sitesi için uygun basit bir temadır. Çok sayıda işlev, ayar ve öğe konumu içerir.
23. Anaglif Lite
Anaglyph Lite, blog ve e-ticaret için basit ve zarif bir şablondur. WooCommerce ve diğer popüler eklentiler zaten üzerinde yapılandırılmıştır.
24.
Selamlar sevgili okurlarım. Bugün, yardımı ile artırabileceğimiz teknik noktalardan bahsedeceğiz. satış dönüşümü onların mal veya hizmetleri. Önemli noktalardan biri, ürünlerle birlikte iyi düşünülmüş bir açılış sayfasıdır. Oluşturulması hakkında daha fazla konuşacağımız ve hazır sayfa kodları alacağımız sözde açılış sayfası.
Açılış sayfası nedir? Bu, insanların genellikle bir reklamı tıkladıktan sonra geldikleri sayfadır. Tek bir teklif için oluşturuldu: bir ürün, hizmet veya abonelik. Etkili bir açılış sayfası, başarılı internet pazarlamasının temel taşıdır. Ürün piyasadaki en iyisi olabilir, reklamlar mükemmelleştirilir, ancak iyi bir açılış sayfası olmadan çabalar sonucun %100'ünü vermez. Ziyaretçilere neyin teklif edildiğini ve neden istemeleri gerektiğini söyler. Aciliyet duygusu, hızlı karar vermeye ve kullanıcının müşteri kategorisine geçişine katkıda bulunur.
Açılış Sayfası nasıl oluşturulur? Cevabın dizgi yeteneğinde yattığına inanmak yanlış. İyi bir açılış sayfası, hedefler, metin, tasarım ve kod üzerinde iyi koordine edilmiş çalışmanın sonucudur. Aşağıda örnekleri olacak olan açılış sayfaları, yeni başlayanların mizanpajla çalışmanın temellerini öğrenmelerine yardımcı olacak, ancak dönüşüm metinlerinin ve hedef kitlenin anlaşılmasının yerini almayacak. Bunları çeşitli kullanarak da oluşturabilirsiniz. inşaatçılar Açılış sayfası.
Bu nedenle, bir açılış sayfası oluşturmadan önce kendinize şunu sorun:
- Bir kişi açılış sayfasına ulaştıktan sonra ne yapacak? Bir şey alacak mı? Formu doldur? Bültene abone misiniz? Dönüşüm oranınızı izlemeden önce net hedefler belirleyin.
- Rakiplerim kimler? Aslında bunlar üç soru: kim, ne kadar başarılılar ve başarıları nasıl uygulanabilir? Taklit, en içten iltifat şeklidir. Rakipler işe yarayan şeyi yapıyorsa, bunu sitenizde tekrarlayın.
- Seyircim kim? Nişinizi ve hedef kitlenizi ne kadar iyi anlarsanız, çabalarınızın karşılığını alma şansınız o kadar artar.
İhtiyacınız olan tüm bilgileri sunmanız gerekir, ancak potansiyel bir müşteriyi bunaltmak ve uzaklaştırmak için yeterli değildir.
Açılış sayfası oluşturma örnekleri + aptallar için kodlama
İşe başlamadan önce, HTML ve CSS'ye hızlıca bir göz atalım. Nasıl çalıştıklarını anlamak, bir açılış sayfası oluşturmanıza yardımcı olacaktır.
HTML- web sitesi görselleştirmesi için tarayıcı biçimlendirme dili. İçeriği tanımlayan köşeli parantez içine alınmış etiketler kullanılarak yazılmıştır.
Etiket açılır (<>) ve dolgunun çevresini () kapatır:
<тег>içerikтег>
Nokta atışı ayarı için, isimden sonra aşağıdaki nitelikler eklenir:
<тег атрибут="значение">içerikтег>
CSS - HTML öğelerinin nasıl düzenleneceğini tanımlar. Seçiciler, özellikler ve değerlerden oluşur:
# seçici (özellik: değer;)
Seçici, html'deki belirli bir etiketin adıyla eşleşir. Değerleri değiştirerek ve özellikler ekleyerek görünümü düzenlenir. Aynı HTML'ye farklı CSS stilleri uygulayarak farklı sayfalar oluşturabilirsiniz.
5 ilk adım
Hızlı bir düzen için, önyüklemeye dayalı minimal bir tasarıma sahip bir şablon kullanacağız. Düzeni hızlandırmak için tüm dünyada kullanılan kendi seçicileri olan bir sistemdir.
Mütevazı görünüyor.
Bu balıktan birkaç aşamada her zevke uygun bir site oluşturulur.
Klasördeki dizin yapısı:
- index.html: Bu, düzenleyeceğimiz ana dosyadır.
- / varlıklar: yardımcı dosyalar burada bulunur:
- / css: dizini, önyükleme ve simge stillerini içerir. Düzenlenecek dosya main.css'dir.
- / img: site resimleri için klasör.
- / yazı tipleri: Simge yazı tipleri.
- / js: önyükleme için javascript dosyaları.
Adım 1: Başlığı kullanma
Başlık ve alt başlıklar, teklifin değerini açıkça iletmeye yardımcı olacak kilit noktalardır.
Sitenin başlığını ve adını değiştirelim. Burada dizgi yeteneği gerekli değildir - metniniz ekranda sarı ile vurgulanan yerlere yazılır.
Adım 2. Kısalık, dönüşümün kız kardeşidir. Avantajlar ve oranlar ekleme
4 bölüm alacaktır:
- Faydalar;
- tarifeler;
- incelemeler;
- eylem çağrısı.
Gerekli bölümleri ekleyeceğimiz ana içeriğin “ana” bölümünü tasarlayalım:
…..
…..
…..
…..
Noktalar yerine dolgu ile doldurun.
Avantajlar bölümü bu kodu gerektirecektir:
Avantajlar
Hızlıca
Güvenilir
Sed diam mumyasız
karlı
Elit, sed diam nonmy
teknik olarak
Lorem ipsum dolor sit amet, conectetuer adipiscing elit, sed diam nonummy
Güvenilir
Lorem ipsum dolor sit amet, conectetuer adipiscing elit, sed diam nonummy
karlı
Lorem ipsum dolor sit amet, conectetuer adipiscing elit, sed diam nonummy
teknik olarak
Lorem ipsum dolor sit amet, conectetuer adipiscing
Güvenilir
Lorem ipsum dolor sit amet, conectetuer adipiscing
karlı
Lorem ipsum dolor sit amet, conectetuer adipiscing
Netlik için içerik:
Her ne kadar özensiz görünse de paniğe mahal yok, devam ediyoruz.
Fiyatları yazıyoruz. İçerik, ilk adımdakiyle aynı şekilde değişir. “Tarifeler” sınıfı ve üç tarife ile genel açıklama.
Lorem ipsum dolor sit amet, conectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud egzersiz ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.
tarife planları
1 numaralı tarife
$10
aylık / kişi başı
- Lorem ipsum dolor sit amet, conectetuer adipiscing elit
- lorem ipsum dolor
- 10 Bilgi ipsum
2 numaralı tarife
$20
aylık / kişi başı
- Lorem ipsum dolor sit amet, conectetuer adipiscing elit
- lorem ipsum dolor
- 10 Bilgi ipsum
Tarife numarası 3
$30
aylık / kişi başı
- Lorem ipsum dolor sit amet, conectetuer adipiscing elit
- lorem ipsum dolor
- 10 Bilgi ipsum
Öyle görünüyor.
Gelecekteki açılış sayfasının görünümüyle ilgilenmiyor olsak da, aşağıda değişen stil örneklerini ele alacağız.
3. Adım: Güven Sinyalleri ve Harekete Geçirici Mesaj
Hedeflenen sinyallerin kullanılması, ziyaretçilere markanın güvenilir olduğunu gösterir. Sinyaller farklı şekillerde olabilir, ancak klasikler müşteri incelemeleridir.
Lorem ipsum dolor sit amet, consectetur adipisicing seçkin, sed do eiusmod tempor incididunt ut emek ve dolore magna aliqua. Ut enim ad minim veniam, quis nostrud egzersiz ullamco Laboris nisi ut aliquip ex ea commodo:
Musteri degerlendirmeleri
“Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut emek ve dolore magna aliqua. Ut enim ad minim veniam, quis nostrud egzersiz ullamco Laboris nisi ut aliquip ex ea commodo. "
“Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut emek ve dolore magna aliqua. Ut enim ad minim veniam, quis nostrud egzersiz ullamco Laboris nisi ut aliquip ex ea commodo. "
Bir harekete geçirici mesaj oluşturalım.
Lorem ipsum dolor sit amet, conectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud egzersiz ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat:
Bugün sipariş verirken yararlanın
İncelemeler, potansiyel müşterilerin bir ürünü satın alma kararı vermelerine yardımcı olacaktır. Anlaşılır olması için avatarlara ihtiyacımız var, bu yüzden onları hemen her alıntının altına yazacağız.
Müşteri Adı.
4. Adım: Şebeke Entegrasyonu ve Mobil Dostu
Izgarayı enjekte etmek için Bootstrap kapsayıcılarına ihtiyacımız var. İzin verilen sütun segmentlerinin toplam sayısını hatırlamak önemlidir - 12. Sınıf, içerik ekranının genişliğini belirler. Bu hazır şebekenin avantajı, kapsayıcıların yanıt verme yeteneği göz önünde bulundurularak tasarlanması ve mobil cihazlara hemen uygulanabilir olmasıdır. Resmi web sitesinde ayrıntılı açıklama. Izgara böyle görünüyor.
“Main” in içeriğini bir kaba saracağız. Bunu yapmak için üst kısımda yazılmıştır:
Bloğun ekranın tüm genişliğine sığmasını istiyorsanız, içine kap yerleştirilir. Burada bir jambotron ve harekete geçirici mesaj olacak.
Üst üste konumlandırılması gereken tüm elemanları çizgi ayırıcılarla sarıyoruz.
Artık sütunların genişliğini, önyükleme ızgarasına odaklanarak ayarlayabiliriz. Sardıktan sonra, dolgu ekranın kenarlarına yapışmayı bıraktı, düzgün girintiler belirdi.
Col-lg-4 sütun sınıfını kullanarak fiyatları arka arkaya belirledik. Satır satırlarının içinde artık sarma için ayrı divalar yazmanıza gerek yok, bunları bir boşlukla ayrılmış mevcut divalarla birleştirebilirsiniz.
Benzetme yoluyla, incelemeler ve faydalar bölümü için sütunlar oluşturduk. Bir öğeyi yana kaydırmak istiyorsanız col-lg-offset-2 offset sütun sınıfını kullanın. Sondaki sayı, kaydırmanın kaç tane temel sütun alacağını belirler.
Adım 5. Yazı tipleri ve simgeler
Google Yazı Tipi başlıkları için yazı tipleri uygulayacağız. Seçtiğinizde, içe aktarma sekmesini açın ve buradaki verileri main.css dosyasına kopyalayın. Ayrıca, yeni yazı tipinin uygulandığı dosyaya başlık seçicileri de ekleriz.
@import "https://fonts.googleapis.com/css?family=Roboto+Condensed" / * başlıklar için yazı tipi içe aktarma * /
.navbar-marka,
h1,
h2,
h3,
h4,
h5,
h6 (
font ailesi: "Roboto Condensed", sans-serif; / * Googlephone çıkışı * /
}
Anlaşılır olması için, metin merkezi adında kendinden açıklamalı bir sınıfa ve önyükleme kümesinden FontAwesome simgelerine sahip bir sınıf kaydedilir.
Bu, hazırlığı tamamlar.
Açılış sayfası: cümle, paralaks ve sayaç içeren kod örnekleri
En popüler üç türü kullanıyoruz: teklifle, formla ve geri sayım sayacıyla. Siz yazarken, şablon efektlerle tamamlanacaktır.
Örnek 1: bir cümle ile
Ana gövde ve dolgu için arka planı ilk ekranı kaplayacak şekilde ayarlayın.
Jumbotron (
arka plan: # f5f5f5 url (../ img / fon.jpg) üst merkez tekrarsız;
maksimum genişlik: %100;
üst dolgu: 250 piksel;
alt dolgu: 200 piksel;
metin hizalama: merkez;
}
Jambotronun başını h2'den h1'e yeniden boyutlandırın. Ardından, değiştirilmesi gereken öğelerin stillerini yazıyoruz.
Simgelerle başlayalım.
faydaları ben (
renk: # cac4c4;
}
Hash işaretinden sonra bir renk belirtilir. Html-renk tabloları veya bir resim düzenleyici kullanarak seçeneğinizi belirleyebilirsiniz.
Bölüm başlıkları için girinti
bölüm h2 (
üst dolgu: 30 piksel;
kenar boşluğu-alt: 25 piksel;
}
Tarifelerin görünümünü sıraya koyuyoruz. Kolaylık sağlamak için, noktasal olarak vurgulamak istediğimiz öğeler için kendi sınıflarımızı oluşturuyoruz.
1 numaralı tarife
$ 10
aylık / kişi başı
- Lorem ipsum dolor sit amet, conectetuer adipiscing elit
- lorem ipsum dolor
- 10 Bilgi ipsum
Ve bir sürü CSS. Sitelerin sorumlu olduğu yerler yorumlarda belirtilmiştir - / * yıldız ile eğik çizgiler arasında * /
/ * ========= Tarif stilleri ======== * /
/ * tarifenin genel görünümü * /
.pricing_item (
arka plan: # f2f2f2;
pozisyon: göreceli;
ekran: -webkit-flex;
ekran: esnek;
esnek yön: sütun;
hizalama öğeleri: streç;
metin hizalama: merkez;
-webkit-flex: 0 1 330 piksel;
esnek: 0 1 330 piksel;
dolgu: 2em 3em;
kenar boşluğu: 1em;
renk: # 262b38;
imleç: varsayılan;
taşma: gizli;
}
/ * basıldığında arka planı değiştir * /
.pricing_item: üzerine gelin (
renk: # 444;
arka plan: #daebef;
}
/ * her tarifedeki fiyat etiketinin ayrı altlığı * /
.pricing_item: birinci çocuk .price (
arka plan: # 9ba9b5;
}
.pricing_item: nth-child (2) .price (
arka plan: # 1f6098;
}
/ * geniş ekranlarda, tarifenin orta sütununu doldurma ve vurgulama * /
@medya ekranı ve (min-genişlik: 66.250em) (
.pricing_item (
kenar boşluğu: 1.5em 0;
}
.özellikli (
z-endeksi: 10;
kenar boşluğu: 0;
yazı tipi boyutu: 1.15em;
}
}
/ * başlık * /
.pricing_item h3 (
yazı tipi boyutu: 2em;
kenar boşluğu: 0,5em 0 0;
renk: # 1d211f;
}
/ * etiket altlığı * /
.fiyat (
yazı tipi boyutu: 2em;
yazı tipi ağırlığı: kalın;
renk: #fff;
pozisyon: göreceli;
z-endeksi: 100;
satır yüksekliği: 95 piksel;
genişlik: 100 piksel;
yükseklik: 100 piksel;
kenar boşluğu: 1,15em otomatik 1em;
sınır yarıçapı: %50;
arka plan: # 77a5cc;
-webkit-geçiş: renk 0.3s, arka plan 0.3s;
geçiş: renk 0,3 sn, arka plan 0,3 sn;
}
/* para birimi */
.para birimi (
yazı tipi boyutu: 0,5em;
dikey hizalama: süper;
}
/ * cümle açıklaması * /
.cümle (
yazı tipi ağırlığı: kalın;
marj: 0 0 1em 0;
dolgu: 0 0 0.5em;
renk: # 2a6496;
}
/* liste */
.pricing_item ul (
yazı tipi boyutu: 0.95em;
kenar boşluğu: 0;
dolgu: 1.5em 0.5em 2.5em;
metin hizalama: sola;
}
/ * liste öğeleri * /
.pricing_item li (
dolgu: 0.15em 0;
}
/ * oran emri düğmesi * /
.pricing_item düğmesi (
yazı tipi ağırlığı: kalın;
üst kenar boşluğu: otomatik;
dolgu: 1em 2em;
renk: #fff;
sınır yarıçapı: 5 piksel;
arka plan: # 428bca;
-webkit-geçiş: arka plan rengi 0.3s;
geçiş: arka plan rengi 0,3 sn;
}
/ * düğmeye basıldığında renk değişimi * /
.pricing_item düğmesi: üzerine gelin,
.pricing_item düğmesi: odak (
arka plan rengi: # 285e8e;
}
/ * tarife geçmişi * /
.bg-2 (
arka plan: #dddddd;
}
Sonuç
Musteri degerlendirmeleri. Onlara düzgün bir görünüm verelim, yerini belirleyelim.
/ * ========= Görüş stilleri ======== * /
referanslar (
dolgu: 4em 0;
metin hizalama: merkez;
}
.testimonials .avatar resmi (
sınır yarıçapı: %50;
yüzer: sol;
ekran: satır içi;
kenar-sağ: 1em;
genişlik: 65 piksel;
yükseklik: 65 piksel;
kenar boşluğu-alt: 30 piksel;
}
.testimonials .avatar p (
metin hizalama: sola;
üst dolgu: 1em;
renk: # 5d5d5d;
yazı tipi ağırlığı: 900;
}
Son harekete geçirici mesaj ve alt bilgi, süslemek için bırakılmıştır.
/ * Eylem * /
.eylem (
arka plan: # 476177;
minimum yükseklik: 180 piksel;
genişlik: %100;
dolgu: 4em 0;
metin hizalama: merkez;
}
.eylem h2 (
renk: #fff;
yazı tipi ağırlığı: 300;
}
.eylem p (
renk: #fff;
metin gölgesi: 0 1px 2px rgba (0, 0, 0, .2);
yazı tipi boyutu: 1.2em;
}
.action .container (
kenar boşluğu: 3em;
}
/ * Altbilgi * /
altbilgi (
arka plan: # 333333;
dolgu: 1em 0;
metin hizalama: sağa;
}
altbilgi p (
renk: #fff;
satır yüksekliği: 1;
metin dönüştürme: büyük harf;
yazı tipi boyutu: 0.7em;
üst kenar boşluğu: 0,5em;
}
Altbilgi düğmesine btn-varsayılan yerleşik önyükleme sınıfı atanmıştır.
Şablonu canlandırmak. İlk ekranda metin animasyonunun yanı sıra bölümler için yumuşak kaydırma ve düğmeler tanıtacağız.
Geçişlerin çalışmasını sağlamak için, faydalar ve tarifeler için bazı bölüm sınıflarını id ile değiştireceğiz. Ve butonlara id linklerini atayacağız. Ekran - sarı bir işaretleyici ile vurgulanana ne eklenir.
Düğmeler için dolguyu ayarlayın - jbutton. Basıldığında kaydırma çalışıyor, ancak çok ani.
Javascript veya jquery kullanılarak yumuşak geçişler oluşturulur. İkincisi, varsayılan olarak Bootstrap şablonlarına bağlıdır.
Kaydırma şimdi pürüzsüz.
Animate.css kullanarak metne animasyon ekleme ( https://raw.githubusercontent.com/daneden/animate.css/master/animate.css). Bu hazır bir açık kaynaktır, herhangi bir sitede kullanılabilir. Github'daki dosyayı css klasörüne yerleştirin ve yolu yazın.
Efektleri burada seçiyoruz: https://daneden.github.io/animate.css/... fadeInDown'ı seçtik. Kodda şöyle yazılıyor:
Artık sayfa yüklenirken veya yenilenirken metin canlandırılacaktır. Hazır.
Örnek 2: şekil ve paralaks etkisi ile
Bir ziyaretçiye ne kadar çok form alanı sunulursa, onları doldurma olasılıkları o kadar az olur. Yalnızca ihtiyacınız olan minimum bilgileri isteyin.
Analoji ile toplanmıştır. Arka planları ve renkleri değiştireceğiz. Ve elbette, şekli ekleyelim.
İle başlayalım paralaks .
Jumbotron arka planını şeffaf olarak değiştirin:
arka plan: şeffaf;
Kafanın içine betiği ekleyeceğiz:
Gövdedeki ilk satır paralaks için kapsayıcıdır:
Ve CSS'de davranışı:
Bgparalaks (
arka plan: url (/../ img / fon.jpg) tekrar;
pozisyon: sabit;
genişlik: %100;
yükseklik: %300;
üst: 0;
sol: 0;
z-endeksi: -1;
}
Paralaks hazır. Ancak kodda ve yeni arka planda değişiklik yapmak, renk şemasının yeniden atanmasını gerektirir.
Menüyü karanlık yapmak:
Navbar-varsayılan (
arka plan rengi: # 333;
sınır rengi: # 444;
renk: koyu gri;
sınır yarıçapı: 0;
}
Navbar-default .navbar-nav> .active> a, .navbar-default .navbar-nav> .active> a: vurgulu, .navbar-default .navbar-nav> .active> a: odak (
renk: koyu gri;
arka plan rengi: rgba (0, 0, 0, 0,5);
}
Jumbotron'daki cümleyi yenisiyle değiştiriyoruz - form koduyla:
Açılış Sayfası, ziyaretçileri müşteriye dönüştürüyor
Merak uyandıran bir şey, augue suspendisse lorem vel diam conectetur pozuere vehicula posueret mauris araba tortor rhoncus vulputate kitle.
-
-
Lorem ipsum dolor sit amet, conectetuer adipiscing elit, sed diam nonummy.
Ve görünümü reçete ediyoruz
/ * biçim * /
.headform listesi (
liste stili türü: yok;
satır yüksekliği: 26 piksel;
yazı tipi ağırlığı: 400;
dolgu: 0 piksel;
kenar boşluğu-alt: 40 piksel;
}
.baş formu (
taşma: gizli;
pozisyon: göreceli;
arka plan rengi: rgba (0,0,0, .4);
dolgu: 35px 40px;
sınır yarıçapı: 8 piksel;
}
giriş, düğme, seç, metin alanı (
genişlik: %100;
kenar boşluğu-alt: 10 piksel;
}
.headform-list li .fa (
pozisyon: mutlak;
üst: 0 piksel;
sol: 0 piksel;
genişlik: 42 piksel;
yazı tipi boyutu: 24 piksel;
metin hizalama: merkez;
}
.headform listesi li (
pozisyon: göreceli;
minimum yükseklik: 38 piksel;
sol dolgu: 62 piksel;
kenar boşluğu-alt: 20 piksel;
}
.jumbotron p (
renk: #fff;
yazı tipi boyutu: 16 piksel;
yazı tipi stili: italik;
}
Jambotron'un metni de değişiklik talep ettiği için buraya geldi.
Tarifeleri yeniden renklendiriyoruz.
/ * tarifenin genel görünümü * /
.pricing_item (
arka plan rengi: rgba (0,0,0, .4); / * satır değişti * /
sınır yarıçapı: 4 piksel; / * satır değişti * /
pozisyon: göreceli;
ekran: -webkit-flex;
ekran: esnek;
-webkit-flex-yön: sütun;
esnek yön: sütun;
-webkit-align-items: streç;
hizalama öğeleri: streç;
metin hizalama: merkez;
-webkit-flex: 0 1 330 piksel;
esnek: 0 1 330 piksel;
dolgu: 2em 3em;
kenar boşluğu: 1em;
renk: # f2f2f2; / * satır değişti * /
imleç: varsayılan;
taşma: gizli;
kutu gölgesi: 0 0 15px rgba (0, 0, 0, 0.05);
}
/ * basıldığında arka planı değiştir * /
.pricing_item: üzerine gelin (
renk: # 444;
arka plan: #ddd; / * satır değişti * /
}
Şimdi böyle görünüyorlar - şeffaf arka plan ve yuvarlatılmış köşeler.
Şablon hazır.
Örnek 3: bir geri sayım sayacıyla
Jambotronun dolgusunu tekrar değiştirin ve şablonu, önceki şablona benzeterek yeni arka plana uyacak şekilde yeniden renklendirin. Sayaç betiğini bağlarız:
HTML
Zaman bitiyor
Lorem ipsum dolor sit amet, conectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud egzersiz ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis vero eros ve accumsan ve iusto odio dignissim qui blandit praesent luptatum zzuril dolor içinde hendrerit içinde duis autem ve eum iriure dolor
-
Lorem ipsum dolor sit amet, conectetuer adipiscing elit, sed diam nonummy.
-
Lorem ipsum dolor sit amet, conectetuer adipiscing elit, sed diam nonummy.
Stil dosyasında şeklin alt yarıçapını kaldırın ve düğmeyi değiştirin.
Ek olarak, menü yeni bir arka plan için yeniden boyandı ve jambotron'daki metinlerin stili - önceki örneğe benzer şekilde değiştirildi. Sonuç.
Alt kısım
Bu, Açılış Sayfası örneklerini tamamlar, ancak kod ek çalışma gerektirir.
Açılış sayfasının bir Ferrari gibi hızlı ve iyi olması gerekir - sayfa yükleme sürelerinin hemen çıkma oranları üzerinde büyük etkisi vardır. Maksimum verimlilik için görüntüleri optimize edin, bitmiş komut dosyalarının ve stillerin boyutunu en aza indirin.
Ders, size gerçek müşteriler getirmenize yardımcı olacak iyi açılış sayfaları oluşturmaya ilişkin örnekler sunar ve yeni bir şey öğreneceksiniz. Beğenip yeniden yayınlıyoruz. Yakında görüşürüz.
Derste sunulan tüm kaynakları hazır sayfalar şeklinde indirmek için butonlardan birine tıklayınız. sosyal kale açmak ve bir bağlantı almak için.
Saygılarımla, Galiulin Ruslan.
Taramalı Atomik Kuvvet Mikroskobu Laboratuvar raporu şunları içermelidir:
Havai iletişim ağı desteklerinin raflarının seçimi
AC katener tasarımı ve hesaplanması
Mikroişlemci sistemlerinin geliştirilmesi Mikroişlemci sistemlerinin tasarım aşamaları
mcs51 ailesinin mikrodenetleyicileri