Вэбсайт хэрхэн зохион бүтээх вэ (зурагтай)

Агуулгын хүснэгт:

Вэбсайт хэрхэн зохион бүтээх вэ (зурагтай)
Вэбсайт хэрхэн зохион бүтээх вэ (зурагтай)

Видео: Вэбсайт хэрхэн зохион бүтээх вэ (зурагтай)

Видео: Вэбсайт хэрхэн зохион бүтээх вэ (зурагтай)
Видео: ХИЕХ ба ХБЕХ олох, Ижил биш хуваарьтай бутархай нэмэх, хасах 2024, May
Anonim

Энэхүү wikiHow нь хэрхэн гөлгөр, мэргэжлийн харагддаг вэбсайт бүтээхийг танд заадаг. Та сайтынхаа дизайныг чөлөөтэй шийдэх боломжтой боловч вэбсайт хийхдээ хийх ёстой зарим чухал зүйлүүд байдаг.

Алхам

2 -р хэсгийн 1: Сайтын дизайныг бий болгох

Вэбсайт хийх алхам 1
Вэбсайт хийх алхам 1

Алхам 1. Вэбсайт бүтээгчийг ашиглахыг хүсч байгаагаа шийдээрэй

Вэбсайт эхнээс нь бий болгохын тулд HTML кодын талаар нарийвчилсан ойлголт шаардагддаг боловч та Weebly, Wix, WordPress эсвэл Google Sites гэх мэт үнэгүй хостингийн үйлчилгээг ашиглан сайт үүсгэж болно. Вэбсайт бүтээгчид шинэхэн дизайнеруудад HTML -ээс хамаагүй хялбар байдаг.

  • Хэрэв та өөрөө код бичихээр шийдсэн бол HTML болон CSS кодчиллыг сурах хэрэгтэй.
  • Хэрэв та өөрийн вэбсайт үүсгэхэд цаг хугацаа, эрч хүчээ зориулах дургүй байгаа бол вэбсайт зохион бүтээгчийг ажилд авах боломжтой. Чөлөөт дизайнерын үйлчилгээ нь маш олон янз байдаг бөгөөд зарим нь нэг цагийн төлбөр, зарим нь төсөл тус бүрийн төлбөрийн хувьд нийтдээ хэдэн саяас хэдэн арван сая рупи хүртэл байдаг.
Вэбсайт хийх 2 -р алхам
Вэбсайт хийх 2 -р алхам

Алхам 2. Сайтын газрын зураг үүсгэх

Вэбсайт бүтээгчийг нээхээс өмнө та сайт дээр хичнээн хуудас байгаа, хуудас тус бүрт ямар агуулга агуулагдаж байгааг, мөн "Нүүр хуудас", "Тухайн тухай" гэх мэт чухал хуудсуудын ерөнхий зохион байгуулалтыг тодорхойлох ёстой.

Сүүдэр биш барзгар зураг бүтээх замаар сайтынхаа хуудсыг төсөөлөхөд илүү хялбар байх болно

Вэбсайт хийх алхам 3
Вэбсайт хийх алхам 3

Алхам 3. Ухаалаг загварыг ашигла

Шинэ санаанууд ихэвчлэн сонирхолтой байдаг ч үндсэн загварууд нь эдгээр ерөнхий удирдамжийг дагаж мөрдөх ёстой.

  • Хөтчийн сонголтуудыг (жишээлбэл, өөр өөр хуудсуудад зориулсан олон таб) хуудасны дээд талд байрлуулах ёстой.
  • Хэрэв та цэсийн дүрс (☰) ашиглаж байгаа бол энэ нь хуудасны зүүн дээд буланд байх ёстой.
  • Хэрэв та хайлтын мөрийг ашиглаж байгаа бол хуудасны баруун дээд талд байрлуулна уу.
  • Хэрэгтэй холбоосууд (жишээлбэл, "About" эсвэл "Contact Us" хуудасны линкүүд) хуудасны доод талд байх ёстой.
Вэбсайт хийх 4 -р алхам
Вэбсайт хийх 4 -р алхам

Алхам 4. Тууштай байх

Текст, өнгөт палитр, зургийн сэдэв, дизайныг сонгохоос үл хамааран ижил шийдвэрийг сайтынхаа дагуу хэрэгжүүлээрэй. "About" хуудасны фонт, өнгөний схем нь нүүр хуудсанд ашиглагдаж байгаа загвараас эрс ялгаатай болохыг хэрэглэгчид гайхах болно.

  • Жишээлбэл, хэрэв та гэрийн хуудсандаа зөөлөн өнгө хэрэглэдэг бол дараагийн хуудсан дээр тод өнгө бүү ашигла.
  • Хурц эсвэл хоорондоо зөрчилдөж буй өнгийг, ялангуяа динамикаар харуулсан (эсвэл хөдөлж буй) өнгийг ашиглах нь цөөн тооны хэрэглэгчид таталт, эпилепси таталт үүсгэдэг болохыг анхаарна уу. Хэрэв та ийм өнгө хэрэглэхээр шийдсэн бол тухайн хуудасны өмнө "хураах эрсдэлтэй" гэсэн анхааруулгыг оруулаарай.
Вэбсайт хийх алхам 5
Вэбсайт хийх алхам 5

Алхам 5. Навигацийн сонголтыг нэмнэ үү

Нүүр хуудасны дээр чухал хуудсуудын шууд холбоосыг байрлуулах нь тэдэнд чухал ач холбогдолтой агуулгад шинээр зочлогсдод туслах болно. Ихэнх вэбсайт бүтээгчид энэ холбоосыг анхдагч байдлаар нэмдэг.

Сайтын бүх хуудсуудад зөвхөн хуудасны хаягаар хандахаас илүүтэйгээр тухайн сайт доторх сонголтыг дарж хандах боломжтой байх нь чухал юм

Вэбсайт хийх алхам 6
Вэбсайт хийх алхам 6

Алхам 6. Тохирох өнгийг ашигла

Бүх төрлийн дизайны нэгэн адил вэбсайтын дизайн нь тааламжтай өнгөний хослолоос хамаардаг. Тиймээс тохирох загварын өнгийг сонгох нь маш чухал юм.

Хэрэв та эргэлзэж байвал хар, цагаан, саарал өнгөөр эхэл

Вэбсайт хийх алхам 7
Вэбсайт хийх алхам 7

Алхам 7. Минималист загварыг анхаарч үзээрэй

Минималист үзэл баримтлал нь хүйтэн өнгө, энгийн график, цагаан дэвсгэр дээр хар текст хуудас, аль болох бага гоёл чимэглэл ашиглахыг дэмждэг. Минималист загвар нь маш цөөн элемент шаарддаг тул таны сайтыг хэт их хүчин чармайлтгүйгээр мэргэжлийн, сэтгэл татам харагдуулах хялбар сонголт юм.

  • Ихэнх вэбсайт бүтээгчид вэбсайт хийхдээ сонгох боломжтой "минималист" сэдвээр хангадаг.
  • Минималист хувилбар бол илүү хатуу үг, тод өнгө, тод текст, хамгийн бага графикийг ашигладаг "харгислал" юм. Минуталистуудаас харгис загварыг ашигладаг хэрэглэгчид хамаагүй цөөн боловч хэрэв агуулга нь зохистой байвал энэ загвар нь сайн сонголт байж болох юм.
Вэбсайт хийх алхам 8
Вэбсайт хийх алхам 8

Алхам 8. Өвөрмөц сонголтуудыг ашиглах

Сүлжээ ба шулуун шугамын элементүүд нь аюулгүй сонголт боловч зарим өвөрмөц хэв маяг нь хувийн мэдрэмжийг нэмж, таны сайтыг бусдаас ялгарах болно.

  • Сайтын тэгш бус элементүүдийг байрлуулах эсвэл давхарласан харагдах байдлыг бий болгохын тулд овоолсон элементүүдийг ашиглах замаар чиг хандлагыг өөрчлөхөөс бүү ай.
  • Хэдийгээр гоёмсог, хурц үзүүртэй дөрвөлжин элементүүд (картанд суурилсан танилцуулга гэж нэрлэдэг) нь зөөлөн, бөөрөнхий элементүүдээс хамаагүй бага хүсдэг.

2 -р хэсгийн 2: Сайтын гүйцэтгэлийг нэмэгдүүлэх

Вэбсайт хийх алхам 9
Вэбсайт хийх алхам 9

Алхам 1. Машины оновчлолын сонголтуудын давуу талыг ашиглах

Хөдөлгөөнт хөтчүүд нь ширээний хөтчүүдээс илүү их урсгалыг авчирдаг. Энэ нь таны гар утасны хувилбарт анхаарлаа хандуулах нь наад зах нь ширээний сайтыг хөгжүүлэхтэй ижил байх ёстой гэсэн үг юм. Ихэнх авто бүтээгч вэбсайтууд аль хэдийн машины хувилбарыг гаргасан боловч гар утасны сайтуудын хувьд дараах мэдээллийг санаж яваарай.

  • Товчнууд (жишээлбэл, сайтын холбоосууд) том хэмжээтэй бөгөөд товшиход хялбар эсэхийг шалгаарай.
  • Хөдөлгөөнт төхөөрөмж дээр харагдах боломжгүй функцуудаас зайлсхийх хэрэгтэй (жишээлбэл Flash, Java гэх мэт).
  • Танай сайтад зориулж автомашины аппликейшн бүтээх талаар бодож үзээрэй.
Вэбсайт хийх алхам 10
Вэбсайт хийх алхам 10

Алхам 2. Нэг хуудсанд хэт олон зураг оруулах хэрэггүй

Ширээний болон гар утасны хөтчүүд заримдаа олон зураг эсвэл видео бүхий хуудсыг ачаалахад бэрхшээлтэй байдаг. Вэб дизайнд зураг маш чухал ач холбогдолтой боловч нэг хуудаснаас хэт их хэмжээний хэвлэл мэдээллийн хэрэгсэл ачаалах хугацааг уртасгадаг бөгөөд энэ нь хэрэглэгчдийг тэдгээр хуудсуудад зочлохоос сэргийлдэг.

Ерөнхийдөө хуудсыг ачаалахад дөрвөн секундээс бага хугацаа шаардагдана

Вэбсайт хийх алхам 11
Вэбсайт хийх алхам 11

Алхам 3. "Холбоо барих" хуудсыг нэмнэ үү

Ихэнх сайтууд холбоо барих мэдээлэл (утасны дугаар, имэйл хаяг гэх мэт) агуулсан "Бидэнтэй холбоо бариарай" хуудсыг өгдөг болохыг та анзаарч магадгүй юм. Үнэн хэрэгтээ зарим сайтууд энэ хуудсан дээр автоматжуулсан лавлагааны маягтыг өгдөг. "Холбоо барих" хуудас нь сайтын зочид болон таны хоорондох шууд харилцаа холбоо бөгөөд энэ нь зочны асуулт эсвэл бухимдлыг арилгах шийдэл юм.

Вэбсайт хийх алхам 12
Вэбсайт хийх алхам 12

Алхам 4. Захиалгат 404 хуудас үүсгэх

Зочин бүтээгдээгүй эсвэл байхгүй байгаа тодорхой хуудсанд ирэхэд "404 Error" хуудас гарч ирнэ. Ихэнх хөтчүүд 404 хуудсыг суурилуулсан боловч вэбсайт бүтээгчийн тохиргооноос хэрхэн харагдахыг өөрчилж болно. Хэрэв та өөрчлөн тохируулсан 404 хуудас үүсгэхийг хүсвэл дараах дэлгэрэнгүй мэдээллийг оруулна уу.

  • Хөгжилтэй, хөгжилтэй алдааны зурвасууд (жишээ нь, "Баяр хүргэе, та алдааны хуудсанд орсон!")
  • Нүүр хуудас руу буцах холбоос
  • Зочид ихэвчлэн хардаг линкүүдийн жагсаалт
  • Таны сайтын зураг эсвэл лого
Вэбсайт хийх алхам 13
Вэбсайт хийх алхам 13

Алхам 5. Боломжтой бол хайлтын мөрийг оруулна уу

Хэрэв таны ашиглаж буй вэбсайт бүтээгчийн арга нь хайлтын талбар нэмэхийг дэмждэг бол үүнийг нэмэхийг зөвлөж байна. Энэ нь хэрэглэгчид навигацийн бүх сонголтыг дарахгүйгээр хүссэн хуудас эсвэл агуулгаа хайж олох боломжтой болно.

Хайлтын талбар нь зочдод санамсаргүй хуудсуудыг бичихгүйгээр нийтлэг нэр томъёог хайхыг хүсэхэд маш хэрэгтэй байдаг

Вэбсайт хийх алхам 14
Вэбсайт хийх алхам 14

Алхам 6. Нүүр хуудсанд илүү их анхаарал хандуулаарай

Нүүр хуудас руу зочлогчид танай сайтын сэдвийг олж авсан байх ёстой. Нэмж дурдахад, нүүр хуудасны бүх элементүүд, түүний дотор навигацийн сонголтууд болон зургууд хурдан ачаалагдах ёстой. Нүүр хуудас нь мөн дараахь зүйлийг агуулсан байх ёстой.

  • Үйлдэл рүү залгах (жишээлбэл, дарах товч эсвэл бөглөх маягт)
  • Хэрэгслийн самбар эсвэл навигацийн цэс
  • Урилга график (хатуу зураг, видео эсвэл нэмэлт текст бүхий олон зураг гэх мэт)
  • Таны сайтын үйлчилгээ, сэдэв эсвэл анхааралтай холбоотой түлхүүр үгс
Вэбсайт хийх алхам 15
Вэбсайт хийх алхам 15

Алхам 7. Өөр өөр хөтөч, платформ дээр сайтаа туршиж үзээрэй

Энэ нь маш чухал юм, учир нь хөтөч нь вэбсайтын талыг янз бүрийн аргаар боловсруулдаг. Сайтаа сурталчлахаасаа өмнө Windows, Mac, iPhone, Android платформ дээрх дараах хөтөч дээр сайтаа нээж, ашиглаж үзээрэй.

  • Гүүгл Кром
  • Firefox
  • Safari (зөвхөн iPhone болон Mac дээр)
  • Microsoft Edge ба Internet Explorer (зөвхөн Windows)
  • Зарим Андройд утасны үндсэн хөтөч (Samsung Galaxy, Google Nexus гэх мэт)
Вэбсайт хийх алхам 16
Вэбсайт хийх алхам 16

Алхам 8. Сайтыг байнга шинэчилж байгаарай

Загварын чиг хандлага, линк, гэрэл зураг, ойлголт, түлхүүр үг байнга өөрчлөгдөж байдаг. Тиймээс та ч гэсэн цаг үетэйгээ хөл нийлүүлэн алхахын тулд үргэлж өөрчлөлт хийх ёстой. Та сайтынхаа гүйцэтгэлийг шалгаж, гурван сар тутамд дор хаяж нэг удаа ижил төстэй сайтуудтай харьцуулж үзэх хэрэгтэй (илүү зохимжтой).

Зөвлөмж

  • Вэбсайт хөгжүүлэхэд хүртээмжтэй байдал нь мөн адил чухал тал юм. Хүртээмжтэй байдал нь сонсголын бэрхшээлтэй зочдын тайлбар, харааны бэрхшээлтэй зочдод зориулсан аудио тайлбар, танай сайт таталт өдөөж болзошгүй нөлөө үзүүлсэн тохиолдолд гэрэл мэдрэмтгий байдлын анхааруулгыг агуулдаг.
  • Вэбсайт бүтээгчдийн ихэнх нь хүссэн элементүүдийг нэмэхээсээ өмнө зохион байгуулалт, дизайныг тодорхойлохын тулд ашиглаж болох загваруудыг өгдөг.

Анхааруулга

  • Ихэнх бүтээгч сайтууд үнэ төлбөргүй байдаг, гэхдээ хэрэв та өөрийн домэйныг ашиглахыг хүсвэл ("www.yourname.wordpress.com" гэхийн оронд "www.yourname.com" гэх мэт) сар бүр жилийн төлбөр төлөх шаардлагатай болно.
  • Хулгай хийхээс зайлсхийж, зохиогчийн эрхийн бүх хуулийг мэдэж аваарай. Зөвшөөрөлгүй интернет эсвэл бүтцийн элементүүдээс санамсаргүй зураг оруулахгүй байх.

Зөвлөмж болгож буй: