En iyi uygulamalarınızı tazeleyin: Squarespace çok dilli site tasarımı

Yakın zamanda çok dilli Squarespace sitelerinin hayranlık uyandıran bazı örneklerini sergiledik. Bu belirli sayfaları seçmemize ne sebep oldu? Onları diğerlerinden ayıran nedir?

Lafı dolandırmayalım: bu siteler çok güzel.

Bunu daha önce de söyledik ve yine söyleyeceğiz: Squarespace şablonları estetik olarak çekici. Squarespace'in kendi ana web sitesi 2017'de bir Webby ödülü (bir online şirket için mümkün olan en yüksek başarılardan biri) kazandı ve o zamandan beri markalarını daha da güçlendirdiler.

Ana Squarespace sitesinin kendisi çok şık olduğundan, platformun kullanıcılar için site oluşturma seçeneklerinin de aynı derecede şık olması mantıklı. Özetle, Squarespace kendi kurallarına uyar.

Bir Squarespace sitesi sahibi olarak, sitenizi küreselhale getirmekle ilgileniyor olabilirsiniz ve ister kişisel bir site, ister bir e-ticaret mağazası(e-ticaret satıcılarının %70 'i sınır ötesi satış yapmanın kendileri için karlı olduğunu onaylıyor) veya işletmeniz için bir site açıyor olun, 2019 ve sonrasında bu oldukça kesin bir bahis.

Uluslararası bir adım atmaya karar verdiğinizde, site içeriğinizin dikkate almanız gereken ilk unsurlarından biri dilidir.

Squarespace sitenizi kendi dilinizde oluşturmayı çok kolay hale getiriyor. Seçtiğiniz (çok şık, çok görünüşlü) şablonu yüklüyorsunuz ve ardından tasarım panonuzdan sezgisel olarak erişilebilen yazı tiplerinden renklere, aralıklara ve ızgara seçeneklerine kadar birçok tasarım parametresiyle oynayabiliyorsunuz.

Squarespace çok dilli

Squarespace'in eksik olduğu basitleştirici bir özellik, bir web sitesi oluşturmak için yerel bir çözümdür. Squarespace çok dilli site.

Sayfalarınızı manuel olarak nasıl çoğaltacağınız ve kendiniz nasıl çevireceğiniz konusunda talimatlar veriyorlar ve bu çözüm, portföy gibi daha küçük bir siteniz varsa işe yarayabilir, ancak daha büyük bir site için işe yaramayacaktır. Ayrıca, çoğaltılmış sayfalar arama motorları tarafından tercih edilmediğinden, çok dilli SEO için de uygun bir çözüm değildir.

Çok dilli SEO en iyi uygulamaları hakkında daha fazla bilgiyi buradan edinebilirsiniz:

Aşağıdakiler gibi entegre bir çözüm kullanmak Weglotçok dilli bir Squarespace sitesi yapmak çok daha hızlı ve enerji tasarrufu sağlayan bir çözümdür.

Squarespace çok dilli tasarım

Bununla birlikte, sitenizi çevirdikten sonra, çevrilmiş sürümlerin ekranınızda görüntülenme şekli ile orijinal sürümünüzün görünümü arasında muhtemelen birkaç fark göreceksiniz.

Bu beklenen bir durumdur; farklı diller basitçe farklı görünür. Yalnızca beş harf uzunluğundaki İngilizce "shell" kelimesi Fransızcada "coquillage" - harf sayısı tam anlamıyla iki katına çıkıyor.

Çoğu basit web tasarım ortamında (örneğin, sıfırdan bir site oluşturuyorsanız), sayfanızı çevirmek paragraf hizalamalarınızı ve metin bloklarınızın birbiriyle etkileşim şeklini bozabilir. Weglot'un tüm Squarespace şablonlarıyla uyumluluğu genellikle bunun bir sorun olmasını önler; Squarespace şablonları profesyoneller tarafından son derece uyarlanabilir olacak şekilde tasarlanmıştır.

Ancak bu, a) çok dilli Squarespace siteniz için doğru şablonu seçmek ve b) özelleştirmek için izlemeniz gereken birkaç yol gösterici ilke olmadığı anlamına gelmez.

Çok dilliliği göz önünde bulundurarak Squarespace tasarım arayüzünde bir tura çıkacağız.

1. Squarespace'in çok dilli şablon zamanı.

Daha önce keşfetmiş olabileceğiniz gibi, Squarespace dünyasına girdiyseniz, tasarım parametreleriniz şablonlara yuvarlanır; Squarespace şablonları, hem mobil hem de masaüstü ekranlar için minimalist, görüntü ağırlıklı ve iyi orantılı olarak bilinir.

İşte şu anda Weglot müşterileri tarafından kullanılan ve Squarespace sitenizi çok dilli hale getirmek için denenmiş ve doğru olan şablonlardan bazıları:

Forte: temiz çizgiler ve kontrast

Forte, Beyaz Küp Konseptinin dijital bir tezahürü olarak adlandırılabilir: çağdaş bir sanat galerisi gibi görünmek ve hissetmek için yapılmıştır. Hatta ana sayfanızda otomatik bir arka plan slayt gösterisine birden fazla resim koymanıza bile izin verir.

Görünümdeki arka plan görüntüsünün parlaklığına bağlı olarak logonuzu siyahtan beyaza (ve tekrar) değiştiren bir ön ayar ile Forte, görsel olarak birden fazla şekilde uyarlanabilir.

Praglı mimar Stepan Havlik'in Forte kullanılarak tasarlanmış çevrimiçi portföyüne bir göz atın; İngilizce ve Çekçe siteleri eşit derecede keskin ve bilgilendirici.

Etki: İsim her şeyi anlatıyor

Impact'in belirleyici özelliği muhtemelen ana başlık alanının büyüklüğüdür. İşletmenizin adı veya 1 numaralı anahtar kelimeniz Impact ana sayfasında gerçekten gösterinin yıldızıdır.

Roma ve Berlin'de yaşayan avukat Valentina Mayer'in hem İtalyanca hem de ansiklopedik müvekkilleri için güzel bir şekilde tercüme edilmiş bir arayüz sunarken kişisel markasını nasıl güçlendirdiğine göz atın:

Salamura: paralaksın gücü

Sayfanıza biraz hareket katmak (özellikle de bunu kendiniz programlamak zorunda değilseniz) okuyucunun dikkatini çekmenin kolay bir yoludur. Brine şablon ailesini Squarespace'teki minimalist benzerlerinden ayıran şey de tam olarak budur; Brine'da tam ekran banner görselleriniz sayfa içeriğinizin geri kalanından biraz daha yavaş kayar.

Bunun sitenize 3D hissi vermek ve kullanıcıyı dünyanıza daha da fazla çekmek için en kolay yöntemlerden biri olduğu web tasarım dünyasında oldukça yaygın bir şekilde kabul edilmektedir.

Brine'ın başka nesi harika? Çok dilli kullanıma hazır.

(Aslında, Squarespace'in kendi çok dilli site demolarından biri Brine ailesinden bir şablon olan Nueva ile yapıldı - bundan biraz sonra bahsedeceğiz, ancak buradan bir göz atabilirsiniz).

Fransız grafik tasarımcı Emmanuelle Ciamous, kişisel galeri sitesindeki narin çizimlerine hayat vermek için Brine'ı seçti ve ortaya çıkan sonuç oldukça nefes kesici.

2. Metin içeren görseller yerine görsellerinizin üstünde metin blokları kullanın.

Hevesli bir Photoshop, Illustrator veya Canva kullanıcısıysanız, içinde metin bulunan arka plan görüntüleri veya diğer grafikler oluşturmayı seviyor olabilirsiniz. Bu, birçok tasarımcının, örneğin site oluşturucularda bulunmayan özel yazı tiplerini kullanmak istediklerinde yapmaktan hoşlandıkları bir şeydir.

Ancak, Squarespace sitenizin içeriğini çok dilli hale getirmeyi planlıyorsanız bu o kadar da iyi bir fikir değildir.

Weglot gibi uygulamalar görsellerinizin etrafındaki meta verileri (adları, başlıkları ve onları tanımlayan ve Google Görseller gibi arama motorlarında görünmelerini sağlayan anahtar kelimeler gibi) çevirebilirken,statik bir görselin (genellikle JPEG, PNG veya GIF formatında)içindeki metin çevrilemez.

( Weglot kontrol panelinin her bir dil için farklı görseller yüklemenize izin verdiğini de belirtmekte fayda var; böylece görselinizi her bir dil için statik metinle yeniden oluşturmak isterseniz, her birini uygun dille ilişkilendirebileceğiniz bir yeriniz olacaktır).

Ancak dürüst olmak gerekirse, görsel metninizi birden fazla dile fotoşoplamak -özellikle de çok sayıda görseliniz varsa- kısasürede uzun ve sıkıcı bir süreç haline gelebilir.

Kendi Squarespace banner görselinizi, üzerinde zaten metin olacak şekilde önceden tasarlamak yerine, bunun gibi...

...görüntüyü tek başına yükleyin:

...istediğiniz efektleri vermek için Squarespace'in resim düzenleyicisini kullanın (bulanıklaştırma, parlaklık değişiklikleri, her şey var):

...görseli bir banner görseli olarak (aşağıdaki ekran görüntüsünde gösterilen budur) veya bir bloğun arka plan görseli olarak ekleyin ve ardından doğrudan üzerine bir metin bloğu ekleyin.

Bu, metninizin algılanabilir olmasını ve çok dilli sitenizi oluştururken hiçbir harfin geride kalmamasını sağlayacaktır.

Görseller için profesyonel ipucu: Sıfırdan web sitesi tasarlamaya alışkınsanız bu her zaman geçerli olmasa da (en iyi uygulamalar genellikle görsellerin boyutlarının "ekran için optimize edilmiş" olması gerektiğini belirtir - yani süper yüksek çözünürlüklü olmaları gerekmez), Squarespace'de görseller söz konusu olduğunda daha büyük daha iyidir.

Squarespace şablonlarının çoğu büyük bir banner ( Brine, Bedford veya Hyde'ı düşünün) etrafında merkezlenir ve bazen de arka plan resmi tarzında tüm sayfayı kaplar (daha çok Keene, Polaris veya Marta tarzında).

Ayrıca, ana banner görseliniz olarak seçtiğiniz şeyin tüm cihazlardaiyi göründüğünden emin olmak isteyeceksiniz; sayfanızın üst kısmındaki aşağı oka tıklayarak ve bu menüden farklı bir görünüm biçimine geçerek tablet ve mobil sayfalarınızı önizleyebilirsiniz:

3. Tipografinizi uyarlayın.

Tipografinin, herhangi bir dil bağlamında bir web tasarımcısının birincil düşüncelerinden biri olduğu açıktır - eğer birisi sitenizi okuyacaksa, bu deneyimi onlar için mümkün olduğunca keyifli hale getirmek isteyeceksiniz.

Çok dilli tipografi kararları söz konusu olduğunda, Squarespace sitenizi farklı alfabeler/yazılar kullanan dillere çevirmediğiniz sürece genellikle çok fazla endişelenmeniz gerekmez. Eğer durum buysa, bu kısma daha fazla dikkat etmek isteyeceksiniz.

Squarespace son derece akıcıdır ve çoğu Squarespace şablonu, yazı tiplerinizi çok fazla değiştirmediğinizde en iyi şekilde görünür. Çoğu tasarımcı size çok fazla yazı tipi diye bir şey olduğunu söyleyecektir (Canva'nın tipografik en iyi uygulamalar listesindeki 9 numara bunun nedenini açıklıyor).

Bu, çok dilli Squarespace site tasarımcıları için iyi bir haber. Teoride, özel CSS kullanarak ihtiyaç duyduğunuzda her dil için farklı bir yazı tipi atayabilseniz de, işleri basit tutmak ve tüm dillerinizde evrensel olarak işlenecek yazı tiplerini kullanmak gözler ve tasarım kırpıntılarınız için çok daha kolaydır. Bu aynı zamanda markanızın diller arasında tutarlı olmasını sağlayacaktır ki küresel bir kitleye hitap etmeye çalışıyorsanız bu gerçekten önemli olabilir.

Google Fonts ve/veya Adobe Fonts'ta bulunan yazı tiplerini kontrol ederek başlayabilirsiniz (Adobe için ilki ücretsizdir, ancak kişisel kullanım için istediğiniz yazı tipini indirmek için genellikle bir hesabınızın olması gerekir).

Bu yazı tipi tabanları Squarespace'de mevcut olandan çok daha fazla stil içeriyor olsa da, hangi yazı tipi ailelerinin birden fazla alfabeyi desteklediğini anlamanın en iyi yoludur - Squarespace'de bunu yapmanın bir yolu yoktur.

Örneğin Google Fonts'ta, "dil" menüsünden istediğiniz yazıyı seçerek hangi yazı tiplerinin hangi yazı tiplerini desteklediğini görebilirsiniz.

(Bu menünün adı biraz yanıltıcıdır; seçeneklerin aslında aşağıdakilerin adları olmadığını fark edebilirsiniz dillerdeğil, daha ziyade YAZILAR hangi dillerin çevrimiçi olarak yazılabileceği. Alfabelerinin adını paylaşan birkaç dil vardır - örneğin Arapça, geleneksel olarak Arap alfabesi olarak adlandırılan alfabeyi kullanır - ancak birçoğu kullanmaz; İngilizce, Fransızca, Almanca ve diğer birçok dil, hepsi Latince'den türetilmiş olmasa da Latin alfabesini kullanır).

İhtiyacınız olan komut dosyalarının her ikisini (veya tümünü) destekleyen bir yazı tipi bulduğunuzda, Squarespace'te kullanılabilir olup olmadığını iki kez kontrol edin; Squarespace'in yazı tiplerinin tam listesine buradan ulaşabilirsiniz.

4. Squarespace dil değiştirme düğmenizi özelleştirin.

Bayrak simgelerini kullanmak isteyip istemediğinize karar verin.

Bu bazen zor bir karar olabilir. Geleneksel tasarım perspektifinden bakıldığında, dil seçimi menüsünde bir bayrağı bir dille ilişkilendirmek kulağa son derece sezgisel geliyor: Bu görsel bir işaret, sitenin orijinal ana sayfa dilinde tamamen kaybolmuş olsanız bile kendi dilinizi tanımanın bir yolu.

Ancak bayrakların teknik olarak dilleri değil ülkeleri temsil ettiğini unutmayın. Çoğu dil sadece birden fazla ülkede konuşulmakla kalmaz, aynı zamanda birçok ülkenin birden fazla resmi dili vardır.

Örneğin Hindistan bayrağının Hintçe'yi temsil etmesi pratikte pek bir anlam ifade etmiyor: Hintçe teknik olarak Hindistan'da en çok konuşulan dil olsa da ülkenin 16 resmi dilinden yalnızca biri ! Bu durumda, Hintli bir kitleye hitap etmeye çalışmak için Squarespace sitenizi bu bölgesel dillerden birden fazlasına çevirmenin yanı sıra herhangi birini diğerine sembolik olarak tercih etmekten kaçınmanız gerekir.

Ana navigasyon menünüze ekleyin.

Standart Weglot dil değiştirme düğmesi oldukça nötr olsa da, site genelindeki markanızı mümkün olduğunca tutarlı hale getirmek isteyebilirsiniz ve dil düğmenizin bu stratejinin bir parçası olmasını sağlamanın en iyi yolu, onu ana gezinme menünüze dahil etmektir.

Bu, sitenizin her sayfasında her zaman aynı konumda görünür olmasını sağlayacak, ayrıca rengi ve yazı tipi stili açısından diğer nav düğmelerine benzeyecektir.

Bunu Squarespace site editörünüzün "Sayfalar" bölümüne giderek yapabilirsiniz. "Ana gezinti" altında, ana gezinti çubuğunuza bir düğme eklemenizi sağlayan bir "+" düğmesi göreceksiniz; buna tıkladığınızda aşağıdaki ekran görüntüsünde olduğu gibi küçük bir pencere açılacaktır:

Bağlantıyı yönlendireceği dil adı olarak adlandırabilir ve "Bağlantı" içerik kutusuna "Weglot" ve ardından söz konusu dil için iki harfli dil kodunu girebilirsiniz.

Temellere geri dönün: Çok dilli Squarespace başarısı için dört ana çıkarım

Squarespace'in çok dilli uyarlanabilir tasarım özelliklerinden bazılarını ele aldığımıza ve birkaç örnek üzerinden geçtiğimize göre, Squarespace sitenizi çok dilli alana taşırken aklınızda bulundurmanız gerekenleri özetleyelim:

• Şablonunuzu akıllıca seçin. Bu aslında her Squarespace kullanıcısının verdiği en temel karardır: şablon seçiminiz iş akışınızın geri kalanını belirler. Çeviride de aynı şekilde iyi görünecek bir şablon seçtiğinizden emin olun.

• Metninizi görsellerinizden ayrı tutun. Kullanıcılarınızın metni okuyabilmesini istiyorsanız, üzerinde metin bulunan görseller yüklemekten kaçının; bunun yerine metinsiz görselleri banner veya medya öğesi olarak yükleyin ve Squarespace'in çoklu metin bloğu seçeneklerini kullanarak bunların üzerine veya etrafına yazı yazın.

• Yazı tipi çok önemlidir. Squarespace'te ihtiyacınız olan tüm yazı tiplerinde mevcut olan yazı tiplerini kullanın; bu, tüm ziyaretçileriniz için sitenizde tutarlı bir markalama sağlayacaktır.

• Düğmenizi güçlendirin. Özelleştirilmiş bir dil değiştirme düğmesi, çok dilli Squarespace sitenize daha akıcı bir şekilde oturacak ve yersiz görünmeyecektir - hedef dildeki kullanıcılarınızın orijinal dildeki kullanıcılarınız kadar dikkate alındıklarını hissetmelerini sağlayacak bir başka küçük ayrıntı.

Diğer CMS olduğu gibi, Weglot Squarespace'te de çok iyiWeglot . Bugün ücretsiz deneme sürümüyle deneyin.

Weglot 'u Squarespace sitenize nasıl yükleyeceğinizi keşfedin.