Web sayfalarının aktif elemanları ilişkilidir. Temel Web Sayfası Elemanları

İnternette sunulan içeriğin büyük kısmı web sayfalarıdır. Bu, sanal ağ alanında konaklama amaçlı, ancak hala alaka düzeyi ve pratik olarak rekabet edilmeyen formatları koruduğunu belirten bir ilk tür belge türüdür. Web sayfalarının yapısı nedir? Hangi web geliştirme araçları ile yaratılır?

Web sayfası nedir?

"Web sayfasının temel unsurlarını listele", "Sınav Bize Bilişim dersinde bize bildirir. Ona cevap olarak ne söyleyebiliriz? Her şeyden önce, web sayfasının prensipte olduğunu anlatıyoruz.

Bir BT uzman ortamında karşılaşılan bir tanıma göre, bu, uzmanlaşmış bir programda açılmak üzere tasarlanmış ve çeşitli faydalı içerikler için uygun tipi kullanarak bilgisayar ekranında görüntülenecek verileri içeren bir belgedir - metinler, bağlantılar, Grafik, video, müzik ve müzik vb. Web sayfası bir metin belgesidir. Tarayıcı için ilgili veriler harfler, sayılardır ve Özel sembollerİşaretleme dilinin unsurları olarak kullanılır - HTML. Web sayfasının yaratıcısının ", tarayıcıyı" açıkladığını, ekrandaki bir veya başka bir içeriğin nasıl görüntüleneceğini "kullanıyordu.

Site yapısındaki web sayfalarının yeri ve rolü

Web sayfasının web sitesinin ana bileşeni olduğunu söylemek mümkün müdür? Kısmen bu doğrudur. Ancak, yukarıda belirttiğimiz gibi, web sayfası sadece bir metin belgesidir. Site, kural olarak, resim, video ve diğer multimedya elemanlarını da düzenler. Onları kendi içinde yerleştirmek için bir web sayfası, ancak yapısında onlara bağlantılar içerebilir. Böylece, web sayfası, kullanıcıların önündeki sanal içeriğin ekranındaki baskın rolün yönünde sitenin ana bileşeni olarak adlandırılabilir.

Nadir durumlarda, elbette, dikkate alınan belge, sitenin tek bileşeni olacaktır - grafik, video ve diğer multimedya elemanlarını görüntülemek için bazı nedenlerden dolayı sağlanmazsa. Özellikle, ilk siteler - web sayfalarının işçileri yalnızca ortaya çıktığında uygun içeriği içermemektedir. Kullanıcının gözünden önce, sadece metin ve linkler vardı.

Hypertext Kullanımı Prensibi

Böylece, Web sayfasının HTML'de çizilen bir belge, hipertext işaretlemesinin yapıldığı bir belge olarak adlandırılır. Ama bu fenomen nedir? Köprü metni nedir? Teoriye güçlü bir şekilde derinleşmeden, bunun bir veya başka bir şekilde başka bir şekilde başka birine hızlı erişime izin vermenizi sağlayan bir metin olduğunu unutmayın. Her zamanki kitapta imkansızdır - "basit bir metin" var. İstediğiniz sayfaya erişimi kazanmak için, kelimeyi veya dipnotları okumadan önce okuyucu birkaç yeniden dağıtım yapmalıdır. "Köprü metni" modunda, işin ana kısmı bir bilgisayar yapar - Sayfa HTML öğelerine yansıtılan bilgilerden dolayı.

Bilgisayar bilimi öğretmeni bize bildirirse: "Web sayfasının temel unsurlarını listele", daha sonra HTML İşaretleme Dili kullanılarak oluşturulan ilgili belgenin bileşenlerinin hikayesine mükemmel bir şekilde başlayabiliriz. Bu nedenle, başlamak için, HTML ile ilgili bazı teorik anları düşünün.

HTML Dil Yapısı: Etiketler

Tarayıcı, Web sayfasıyla ilgili gerekli verileri HTML'de çizilen belgelerden nasıl okur? Çok basit.

Bu dilin ana unsurları etiketlerdir. Çoğu durumda, eşleştirilir - açık ve bir kapama var. Birincisi sadece açısal parantez ile gösterilir. İkincisi benzerdir, ancak ikinci braketten önce bir eğik çizgi yerleştirilir - sembolü. Tarayıcı, bunları tanıyabilir ve bu nedenle, web sayfalarının içeriğini, belgenin geliştiricisi tarafından oluşturulan algoritmalara uygun olarak herhangi bir sorun olmadan görüntüler.

Açılış etiketi genellikle büyük harflerle kapanarak yazılır - küçük. Bu bir BT uzman ortamında kurulan bir standarttır. Tarayıcı, HTML komutunu herhangi bir harften kesinlikle tanıyacaktır, ancak web geliştiricilerinin de işaretli etiket yazma programına yapışmaları önerilir. Bu, örneğin, web sayfasının diğer uzmanlar tarafından iyileştirilmesini kolaylaştıracaktır.

Öznitellikler

Diğer temel HTML dil öğeleri özellikleridir. Yardımlarıyla birlikte, Web sayfasının yaratıcısı içeriğin özelliklerini ayarlayabilir - örneğin, yazı tipinin yüksekliği, rengini, sayfaya göre konumlandırın. Aynısı resimler, videolar ve diğer multimedya bileşenleri için de geçerlidir. Nitelikler açılış etiketi içinde yazılmıştır.

İçerik

Açılış ve kapanış etiketi arasında, Web sayfasının aşağıdaki anahtar bileşeni bulunur - içeriği. Bu, aslında, kullanıcıdan önce ekranda görüntülenmesi gereken içerik. Bu, metin, link, resim, video veya diğer multimedya öğesi olabilir.

İnternet sayfaları

"Öyleyse, web sayfasının temel unsurlarını listeler, sonunda!" - Öğretmeni tekrarlar. "Zevkle" - ona cevap veriyoruz. Söz konusu belge türünün yapısına neler dahildir? Bu yönü, web sayfasının HTML öğelerinin tam olarak içeriğini tam olarak göz önünde bulunduracağımız konusunda hemfikiriz. Yani, tarayıcıdaki ekranları, kullanıcının ekranda görmesidir - daha az bir ölçüde merak ediyoruz. Gerçek şu ki, programın içeriği eşit şekilde gösterdiği, ilgili HTML algoritmalarının farklı olabileceğidir. Ve HTML dilinin bu özelliğinde: Web sayfasındaki istenen görüntü görüntülenebilir farklı yollar. Aynı zamanda, web sayfasının yaratıcısının işgücü maliyetlerinin işgücü maliyetlerinin bakış açısıyla eşdeğer olabilir ve uygulamaları için farklı miktarda çaba ve zaman alabilirsiniz.

Web Sayfaları: Başlık

Web sayfasının standart unsurları, şaşırtıcı bir şekilde geliyor gibi, çok az miktarda sunulur. Özünde, sadece ikisi var - belgenin başlığı ve ana kısmı. Aynı zamanda, her birinin oldukça karmaşık bir yapıya sahip olabilir.

Başlığın özgüllüğü nedir? Web sayfasının tepesinde bulunur. Bir başlık oluşturan bir HTML kodunda, kural olarak, "Şifreleme" yalnızca şifrelenmiş olduğu varsayılır, ancak gerekirse, küçük grafikler de uygun elemana yerleştirilebilir. Ve bu, aslında, başlık hakkında söylenebilecek her şey. İlgili belgenin yapısındaki rolünün önemsiz olduğu görülüyor. Ama öyle değil. Web sayfaları başlıkları, sitenin indeksleme açısından çok önemlidir. arama motorları - Yandex, Google. Bu öğe Web sayfasının içeriği ve sitenin tematik özelliklerini tamamen alakalı olmalıdır.

Web sayfası başlığı HTML kullanarak nasıl düzeltilir? Çok basit. İlk olarak, açılış etiketi, her zaman köşe parantezi olan kafa, sonra başlık içeriği, sonra - kapatma etiketi gibi görünüyor. Elbette, web belgesinin üstünde yazılırlar.

Web belgesi başlığı bir dizi ek öğe içerebilir. Bazen web sayfası formatı, belirli bir kodlamada metin ekranı gerektirebilir. Web Belgesinin Uygunluğu Nasıl Yapılır Bu Kriter? Çok basit. Belge başlığının yapısında, HTML algoritmaları yerleştirilmeli, belirli bir dil kodlamasını kullanmak için tarayıcıyı reçete edilmelidir - örneğin, Kiril. İlgili komutlar, diğerlerinin yanı sıra, açılış ve kapanış yaptığı meta etiketine yerleştirilir.

Web sayfasının çoğu

Web belgesinin ana kısmı gövde etiketi ile açılır, bir eğik çizgi de dahil olmak üzere uygun elemanı kullanarak kapanır. Aynı zamanda, açılış ve kapanış etiketleri arasında olabilir büyük miktar HyperText Markup dilinin ek komutları. Bunun nedeni, faydalı içeriğinin web sayfasının ana kısmında yayınlandığı gerçeğinden kaynaklanmaktadır - metinler, linkler, grafikler, videolar, doldurma için çeşitli formlar.

İlgili içeriğin her birinin kendi etiketleri vardır. Web belgesinin ana kısmının yapısında, metin biçimlendirmesinin de yapıldığı bir HTML komutları, örneğin, belirli bir renk, boyut ve diğer özelliklerin yazı tipini gerçekleştirmiştir.

Bazı sıklıkta HTML etiketlerinin spesifikliğinin ne olduğunu düşünün. Aslında, ayrıca web sayfasının temel unsurlarını da oluştururlar.

Temel HTML etiketleri

Bu nedenle, Web sayfasının unsurlarının ne olduğuna dair ayrıntılı bir çalışmanın amacı ile, temel HTML etiketlerinin özünü daha fazla inceleyeceğiz. Bazıları zaten yukarıda LED'tiydi - özellikle tarayıcının web sayfalarının başlıklarını okuduğu ve belgenin ana kısmının nerede olduğunu belirler.

P. etiketi yeterince dağılmıştır. Köprü metni işaretleme dilinin diğer benzer unsurları gibi, keşfedilebilir ve kapanabilir. Bu etiket, belgenin ayrı bir paragrafını biçimlendirmenizi sağlar. Örneğin, bunun için belirli bir yazı tipini veya rengini ayarlayabilirsiniz. Ancak, bu ek bir etiket - yazı tipi kullanılarak yapılır. Aynı zamanda, paragrafın sınırlarını belirten birinin içine yerleştirilecektir - bu, tercih edilen yazı tipinin türünü, Web sayfasının diğer öğelerine yansıtan HTML komutunu dağıtmamasına izin verecektir.

Tagle etiketi ile tablolar oluşturulur. Buna karşılık gelen niteliklerin yardımı ile, istenen sütun ve satır sayısını belirleyebilir, genişliğini, sınırların özelliklerini, tablodaki metin yazı tipinin boyutunu ve rengini belirleyebilirsiniz.

Resim tarayıcısının işlenmesinden sorumludur. Ayrıca, resmin boyutunu, sayfadaki konumunu düzenleyen çeşitli özellikleri de yerleştirebilir.

Diğer web belgelerine veya dosyalara referanslar, A etiketi kullanılarak belirtilir. Kural olarak, Web Sayfası yapısındaki bir köprünün bir köprü olduğunu gösteren nitelikler. Bu, yol açtığı belgeyi, dosyayı veya web sitesini belirtir.

Etiket Frameset olarak dağıtılır. Bununla birlikte, Web sayfası alanını çeşitli alanlara bölersiniz - çerçeveler. Her birinde, Web belgelerinde ayrı olabilirsiniz. Yani, çerçeveler aynı anda iki veya daha fazla sayfa bir ekranda doğru konumlandırmanıza izin verir.

Web sayfalarının temel unsurları ve daha sonra bir hikaye HTML dilini kullanarak biçimlendirme aracı hakkında bir hikaye - bu konuda, bu konudaki cevabımızın algoritması olacak. Bize itiraz ettüyse, "Web sayfasının temel unsurlarını listeleyiniz" dedi, o zaman uygun metodolojiyi kullanarak, konuyu ortaya çıkarma şansına sahip olacaklar. Yani, "unsurlar" terimi altında, web belge yapısının ana bileşenlerini veya içerik türlerini - metin, resimler, tablolar, çerçeveler, web yöneticisinin böyle bir aracın html dili olarak yardımıyla ürettiği bağlantılarını anlayabiliriz.

Web geliştirme araçlarının özgüllüğü

Buna ek olarak, HTML standartları tarafından öngörülen etiketlerin ve niteliklerin büyük bir miktar olduğunu açıklayabiliriz. HTML web geliştiricilerine ek olarak kullanılabilir ek araçlar HyperText belgelerini biçimlendirme. Örneğin. javascript kullanarak Dinamik Web Sayfaları oluşturabilirsiniz - yani, içeriğin sürekli olarak güncellendiği (hem kullanıcının kendisinin hem eylemleri boyunca hem de komut dosyalarında algoritmalara uygun olarak).

Web geliştiricisinin, örneğin, PERL, PHP, JAVA, PYTHON gibi, Hypertext belgeleriyle çalışma olanaklarının daha da geniş olması gibi tam teşekküllü programlama dillerini kullanabileceğini eklemek faydalı olacaktır. Bunun ihtiyacı, bugün web teknolojilerinin uygulamalarının çok farklı olması nedeniyle olabilir. Modern geliştiricilere karşı karşıya olan görevler oldukça karmaşık olabilir. Örneğin, Rusça olarak yazılmış web sayfalarını İngilizce'ye çevirmek için bazen gereklidir. Bu durumda, geliştiricinin araç seti en çeşitli olacaktır.

Web sayfası öğeleri

Herhangi bir web sayfası, her bir İnternet kaynağının zorunlu bileşenleri olan belirli bir standart öğe kümesi içerir. Tabii ki, benzer nesnelerin aralığı ve sayısı, sitenin tematik yönüne, üzerinde yayınlanan malzemelerin hacmine ve bu kaynağın yaratıcısının kendisini belirlediği amaçlar ve görevlere bağlı olarak değişebilir. Bu tür elementlerin düzenini, karşılıklı konumlarının tasarımı ve Web-Master'ın ana görevlerinden biridir.

Değerlendirmemiz gereken web sayfasının ilk unsuru başlığıdır. Bununla birlikte, hem metin hem de grafik versiyonunda yapılabilir, ancak diğer durumda, belgenin tepesinde bulunmalıdır. Bazen başlık ile birlikte, bu Web kaynağı iki dilde sunulduysa, İngilizce-dil sürümüne İngilizce-dil sürümüne gitmek için Kiril Kodlama Seçimi menüsünü ve düğmeleri birleştirin. Doğrudan belgeyi, kural olarak, bir reklam afişini barındırmak için ayrılan bir alan var. Çoğu durumda web sayfasının üstündeki başlık da dahil olmak üzere zorunlu durum Banner Exchange Services'teki Site Kayıtları - Sistemler Sitenizin sayfalarında görüntülenme karşılığında yarattığınız kaynağı reklamlar Banner ağının diğer katılımcılarını reklamlar. Standart beden Belgenin başlığında yayınlanan afişler genellikle 468x60 puandır. Statik bir sayfa düzeni prensibi kullanıyorsanız, belgenizin başlığının genişliği yaklaşık 640 piksel olacaktır: bu değer, her şeyden önce, belgenin monitörlerdeki doğru göstergeyi ekran çözünürlüğüne sahip doğru göstergesini sağlama ihtiyacı 640x480 puan ve yatay kaydırma çubuğunun görünümünü önlemek, bu da onu görmeyi zorlaştırır. Bu durumda banner genişliğinin başlık genişliğinden önemli ölçüde daha az olacağı açıktır, böylece, reklam için bir yer almayı planladığınız sayfanın bölümünde, logo doldurulabilen boş bir alan oluşturulur. Bu sitenin sahibinin veya web barındırılmasını uygulayan bir sunucuya referansın. Tabii ki, logo her zaman gerekli değildir: Kural olarak, yalnızca sitenin ticari bir yönelim varsa, web sayfasına dahil edilmiştir.

Belgenin ana kısmı, sözde metin alanını alır - sayfanın anlamsal doldurmanın yerleştirildiği bir çizim: anlamlı bilgi metin ve resimler. Listelenen elemanların ayrıca bir Contentee olarak da adlandırılır (İngilizce, İçerik - İçerik). Metin alanının konumu, öncelikle web tasarımcısının belgenin diğer elemanlarını nasıl yerleştireceğine bağlıdır.

Web sayfasının bir sonraki zorunlu bileşeni, navigasyon elemanlarıdır - bağlama köprüleri bu belge sitenin diğer bölümleriyle. Gezinme elemanları metin dizeleri şeklinde yapılabilir, grafik nesneleri, yani, düğmeler veya aktif maddeler, Örneğin Java uygulamaları. İkincisi, geleneksel kız kardeşlerinin aksine, farenin hareketine yanıt verebilecek, bunlara herhangi bir basit eylem (arka ışığı açarak, bir presleme, bir değişiklik yaratma şeklinde vb.). Web tasarımının temel "postulatları" bölümünde belirttiğim gibi, navigasyon elemanları, her zaman görünüşte, yani, yani, kullanıcı sayfasını serbest bırakmak zorunda kalmayacak şekilde konumlandırılmalıdır. Metin alanı birkaç fiziksel ekranın yüksekliğini alırsa, daha sonra diğer bölümlere bağlantılar aramak için uzun zamandır. En iyi kurulmuş yaklaşım, gezinti elemanlarının sayfanın sol kenarından yerleştirilmesidir.

Belgenin alt kısmında, site geliştiricileri ve kaynağın ziyaretçilerinin kendi isteklerini, önerilerini ve isteklerini sahiplerine gönderebilecekleri e-posta adresi hakkında bilgi yayınlama alışılmıyorum. Web sayfası bir başlangıç \u200b\u200bbelgesi ise, bunun altında bir ziyaret sayacı yerleştirin - Sunucuya yüklü olan CGI komut dosyasını çağıran küçük bir komut dosyası, bu, belgenin her bir açılmasını kullanıcı tarayıcısındaki her bir açıklamayı değiştirir. . Bu sayede, web sihirbazı herhangi bir zaman için sayfasını eklediklerini kolayca belirleyecektir. Ziyaret metrenin yalnızca siteye erişirken adlandırılan ilk sayfada yüklendiğini unutmayın, diğer kaynak belgelerinde eksik. Aynı zamanda bir sayfada birkaç farklı metre yayınlamanız da önerilmez.

Bu nedenle, web sayfasının tüm ana bileşenlerini ve bunların birbirlerine göre olası konumlarını söküyoruz.

Uygulamada, web siteleri sıklıkla, ekranın sağ kenarında navigasyon elemanlarının yerleştirildiği tasarımında bulunur. Bu durumda, metin alanı sola kaydırılır, belgenin kalan bileşenleri, kombinasyonlarının maksimum estetiğinin prensibine dayanarak bulunur.

Şekilden görülebileceği gibi, bu durumda logo belge başlığı ile bir seviyeye yerleştirilir ve reklam afişi sayfanın ortasına göre konumlandırılmıştır. Bu yaklaşımla, reklamcılığın tek bir rengin ve sanatsal tarzda reklam vermek için başlığın, logonun ve alanların grafik tasarımına dayanması önerilir - o zaman bu nesnelerin konumunun asimetrisi bu kadar açık olmayacak ve gözleri destekleyicilere kesmeyecek katı, masa estetiği tasarımı ile.

Gezinme öğeleri sadece sayfanın sağ ve sol sınırlarına yakın değil, aynı zamanda belgenin üstünde de yerleştirilebilir. Böyle bir düzen seçeneği en uygun, bence, yerli sayfalar oluştururken: bu durumda, tüm sayfa nesneleri tam olarak belirtilen genişliğe sığar görünmez masaAynı zamanda, masanın hazırlanması büyük ölçüde basitleştirilmiştir. Bu yaklaşımın tek dezavantajı, belgenin altındaki navigasyon elemanlarını çoğaltma ihtiyacıdır, çünkü sayfa dikey kaydırma olduğunda, ekranın üst sınırından sonra kaybolurlar ve bunlara ulaşmak için kullanıcının yapması gerekir. Ekranın geri döndüğünü, gördüğün, oldukça rahatsız edici.

Tabii ki, bu bölümde söylenen her şey bir Panacea değil, harekete geçme liderliğidir. Sadece belirtmeye çalışıyorum genel İlkelerSitenin yapısını döşerken kullanılan, nihai çözelti her zaman Web Master için kalır. Sonuçta, gelecekteki projemizi başlatmadınız ne tür bir tasarım, çalışmalarınızın sonucu hala doğru olacaktır: İnternette sansür yoktur, sitenin yaratıcısını koruyan düzenlemeler yok veya diğer katı çerçevelerde. Yukarıda belirtilen kategorilerden herhangi birine girmeyen bir tasarımcı çözümü örneği, sözde karışık düzen olarak görev yapabilir.

Şekilden görülebileceği gibi, bu örnekte, kontrol elemanlarının bir kısmı doğrudan sayfa başlığında inşa edilmiştir - sitenin Rusça ve İngilizce versiyonları ile gezinme düğmeleri arasında geçiş yapmanın düğmesi hakkında konuşuyoruz: Bu, kaynak yaratıcıların e-posta adresine, alt belgede çoğaltılmış, örneğin bir haber sayfası, tematik bölümlerden birine bir başvuru olabilir. Navigasyon elemanlarının ana birimi, belgenin sol sınırına göre konumlandırılmıştır, ancak Kiril Kodlama Seçimi menüsü, sayfanın üstündeki doğrudan reklam afişinin altına yerleştirilir. Metin alanı iki asimetrik kolona ayrılır ve bu bölümlere bağlantılar da dahil olmak üzere tematik sütunların kaynağının kısa ilanları sağa yerleştirilir.

Açıkçası, bir web sayfasının karışık düzeninin varyantları harika bir set olabilir: spesifik çözümler, bölüm kaynak bileşenlerinin sayısına, site için hazırlanan metnin hacmine ve son olarak, tasarımcının kendi fantezisine bağlıdır. Sitenin görünümünün ziyaretçilerden şikayette bulunmaması sadece önemlidir. Sonunda, sadece bir geliştirici olarak, siz ve hiç kimsenin tüm yeteneklerinizi ve yeteneklerinizi gösterme hakkına sahip değil ve sayfayı kendi zevkinize göre oluşturmaz. Bazı ev çantalarının yaratıcıları, şüphelerle işkence görmeyen, ziyaret sayacını belgenin sağ üst köşesine yerleştirin, site adı küçük bir kavurma yazı tipi ile yazılır ve bir reklam afişi altında yayınlanır ve bazı nedenlerden dolayı gezinme elemanları için Beklenmedik bir şekilde, metin bloğunun ortasında, kendinizle ilgili bir hikaye ile projenin yazarının sevgili köpeğinin fotoğrafları arasında. Tadı ve renk, söyledikleri gibi, yoldaş yok. Ama şahsen, bu hastalık bana tedavi edilemez görünüyor.

Hepimiz anahtar kelimeleri nasıl seçeceğinize dair çok sayıda makale okuduk ve sitelerden, siteyi belirli arama sorgularıyla alakalı hale getirmek için anahtar kelimeler kullandığı için doğru bir liste oluştururuz. Anahtar kelimeleri barındırma konusunu web sayfalarında daha ayrıntılı olarak düşünelim.

Web sayfasındaki anahtar kelimelerin nerede ve nasıl yerleştirileceği bilgisinden, SEO şirketinizin başarısına veya başarısızlığına bağlıdır.

Her web sayfasında, anahtar kelimelerin yerleştirilmesi gerektiğinde 5 unsur vardır:

1. Sayfa başlığı (başlık etiketi)
2. Anahtar Kelimeler Sayfalar (Meta Tag Kelimeler)
3. Sayfa Açıklaması (Meta Tag açıklaması)
4. Resimler için alternatif metin (alt etiketi)
5. Web sayfası içeriği (vücut etiketi)

Web sayfasının yukarıdaki tüm öğelerinin, sayfanın içeriği en önemlidir (paragraf 5). Bu konuda daha fazla.

Şimdilik, bu listeyi sırayla merak edelim.

Öğe numarası 1. Sayfa başlığı (başlık etiketi)

İlk önce, başlık sayfasını (başlık etiketi) düşünün. Bu eleman, herhangi bir web sayfasının baş bloğundaki diğer tüm öğelerin ilk ve en önemlisidir.

Web Sayfası Başlığı İnternet tarayıcısının üst satırında izleyebilirsiniz. Bundan emin olmak için, örneğin herhangi bir tarayıcıyı başlatın, Internet Explorer., Opera veya Mozilla Firefox., Herhangi bir siteye gidin ve başlık etiketinin içeriğini bu tarayıcılardaki üst çizgiyle karşılaştırın. Arama motorları bu etiketi kendi amaçları için kullanırlar - konularının sitesi ve tanımları hakkında bilgi toplamak ve ayrıca arama sonuçları (SERP) web sayfasının adı olarak da kullanırlar.

Hatırlamak! Web sayfası başlığı onun kısa Açıklama.

Yukarıdaki içeriğe ek olarak, başlık etiketi, Sık Kullanılanlar İnternet tarayıcısına eklerken web sayfası adı olarak kullanılır.

Öğe Sayı 2. Anahtar Kelimeler Sayfalar (Meta Tag Kelimeler)

Şimdi META Etiket Anahtar Kelimeleri ve Açıklama hakkında konuşalım. Bir süre önce, Arama Motoru Endeksi'ne bir site eklenirken Meta Tag anahtar kelimeleri kullanılmıştır. Ancak bu zamanlar geçti. Şimdi arama motorları bu etiketi sadece görmezden geliyor, çünkü "Kirli" amaçlı kullanımının frezeleri. Bazı arama motorları, sitenin konusunu belirlemek için bu etikete dikkat eder.

Bütün bunlardan bu etiketin gerekli olmadığını, ancak yalnızca doğrudan randevuda kullanabilirsiniz.

Anahtar kelimeler virgülle ayrılmalıdır. Listenin başında, en önemli anahtar kelimeleri daha da önemini azaltın. Arama motorları, anahtar kelimelerin atıldığı kayıtlara dikkat etmekten vazgeçti, bu yüzden şimdi tüm anahtar kelimeler küçük harflerle yazdırılabilir.

Öğe numarası 3. Sayfa Açıklaması (Meta Tag açıklaması)

Meta Tag Açıklama - Anahtar kelimelerin yerleştirilmesi gereken sitenin başka bir elemanı. Arama Motorları Bu etiketi içindeki anahtar kelimelerin varlığı için görüntüleyin ve içeriğini sitenin içeriğiyle karşılaştırır (vücut etiketinin içeriği). Çok önemli bir durum, arama motorlarının, açıklama etiketinin içeriğini, arama sonuçları sonuçlarında (SERP) web sayfasının bir açıklaması olarak kullanmasıdır.

Bu etiket, web sayfasının kısa bir açıklamasını içermelidir, ancak en fazla 50 kelimeliktir.

Eleman sayısı 4. Resimler için alternatif metin (alt etiketi)

Alt Etiketler, içeriğin bir metin açıklamasıdır, yani. Bazı nedenlerden dolayı resim yüklenmezse ve bu resimin alt metni vardır, sonra bu metin görüntülenecektir.

Resim yüklenirse ve resmin alt metni de sahipse, fare imlecini resme getirdiğinizde görebiliriz. Alt-Etiketler, herhangi bir nedenle, grafiklerin gösterilmemesi için internet kullanıcılarının rahatlığında kullanılır.

Birçok arama motoru, bu etiketin içeriğini sırasıyla indeksleyin, anahtar kelimeler olabilir. Sadece ALT metninin görüntüyü eşleştirmesi gerektiğini, tanımladığını, metinsel eşdeğeri olacağını unutmayın. Alt etiketini, bölme çizgileri, işaretçiler gibi işaretleme görüntüleri ile ilgili olarak kullanmayın ...

Eleman sayısı 5. Web sayfası içeriği (vücut etiketi)

Öyleyse, nihayet, sitenin en temel unsuruna vardık - vücut etiketi, öğe, içeriği en çok internet kullanıcıları ile ilgileniyor. Ana arama motorları artık arama sonuçları sonuçlarında 1 satır vermeyecek (Sırp) yalnızca web sitenizin sayfasındaki birkaç anahtar kelime tekrarının varlığı nedeniyle. Belirli bir arama sorgusunda yalnızca en alakalı web sayfası olacaktır.

Bunu başarmak için, seçilen anahtar kelimeleri Web sayfalarında, tekrarların sıklığını gözlemlemelidir. Aşağıdaki gibi davranın: Her belirli sayfada, 1-2 anahtar kelime seçin ve ilgili sayfayı onlar için optimize edin.

Yeni sitenizin veya ürününüzün sunumunu hazırladığınızı hayal edin. Ardından, örneğin, PowerPoint sunumunuzun slaytları - paragraflar. Kısa ve net olmalıdır. Tıpkı PowerPoint sunumunda olduğu gibi, seçilen anahtar kelimelere her vurgu yapmak için sitenizin veya ürününüzün faydalarını numaralandırmak için listeleri kullanabilirsiniz.

Seçilen anahtar kelimeleri yukarıda listelenen her bir Web sayfasının 5 elemanında uygular ve mevcut konumlarınızı ve sonuçlarınızı iyileştirirsiniz.

HTML Dili

Web sayfaları herhangi bir biçimde mevcut olabilir, ancak Hyper Metin İşaretleme dili, formatlı metin oluşturmak üzere tasarlanmış, görüntü, ses, animasyon, video klipsler ve köprü metni, web boyunca dağılmış diğer belgelere doymuş, resimli metinler oluşturmak için tasarlanmıştır. boşluk ve aynı sunucuda bulunan veya parçası Aynı Web Projesi.

HTML dili bilgisiz bir web üzerinde çalışabilirsiniz, çünkü HTML metinleri farklı özel editörler ve dönüştürücüler tarafından oluşturulabilir. Ancak doğrudan HTML'ye yazmak zor değildir. Hatta yetenekleri konusunda sıklıkla sınırlı olan bir HTML editörü veya dönüştürücüyü incelemek, hatalar içeren veya farklı platformlarda çalışmayan kötü HTML kodunu harcamaktan daha kolay olabilir.

HTML dili çeşitli seçeneklerde var ve gelişmeye devam ediyor, ancak HTML tasarımları gelecekte büyük olasılıkla kullanılacak. HTML'yi çalışmak ve başında bir belge oluşturarak daha derinleri bilmek html okuyor ve mümkün olduğunca genişletmek, birçok kişi tarafından görülebilecek web sayfaları oluşturma yeteneğine sahibiz. internet tarayıcılarıŞu an ve gelecekte. Bu, örneğin Netscape Navigator, Internet Explorer veya diğer bazı programlar tarafından sağlanan gelişmiş özellik yöntemini, örneğin, diğer yöntemler kullanma olasılığını dışlamaz.

HTML çalışması, yalnızca gerçekten gerekiyorsa, uzantıları kullanarak standartlaştırılmış bir dilde belge oluşturma özelliklerini özümsemenin bir yoludur.

HTML, World Wide Web Consortium tarafından onaylandı. Birkaç yaygın tarayıcı tarafından desteklenir ve web ile ilgili tüm yazılımın neredeyse tamamının temeli olabilir.

Bir Web sayfası oluşturma ilkeleri, Web sayfasının temel unsurları

Web sayfaları oluşturmak için özel bir HTML dili kullanılır (HyperText Markup Dili - HyperText Marking Dili). Bu dil, Etiketler adlı bir özel komut kümesini tanımlar ve Web sayfasının belirli öğelerini biçimlendirmeyi veya atamayı ayarlamak için kullanılır. Özel Etiketler web sayfalarında yerleştirmek için kullanılır grafik görüntüleri, ses ve video klipler ve diğer buna gömülü nesneler.

Web sayfaları sıradan metin dosyalarıStandart bir not defteri veya benzeri bir basit metin editöründe oluşturuldu. Ve metinleri içeriyorlar, yalnızca sayfalara koymak istediğiniz metni yalnızca özel bir şekilde yerleştirilir. Çeşitli web tarayıcılarının aynı web sayfasını doğru şekilde görüntülemesi için, HTML dili standartlaştırılmalıdır.

Uygulamada, HTML standardı, en ünlü tarayıcılar tarafından önerilen ve desteklenen etiketlerin varlığı ile büyük bir etkiye sahiptir. Microsoft Internet Explorer ve Google Chrom. Bu etiketler B. şu an Can, nasıl girilir ve geçerli HTML özelliklerinin bir parçası olmaz.

HTML yazmak için özel olarak tasarlanmış düzenleme araçları vardır. Anahtarları içerdikleri gibi zamandan tasarruf etmenize izin verirler. hızlı erişim Belgelerin, tabloların ilk kurulumlarını ayarlamak veya metne stil uygulamak gibi tekrarlayan işlemleri yapmak. HTML editörleri Yazarın WYSIWYG Toolkit'ten farklıdırlar çünkü HTML derleme kuralları hakkında manuel olarak bilgiyi gerektiriyorlar, editörler yalnızca bu işlemi basitleştirir ve hızlandırır. Hem de html etiketleri, Standartlaştırılmış wwwc (Standart Etiketler), Web tarayıcıları, çoklu standart dışı etiketleri desteklemektedir. Bu etiketler, rakipler üzerinde bir avantaj elde etmek için bir Web tarayıcı programının geliştiricileri tarafından girildi. Bu markalı genişlemelerin daha sonra HTML standardına gireceğini umuyorlardı, ancak bu umutlar gerçekleşecek şekilde değildi. Ancak, etiketler kaldı ve hala destekleniyor.

Web sayfalarını oluşturmak için, herhangi bir tarayıcıya ihtiyacınız olacak - Internet Explorer veya Google Chrome Mozilla Firefox'a ihtiyacınız olacak ve her ikisi de daha iyidir, çünkü birçok HTML öğesi farklı şekillerde farklıdır. farklı programlar Bu farkı kontrol etmek için görüntüleme ve çok arzu edilir.

Ek olarak, örneğin için herhangi bir metin editörüne ihtiyacınız var. hTML eğitimi - Dosyalar ve tarayıcı - yapılan görüntülemek ve kontrol etmek için.

Bir Web sayfası oluşturmak için, ilk şey sitenin yapısını oluşturur. Site, fiziksel olarak WWW'ye ve daha büyük bir sunucuya neredeyse başka bir yere yerleştirilmiş olan benzersiz bir adı ve kalıcı adresi olan bir sunucudur.

Site yapısını oluşturduktan sonra metin düzeltici Kelime, yarat yeni belge Ve bir web sayfası olarak kaydedin, daha fazla bir Web sayfası oluşturmaya başlayın. İşimizi daha kolay ve daha iyi hale getirir. İçinde, web sitesinin oluşturulmasının zamanlamasını, hata ayıklamasını, konusunu ve doldurulmasını tanımlıyoruz.

Sitenin arayüzünün ziyaretçi tarafından anlaşılmasına izin veren birkaç basit kural vardır [№10].

1. Sitede faydasız bilgi olmamalıdır, yazı tipi kolayca okunmalıdır. Grafik öğeleri açık, etkileyici ve hızlı yüklenmiş olmalıdır.

2. İnsan gözü, site sayfalarını yukarıdan aşağıya doğru tarar. En büyük dikkat, sayfanın sol üst kısmına odaklanır. Bu nedenle, site sayfasının üstünde, bir kural olarak, en çok önemli bilgi: Şirket adı, logo, site adı vb.

3. Site ziyaretçisi, ilgilendiğiniz bilgileri kolayca bulmalı ve kapsamlı bilgi elde edebilmelidir (metin şeklinde ve birkaç fotoğraf biçiminde açıklama).

4. Bilgi gruplar tarafından dağıtılmalıdır. Başlık ve açıklamalar açısından malların aranması olasılığını sağlamak mümkündür.

5. Web sitesinde bilgi bölümleri olmalıdır:

Şirket hakkındaki verilerle (faaliyet alanı, adres, İletişim Telefon Numaraları vb.);

Web sayfalarının ana unsurları:

1. başlık / logo (kapak)

3. İçerik / içerikler (metin alanı)

4. Gezinme Elemanları

5. Site geliştiricileri hakkında bilgi

Herhangi bir web sayfası, her bir İnternet kaynağının zorunlu bileşenleri olan belirli bir standart öğe kümesi içerir.

Değerlendirmemiz gereken web sayfasının ilk unsuru başlığıdır. Sitenin logosu veya unvanı, herhangi bir kurumun girişindeki tabela olarak da aynı rolü gerçekleştirir. Başka bir şey internettir: burada hareket etmenin ana yolu ışınlanma, ve bu nedenle her sayfadaki bu "tabela" görmem gerekiyor.

Belgenin ana kısmı, sözde metin alanını alır - sayfanın anlamsal doldurmanın yerleştirildiği bir çizim: anlamlı bilgi metin ve resimler.

Listelenen elemanların "içerik" olarak da adlandırılır (İngilizce, İçerik - İçerik). Metin alanının konumu, öncelikle web tasarımcısının belgenin diğer elemanlarını nasıl yerleştireceğine bağlıdır.

Şekil 1. Örnek İçerik Sitesi

Web sayfasının bir sonraki zorunlu bileşeni parçası, navigasyon elemanlarıdır - bu belgeyi sitenin diğer bölümleriyle bağlayan köprüler. Gezinme elemanları, metin dizeleri, grafik nesneleri, yani, java uygulamaları gibi düğmeler veya aktif bileşenler şeklinde yapılabilir.

Belgenin alt kısmında, site geliştiricileri ve kaynağın ziyaretçilerinin kendi isteklerini, önerilerini ve isteklerini sahiplerine gönderebilecekleri e-posta adresi hakkında bilgi yayınlama alışılmıyorum. (İncir. 2)

Şekil 2. İletişim Bilgileri

Sitenizi oluşturmaya başlamadan önce, sayfaların düzen sorunu için çok sorumlu olacaktır. Genel olarak, web sayfası sayfalara, navigasyon ve ilgili bilgilere ayrılmıştır. Bu unsurlar sırayla daha küçük elemanlara ayrılmıştır.

Sonuç olarak, bir web sitesini geliştirme eylemlerinin sırası aşağıdaki basit algoritmaya aşağı iner:

1. Hedeflerin beyanı ve temel görevlerin tanımı.

2. Gelecekteki tematik bölümlerin bir listesini oluşturma.

3. Kaynağın mantıksal ve fiziksel yapısının geliştirilmesi.

4. Tasarım kroki, site düzenleri, görünmez sözlük tablosu hazırlanması.

5. Metin malzemelerinin hazırlanması.

6. Vektör formunda grafik malzemelerin hazırlanması.

7. Vektör çizimlerini raster formatına verin.

8. Tüm görüntülerin optimizasyonu.

9. Web sayfaları şablonları oluşturma.

10. Web sayfaları oluşturun ve hata ayıklama kodu oluşturun.

11. Web sayfalarını çeşitli ekran çözünürlüğü ve renk paleti ve çeşitli tarayıcılarla görüntüleme kimliğini kontrol etmek.

Web Tasarım Temelleri

Web Tasarım Temelleri

İnternetin gelişmesinin tarihi. Belarus'taki internetin ortaya çıkışı. Web tasarımı. Ortaya çıkmanın tarihi. W3C standartlarına uygun site tasarım gereksinimleri. Ana tarayıcılar. Site yapısı, disksikler ve etiketler.

İnternet ( ingilizce İnternet, birbirine bağlı ağlar - United Networks) - Dev bilgisayar ağıbirbirlerine çok sayıda daha küçük bir miktardan oluşan ve tüm dünyayı kapsayan.

İnternetin tarihi geçen yüzyılın ortasında başladı: 1957. Amerika Birleşik Devletleri'nde askeri gelişmelerle meşgul olan vaat eden gelişmeler (ARPA) ajansı yaratıldı.

1989'da Tim Berners-Lee, HTML dilini oluşturdu.

1961'de. ABD Savunma Bakanlığı'nın (Darpa - Savunma İleri Araştırma Ajansları), ABD Savunma Bakanlığı'nın görevinde olası araştırma ve geliştirme yönetimi, deneysel bir paket iletim ağı oluşturmak için bir projeye başladı. Bu ağ aradı Arappanet.Başlangıçta, çeşitli tiplerin bilgisayarları arasında güvenilir iletişimin sağlanması için yöntemler çalışması amaçlanmıştır.

Ocak ayında 1969 Birkaç dakika boyunca, Amerika Birleşik Devletleri'nin farklı uçlarındaki dört bilgisayar sistemi birkaç dakika boyunca başlatıldı. Düşük hızlı bir anahtarlama telefon hattı boyunca gerçekleşti.

İÇİNDE 1973 ArapPanet ile ilk kez, farklı ülkelerin bilgisayarları "iletilen". Ağ uluslararası hale geldi.

Ağ gelişimi hızla geçti. 1987'de, ana bilgisayar sayısı 10.000'i aştı. 1988'de Kanada, İzlanda, Danimarka, Norveç, Fransa, Finlandiya ve İsveç NSFnet'e bağlı. 1989'da, ana bilgisayar sayısı 100.000'i aştı. Ağ, İngiltere, Japonya, Almanya, Avusturya, İsrail, İtalya, Meksika, Yeni Zelanda, Hollanda'yı ağa bağladı. Rusya 1990'da ağa bağlı. Belarus da 90'lı yılların başında.

Bağlı kullanıcıların sayısı yıllık olarak hızlı bir şekilde artmıştır. 1995'te. Ağ, en büyük, dinamik ve uygun fiyatlı kitle iletişimi haline geldi.

Web tasarımı. Ortaya çıkmanın tarihi.

Web tasarımı (eng. Web tasarımı) - Bu, web sayfalarının görsel bir tasarımıdır. Site için aynı rolü, kağıt baskısı için baskı tasarımı ve yerleşimi olarak oynatır. Genellikle "Web Tasarımı" denilen web geliştirme denir: tasarım arayüzü (sitenin grafik ve metin içeriği), tasarım yapısı, navigasyon ve site motoru (seçilen bölüm) yazılım kodu Belirli bir uygulamalı görevi uygulamak için).

Şu anda, "Web Tasarımı" terimi, internet kaynağının ideolojik bütünlüğü, kullanıcılar için internet kaynağını kullanma kolaylığını sağlayan yapının tasarımını anlar. Web sitelerinin önemli bir parçası tasarımı, W3C standartlarına uygunluğudur (ENG. World Wide Web Consortium, World Wide Web Konsorsiyumu - Dünya çapında web için teknolojik standartlar geliştiren ve uygulayan bir organizasyon), insanlar için sitelerin kullanılabilirliğini sağlayan sınırlı fiziksel fırsatlar, ayrıca taşınabilir cihazların kullanıcıları için.

Ayrıca doğrudan tasarım siteleri ile internette bitişik pazarlama (internet pazarlaması), yani yaratılan kaynağın tanıtımı ve reklamcılığı, arama motoru optimizasyonu

Web tasarımı, grafik bileşenine dayanmasına rağmen, hala baskı tasarımından önemli ölçüde farklılık gösterir. Bu, her şeyden önce, Web sayfasının görsel görüntüsünün dinamik ve etkileşimi nedeniyledir.

Hemen hemen her web sayfasının köprüleri, navigasyon menüsü ve bilgi birimleri arasında geçişler sağlayan diğer öğeler vardır. Etkileşimli veri (yani, bazı eylemler gerektirenler ve bunlara cevap verenler) elemanları ve elektronik arayüzleri normal kitaptan, dergiden veya gazeteden ayırır.

Bir Web sayfası tasarlarken, bu öğeler anahtardır. Yetkili sayfa düzeninin geliştirilmesi, sitenin mantıksal yapısı ve navigasyon yollarının bir web tasarımına ve kullanılabilirliğine dayanmaktadır.

Yuzlik (İngilizce. Kullanılabilirlik - Kelimenin tam anlamıyla "Kullanım Kolaylığı", "Uygulanabilirlik") - bilgisayar teknisyeni Kullanılabilirlik süresi, kullanıcı tanımlı yazılım arayüzlerini geliştirme kavramıdır, kullanıcının maksimum psikolojik ve estetik kolaylığına yöneliktir.

W3C standartlarına uygun site tasarım gereksinimleri

Site tasarımı rahat olmalı , herhangi bir tarayıcıda açıkça görüntülenir. Sitenin uygun işlevselliği sağlayan orijinal bir grafik tasarımına sahip olmalıdır.

Site, navigasyon unsurlarının rahatlığını ve eksiksizliğini sağlamalıdır.

Temel bilgiler, menüler ve diğer navigasyon elemanları tamamen yatay kaydırma olmadan mevcut olmalıdır açık pencere Ekranı çözerken tarayıcı 1024x768 puan.

Tasarım (bilgi bloklarının yeri, görsel tasarım) Ana sayfa, sitenin stilini korurken tipik sayfaların tasarımından farklı olabilir.

Güzel grafik nesnelerin varlığı, site sayfalarının tasarımında küçük, ancak şık grafik elemanların (piktogramlar, görseller) kullanımı.

Küçük bir animasyon elemanının bir eklenmesi memnuniyetle karşılanır.

Sitenin tasarımı, grafik elemanların hacmi açısından "kolay" olmalı ve olası sayfa sayfalarının hızını sağlar.

Kullanıcının bulunduğu bölümü ve alt bölümün tanımlanması kolay olduğundan emin olun.

Önceden takılı flaş eklentisi olmayan bilgisayarlardaki bilgileri, komut dosyaları, grafikler, stil şablonları için devre dışı bırakılmış desteği olan bilgileri görüntülemek doğrudur.

Tasarım, sitenin yapısını geliştirme ve yeni bölümlerin ve alt bölümlerin kompozisyonuna dahil edilmesiyle geliştirme olasılığını sağlamalıdır.

Web tarayıcısı veya tarayıcı.

Halen, her kullanıcı "onun" tarayıcısını seçer. En popüler olanı Opera ve Firefox'tır. Onlar için Internet Explorer (yani).

Web tarayıcısı veya tarayıcı (İngilizce'den. İnternet tarayıcısı.) - bu yazılım Web sitelerini aramak, görüntülemek, yani web sayfalarını (çoğunlukla ağdan) istemek, bir sayfadan diğerine işlemek, çekilmek ve geçiş yapmak.

Çapraz tarayıcı sitesi, çeşitli tarayıcılarda görüntülerken mümkün olduğunca profesyonel ve yetkili bir sitedir. Site aşağıdaki tarayıcılarda doğru veri ekranı sağlamalıdır:

Internet Explorer (sürüm 5.5 ve üstü):

Opera (sürüm 7.0 ve üstü);

Mozilla Firefox (1.0 ve daha yüksek versiyon).

Sitenin doğru şekilde görüntülenmesi gereken monitörlerin ana renk modu - 15 renk deşarjı ve üstü (renk sayısı 65536 ve daha yüksektir).

Web Projesi Yapısının Geliştirilmesi

Projenin genel kavramına göre, Web projesinin hedefleri belirlenir ve görevler:

§ Veri yapısı, veritabanı tabloları arasındaki bağlantıların tanımı, dış kaynaklardan veri aktarma yapıları;

§ Veri otomasyon seviyesinin tanımı, veri yönetimi yapısının geliştirilmesi;

§ Formların özellikleri ve görünümleri için prosedür gerçekleştirilir;

§ Yapı kullanıcı arayüzü: menü öğeleri ve navigasyon elemanları gerekli yuvalama seviyeleri;

§ Projenin tasarım çizimlerinin gelişimi (seçenekler sayısını önceden onaylanmıştır).

Gelişme.

§ Tasarım: Sanatsal ve teknik çözüm. Orijinal bir site stili oluşturma: Renk çözümü, tasarım öğeleri, afiş, grafik elemanları üretimi;

§ Programlama: Yazılım öğeleri oluşturma;

§ Gezinme uygulaması onaylı proje modeli çerçevesinde;

§ Temel bilgi içeriği;

Html köprü metni işaretleme dili

• (İngilizce'den. Köprü Metni İşaretleme Dili - "Köprü Metni İşaretleme Dili") - Bu, Belgeler için standart bir etiketleme dilidir. Dünya çapında Ağ. Tüm web sayfaları HTML (veya XHTML) kullanılarak oluşturulur. HTML dili bir tarayıcı tarafından yorumlanır ve bir kişi için uygun bir belge biçiminde görüntülenir.
• XML ile birlikte, HTML genellikle "metin işaretleme dilleri" olarak sınıflandırılır. Aslında, bu iki dilin, "sadece metin" olarak adlandırılan formatın rolü ("düz metin") işleme ötesine geçiyor metin Bilgisi.
• Herhangi bir bilgisayar dilinin incelenmesi, ana inşaat blokları - operatörleri, ifadeler, değişkenleriyle tanışma ile başlar. Bu açıdan, HTML dili söylememek son derece kolaydır - ilkel: Sıradan bir metnin yanı sıra, HTML dosyası yalnızca bir tür kontrol tasarımını içerir, sözde etiketler (Etiketler).

Açısal parantez içinde mahkumlar kelimeler "<” и “>"HTML - tanımlayıcılar veya HTML etiketlerini arayın.

Web sayfasının temel bileşenleri

Ana navigasyon site paneli (menü). Alternatif menü ve çoğaltılan ana menü. Bağlantılar, link türleri ve onların yürütülmesi. Site tasarımının ana unsurları. Düzen sayfa sitesi. Renkli Yan Çözümü. Optimizasyon Web Grafikleri, Web sayfası için görüntü hazırlığı. Resimlerle çalışma ilkeleri.

Ana navigasyon site paneli (menü). Sitenin ana bölümlerine referansları içeren sitenin navigasyon paneli (ve belki de geçerli bölümün alt bölümlerinde), sitenin her sayfasında olmalıdır ve konumu değiştirilmemelidir; Kullanılabilirlik normlarının en brüt ihlali olun.

Genel olarak kabul edilir, gezinti panelini yerleştirmek için iki seçenek: Dikey olarak sol sütunda veya sayfa altbilgisindeki satırda. Genellikle, sol sütun ve üst dizge navigasyon panelini düzenlemek için kullanılan bu yöntemlerin bir kombinasyonunu bulabilirsiniz. Aynı zamanda B. Üst dizeKural olarak, geliştiricinin görüşüne göre en önemli referanslar, bölümler yerleştirilir.

Birkaç ana menü öğesi çoğaltılabilir alternatif menü. Ana yatay daha sonra dikey ise veya tam tersi ise.

Kullanılabilirlik normlarına göre, asla ve hiçbir durumda menü bağlantılarını yapamaz - İndirilebilir dosyalara, örneğin fiyata bağlantılar. Standart site sayfalarına yol açmayan tek şey - yazıttan önce gelmelidir: "İndir".

Menünün aktif kısmı (kullanıcının bulunduğu sayfa), renk gibi diğer öğelerden açıkça farklı şekilde tahsis edilmelidir.

Ziyaret edilen bölümler diğer renge ayrılmalıdır, böylece ziyaretçi nerede olduğu ve nerede olduğu yerlerde görülebilir.

Ana sayfaya bağlantı. Sitenin tüm sayfalarındaki ana sayfaya bir bağlantının olması çok arzu edilir. Genel kabul görmüş kural, bir ev biçimindeki ana sayfaya veya simgeye atıfta bulunarak bir site logosunun kullanımı idi.

Kullanılabilirlik Hoşgeldiniz yinelenen Ana Menüsayfanın sonunda.

Site tasarımının ana unsurları.

Tasarlamak - Özellik, verimlilik ve güzelliği birleştirmenin ilkelerine dayanan şeylerin, arabaların, iç mekanların tasarımıdır.

Grafik - Boyalar olmadan kontur çizgileri ve vuruşları olan nesnelerin sanat görüntüsü (bazen - renk lekeleriyle) (Ozhegov'un sözlüğü).

Grafik tasarımın ana fikri, estetik ilkeleri ve fonksiyonel görevleri bir tasarımda birleştirmektir. Birinin veya başka bir projenin başarısı büyük ölçüde uyumludur İç ilkelerGrafik tasarım oluştururken bir uzman tarafından yönlendirilir.

Web tasarımının ana görevi, web sitesinin sayfalarındaki bilgileri özümsemek için rahat bir atmosfer oluşturulmasıdır.

Web sayfalarının tasarımında evrensel çözüm mevcut değildir. Aşağıdaki unsurların geliştirilmesini içeren web tasarımı için tamamen farklı seçenekler:

Sitenin web sayfalarının düzeni;

Grafikler.

Düzen sayfa sitesi.

Web sayfası aslında belirli bir sırayla ortaya konan bir dizi dikdörtgen blok olarak kabul edilir. Bu durumda, kural olarak, veriler sütunlarda bulunur, bu nedenle düzen bir, iki-, üç sütunlu düzen terimi kullanıldığında.

Sitenin site düzeni, kullanıcı tarayıcısının genişliğine bağlı olarak otomatik sayfa ölçeklendirmesi sağlamalıdır. Tarayıcının çalışma alanının minimum boyutu (genişliği), tam teşekküllü bir sayfa ekranı (yatay kaydırma çubuğu olmadan), (yatay kaydırma çubuğu olmadan), 1024 pikseldir.

Renkli Yan Çözümü.

En belirsiz web tasarım öğelerinden birini renklendirin. Renk, bağlamı vurgulayabilir ve alabilir ve itebilir. Sitenin başarısı büyük ölçüde seçilen renk şemasına bağlıdır. Kullanılabilirlik ve web tasarımı alanındaki araştırmacılar, internet kaynağının ilk izleniminin renkli bir kompozisyona dayandığı ve kullanıcının hafızasında depolandığı ve bilgi içeriği olmadığı belirtilmektedir.

Etkili bir tasarım oluşturmak için, renk çözümleri seçimine uygulanan bir dizi gereksinimi dikkate almak gerekir:

Parlaklık, ton ve renk doygunluğu, şirketin markalı tarzına uygun olmalıdır;

Renk seçimi, bu kaynağın izleyicisine yönelmek için dikkate alınır;

Mümkün olduğunca kullanılan temel renklerin sayısı üçünü geçmemelidir;

Sitede kullanılan renkler birbirlerini etkileşime girmeli ve uyum sağlamalıdır;

Renk kullanımı, temel mantığın temel kurallarından sorumlu olmalıdır;

Ayrı bir öğe, metin için renk seçimini vurgulamaktır. Sayfanın arka planı ve metni, zıt renklerle süslenmelidir. En iyi anlaşılabilirlik, beyaz zemin üzerine siyah karakterler kullanılarak sağlanır. Metin arka plan ile birleştirilmemelidir ve başlıklar kaybolur.

Renk kararının, dosyalama malzemesi, içeriği, sitenin izleyicisi biçimine tekabül etmesi gerekir.

Optimizasyon Web Grafikleri, Web sayfası için görüntü hazırlığı. Resimlerle çalışma ilkeleri.

Grafiklerin kullanımı haklı olmalı, grafikler sitenin içeriğine açıkça uyumlu olmalıdır. Grafik ve animasyonun fazlası ana içeriğin dikkatini dağıtarak, saha ziyaretçilerinin dikkatini çekerek, sayfayı yüklemeyi zorlaştırır.

Site hızlı bir şekilde indirilmeli ve grafik, web sayfalarının ana hacmi tarafından işgal edilmektedir. Kilobaytlarda bir fotoğraf, A4 metninin metninden onlarca daha fazla zaman alır. Grafikler optimize edilmelidir! Bilgisayar indirilen dosyaları zaman kazanmak için geçici klasörlerde kaydettikçe tekrarlayan görüntüleri kullanmalısınız. Tekrarlanan bir görüntü, tüm sayfalarında sitenin bir "şapka" olarak hizmet verebilir.

Büyük resimler yerleştirmeniz gerekiyorsa - yeni tarayıcı penceresine ek bir tıklamayla programlı olarak açılarak açılmaları için yapabilirsiniz. Ancak varsayılan olarak, site kolay olmalıdır.

Ortalama sayfa yükleme süresi, 28.8 Kbps bağlantı hızında 30 saniyeyi geçmemelidir. İndirme süresini arttırmaya izin verilir bireysel sayfalar 35 saniyeye kadar, ancak sitenin toplam sayfa sayısının% 30'undan fazla değil. Ana Sayfa indirme süresi 40 saniyeden fazla olmamalıdır

Üzerinde web sayfası JPG, GIF ve PNG formatlarının grafik dosyalarını kullanabilirsiniz. GIF-Özel Ağ Formatı: Küçük bir dosya boyutuna, düzgün tezahür ve animasyon olasılığı ve saydamlık etkisi, resmi sayfada veya tablolarda "duvar kağıdı" olarak kullanmanızı sağlar. Ama çünkü GIF 256 renk paleti içerir, fotoğrafları depolamak için etkisizdir. JPG karşısındaki renk derinliğinde kısıtlamaları yok, aynı zamanda animasyon olasılığı yoktur. Yeni biçim Destekleyen Dosyalar ve Derinlik ve Şeffaflık -PNG, eski tarayıcıların görmediği bir dezavantajı var. Bu nedenle, eski programları olan kullanıcıları dikkate almazsanız, PINGIE sayfalarına dahil edilebilir. Sayfaya bir çizim eklemek için, bağlantıyı tanımlamanız gerekir:

nerede src ( s.oU. rce-kaynak) \u003d GIF, JPG veya bir resim içeren PNG formatında görüntü dosyası.
Align \u003d "özniteliği açmak için şeklin ve metnin karşılıklı düzenini ayarlayabilirsiniz:

Aşağıdaki hizalama türleri mümkündür:
Align \u003d "orta" - hattın merkezine göre
Align \u003d "sol" -Text, sağdaki resmi güçlendirir
Align \u003d "sağ" - aynı sol

Sol veya sağ hizalamayı kullanırken, IMG etiketinde etkinleştirebilirsiniz ek parametre Resmin etrafında ayrılın, böylece resim metninize yaklaşmamıştır. VSPACE \u003d "n" parametresi - bir girinti dikey ve HSPACE \u003d "n" - n piksel üzerinde yatay olarak oluşturur. Böylece, akan bir doğru metne sahip doğru yazılı etiket resimleri şöyle görünecektir:

Metin.

Sınırın son parametre genişliği. Anlamı olmadan mevcutsa ve basitçe bir kelime sınırı biçiminde, kaldırım, kendi isteğinizle bir tarayıcı tarafından çizilir ve örnekte olduğu gibi, değer genişliğini gösterir. Bu parametrenin sıfır değeri, dosya grafiksel bir köprü olarak hizmet ederse, kılık değiştirmesi için kullanılır.

Benzer bilgiler.