Три једноставна начина за креирање веб странице: Водич кроз почетне кораке

Чланак написао:
  • Хостинг водичи
  • Ажурирано: Нов КСНУМКС, КСНУМКС

Креирање веб странице је супер у КСНУМКС-у.

Не морате да будете технички геек нити програмер.

Пратите прави метод. Изаберите праве платформе. Користите одговарајуће алате. Бићеш добар КСНУМКС%.

Имао сам нула знања у развоју веба када сам први пут започео онлине пословање у КСНУМКС-у. Нисам запослио веб програмера једанаест година касније. И добро сам.

Данас - имамо иновативне развојне алате и боље платформе за веб издаваштво.

Три једноставна начина за прављење веб странице:

Брзи линк:

  1. Стварање из нуле
  2. Коришћење система за управљање садржајем (ЦМС)
  3. Коришћење градитеља веб страница

Добијате више флексибилности у дизајну и функцијама сајта методом #КСНУМКС, али захтева добро познавање веб језика.

Процес креирања и управљања веб сајта је много лакши методом #КСНУМКС и #КСНУМКС. Требало би да изаберете неку од ових метода у зависности од ваше надлежности.

Ускоро ћемо погледати сваку од ових три методе.

Али пре него што почнете ...

Пре него што почнемо, требају нам двије ствари за вашу интернет страницу: КСНУМКС - Име домена и КСНУМКС-Веб хостинг.

КСНУМКС- Региструјте домен

Домен је име ваше веб странице. Мора бити јединствен и пренети бренд вашег пословања.

Најлакши начин за претраживање и регистрацију домена је отићи до регистратора домена.

Регистрар домена ће вам омогућити да региструјете своје име домена било путем годишњих уговора или дугорочног уговора.

Тражи и региструјте имена домена на Наме Цхеап.

Ево неких реномираних регистара домена које треба размотрити.

Регистратори Почетна цена
Са. Нето.
КСНУМКС Рег £ КСНУМКС £ КСНУМКС .КСНУМКС
Домаин.цом $ КСНУМКС / год $ КСНУМКС / год
Ганди € КСНУМКС / год € КСНУМКС / год
ГоДадди $ КСНУМКС / год $ КСНУМКС / год
Наме Цхеап $ КСНУМКС / год $ КСНУМКС / год
Нетворк Солутионс $ КСНУМКС / год $ КСНУМКС / год

Такође читати - Име домена за лутке.

КСНУМКС- Купите веб хостинг

A веб хостинг је велики рачунар (ака, сервер) који чува ваше веб странице. Неке огромне компаније - попут Амазон, ИБМ-а и ФБ-а, поседују и управљају својим веб серверима; остали послови једноставно изнајмљују своје сервере од хостинг провајдера (што је много јефтиније и лакше).

Напомена: Прескочите овај корак ако се одлучите да градитељ веб странице направи вашу страницу (погледајте корак #КСНУМКС).

Неке нове хостинг услуге које се могу провјерити.

Веб Хост Пријави се Примедбе
Хостинг АКСНУМКС $ КСНУМКС / Мо Брзи веб хост, љубазни новинари.
БлуеХост $ КСНУМКС / Мо Јефтина пријава цијена, невбиес пријатељски.
Хостгатор Цлоуд $ КСНУМКС / Мо Разумна цена, поуздан сервер.
ХостПапа $ КСНУМКС / Мо Еко-пријатељски веб хост, ексклузивни попуст.
Хостинг ИнМотион $ КСНУМКС / Мо Јефтина пријава цена, поуздан сервер.
СитеГроунд $ КСНУМКС / Мо Индустрија #КСНУМКС ливе цхат подршка, солид веб хост.

До данас смо се регистровали, тестирали и прегледали више од КСНУМКС хостинг компанија. Видите наше топ КСНУМКС хостинг изборима or потпуну листу прегледа хостинга.

Такође читати - Колико кошта изградњу веб странице.


ФТЦ Дисцлосуре

ВХСР прима накнаде за упућивање од неких компанија наведених у овом члану. Потребно је пуно труда и новца за стварање корисног садржаја попут овога - ваша подршка је високо цењена.


Једном када имате своје име домена и веб хостинг, време је да покренете рукаве и почнете стварати!

Метод #КСНУМКС: Креирање веб странице од огреботине

Потребне вештине и алати

Можете уништити своју јединствену и препознатљиву веб локацију само ако знате главне веб језике и основни сајт.

У супротном, препоручљиво је да прескочите метод #КСНУМКС / КСНУМКС; или, ступите у контакт са веб девелопером.

Основни језици / алати које требате знати:

  • ХТМЛ (Хипер Тект Маркуп Лангуаге)
    ХТМЛ је основна структура веб страница и веб апликација која чини семантички садржај веб претраживачу. Састоји се од секвенцијалних ознака које имају отварање и затварање, а структурно кључна реч коју уграђују углови кутије. Пример: <стронг> </ стронг>
  • ЦСС (Цасцадинг Стиле Схеетс)
    ЦСС је стилски језик који се користи за украшавање ХТМЛ ознаке веб странице. Без ЦСС-а, веб страница не би изгледала ништа осим велике беле странице која има неуређен текст и слику на њему. ЦСС је ствар која чини страницу идеално како желимо.
  • Скриптни језици
    ХТМЛ и ЦСС нису ништа без сцриптинг језика јер нису интерактивни. Да бисте направили динамичну веб страницу која ће одговорити на кориснике, требају се језици као што су ЈаваСцрипт и јКуери. Такође ће бити потребни језички језици као што су ПХП, Питхон и Руби током времена.
  • За управљање базама података
    За складиштење, управљање и приступ корисничким улазним подацима веб странице, сматра се велика табела информација која се назива база података. Систем управљања базама података као што су МиСКЛ, МонгоДБ и ПостгреСКЛ се користи на серверу како би се овај посао учинио ефикасно.
  • ФТП (Филе Трансфер Протоцол)
    ФТП се користи за лакше преношење изворних датотека на његов хостовани сервер. Постоје веб-базирани, као и ФТП клијенти засновани на рачунарском софтверу који се могу користити за уплоад својих датотека на серверски рачунар.

Процес креирања веб страница корак по корак помоћу ИДЕ-а

Ево преглед процеса како можете креирати веб страницу из прве руке, под претпоставком да знате основне веб језике и основне веб локације наведене горе.

Корак КСНУМКС: Подешавање локалног радног окружења

Снимак екрана радног окружења Сублине Тект.

Да би креирали и организовали изворне датотеке веб странице, важно је добро локално радно окружење. На рачунарском уређају можете креирати веб развојно окружење тако што ћете инсталирати ИДЕ (Интегратед Девелопмент Енвиронмент). ИДЕ се у основи састоји од текстуалног уређивача, аутоматизације и Дебугера.

Сублиме Текст и Атом су неке од основних ИДЕ-ова за веб развој који подржавају ХТМЛ, ЦСС, ЈС, ПХП, Питхон и сличне веб језике.

С друге стране, постоје проширени ИДЕ-ови Адобе Дреамвеавер који нуди неколико других функција (Ек: Сервер Цоннецтивити, ФТП).

Корак КСНУМКС: Планирајте и дизајнирајте свој веб сајт користећи Адобе Пхотосхоп

Планирана структура веб странице и навигациони систем су од великог значаја. Прво, морате схватити како желите да доставите свој садржај. Планирајте колико навигационих менија, колико колона или поља са садржајем, колико слика желите да укључите и где.

Најбоља пракса је отварање Адобе Пхотосхоп-а и стварање грубог цртања ваших веб страница. Можда ћете морати да направите различите грубе информације за различите странице, на пример, почетну страницу, страницу, контакт страницу, сервисну страницу итд.

Примери - дизајнирање моцк упс-а које смо урадили током обнове сајта у децембру КСНУМКС.

Корак КСНУМКС: Кодизирајте дизајн користећи ХТМЛ и ЦСС

Када завршите са прављењем грубих дизајна за своје веб странице у програму Адобе Пхотосхоп, можете започети писање изворних кодова.

Ово је најлакши део. Направите ХТМЛ ознаке за веб елементе које желите да укључите и користите ЦСС да бисте их украшавали према дизајну који сте направили.

Корак КСНУМКС: учините га динамичним помоћу ЈаваСцрипт-а и јКуери-а

Само веб сајтови засновани на ХТМЛ-у и ЦСС-у не постоје у модерним данима јер се интеракција фронт-енд корисника не може контролисати путем ХТМЛ-а или ЦСС-а.

Можете користити скриптне језике као што су ЈаваСцрипт и можда побољшана библиотека, јКуери за контролу активности корисника за форме, пријављивање, клизач, меније или гдје год вам је потребно.

Корак КСНУМКС: додајте локалне датотеке на сервер помоћу ФТП клијента

Последњи корак је да отпремите све своје изворне датотеке на веб сервер. Најбољи и најлакши начин руковања је преко ФТП клијента.

Прво, преузмите ФТП клијента на рачунарском уређају и повежите га са својим веб сервером помоћу ФТП налога. Након што сте је успешно повезали са ФТП налогом, копирајте све своје локалне датотеке у корен вашег веб директоријума. Неки добри ФТП клијенти су ФилеЗилла, ВинСЦП и Цибердуцк.


Метод #КСНУМКС: Креирање веб странице са ЦМС-ом

Потребне вештине и алати

  • Кнволедге: основно функционисање рачунара и интернета; ХТМЛ, ЦСС и ПХП (није обавезно, али боље ако знате основе)
  • Алати: УордПресс, јоомла, и друпал

Систем управљања ЦМС-ом или системом за управљање садржајем је изграђен тако да је тактички прилагођен новим почетницима на искусним веб девелоперима.

То је софтверска апликација која олакшава креирање и управљање онлајн садржајем. Већина њих је отвореног кода и слободна за коришћење.

Ако знате основе ХТМЛ-а, ЦСС-а или ПХП-а, за вас је повољан. То није велики проблем ако не знате јер су ове платформе веома интуитивне. Ево најбољих три слободна избора ЦМС платформи које можете изабрати према вашим потребама.

Брза поређења

УордПресс јоомла друпал
трошак бесплатно бесплатно бесплатно
Употреба КСНУМКС милиона КСНУМКС милиона КСНУМКС милиона
Бесплатне теме КСНУМКС + КСНУМКС + КСНУМКС +
Фрее Плугинс КСНУМКС + КСНУМКС + КСНУМКС +

Такође читати - Топ ЦМС у поређењу (КСНУМКС) - ВордПресс вс Јоомла вс Друпал

УордПресс

ВордПресс се, према различитим статистичким подацима, користи у максималном броју блогова и малих и средњих веб страница. Ипак, многи моћни велики сајтови више воле ВордПресс због своје једноставности. ВИСИВИГ Едитор је једина ствар коју морате научити како бисте слали свој први садржај.

Ова платформа је институционална за почетнике, као и развијају се од стране различитих класа веб програмера. Има много бесплатних додатака и тема на сопственом спремишту. Због тога што је #КСНУМКС ЦМС избор, пуно ресурса трећих лица је доступно са стране.

теме
Избор тема ВордПресса.

Прозодија

  • Изузетно флексибилан и прилагодљив
  • Једноставан за коришћење,
  • Тоне ресурса за учење,
  • Одлична заједница и подршка

Против

  • Потребан је код за главне визуелне прилагођавања
  • Ажурирања могу изазвати проблеме са додатцима

Сазнајте више

јоомла

Јоомла је на много начина слична ВордПрессу. Такође је једноставан за употребу, једноставан за инсталацију и лако се може проширити уз помоћ модула - еквивалентно ВордПресс плугинима. Као резултат тога, то су друге најбоље могућности за почетнике.

Међутим, почетници могу бити више застрашени да истраже Јоомла због броја доступних опција. Поред лијевог менија, налази се и мени на горњој траци изнад "Цонтрол Панел" логотипа. Да бисте избегли конфузију, запамтите да су неке од ставки из левог и горњег менија бар сличне, укључујући "Садржај", "Корисници" и "Екстензије".

Као и ВордПресс, Јоомла има неке стилове и шаблоне који могу брзо дати вашој страници карактеристичан изглед. Али из свих три система за управљање садржајем, Јоомла нуди најлакше решење када је у питању стварање друштвене мреже. Са платформама као што су ЕасиСоциал и ЈомСоциал, ви сте само неколико минута удаљени од ваше сопствене веб локације за друштвене мреже.

повлака
Унутар Јоомла система.

Прозодија

  • Технички напреднији
  • Веб странице обично раде боље
  • Сигурност на нивоу предузећа

Против

  • Модули су тешки за одржавање
  • Средишњи ЦМС - Није тако лако као ВордПресс, не тако напредан као Друпал

Више информација

друпал

Искусни веб девелопери потврђују да је Друпал најмоћнији ЦМС.

Међутим, то је и најтеже за коришћење. Због своје флексибилности, Друпал је други најчешће коришћени ЦМС на свету, али није омиљен међу почетницима. Да бисте успјешно изградили "потпуну" веб локацију користећи Друпал, морате руке запрљати и научити основе кодирања. Познавање начина на ЦМС-у је такође изазовно за почетнике.

Друпал
Инсталирање новог Друпала - упркос компликованим функцијама у Друпалу, ЦМС нуди једноставан, минималистички интерфејс.

Прозодија

  • Лако се учи
  • Велики портал помоћи
  • Ажурира се беспрекорно
  • Више уграђених опција

Против

  • Кривна кривуља учења на почетној фази - препоручује се за напредне кориснике

Више информација

Процес креирања веб-странице корак по корак користећи ВордПресс

За ову методу користићемо ВордПресс као пример. До сада би требало да имате веб хостинг рачун и регистровано име домена.

Корак КСНУМКС: Пронађите ВордПресс инсталатер на веб хостинг панели

Веб хостинг услуге обично имају брзи инсталатер за инсталирање ВордПресса и других заједничких платформи.

Зато се пријавите на свој веб хостинг рачун и сазнајте који инсталатер имате. Популарна имена која треба да тражите су Софтацулоус, КуицкИнсталл или Фантастицо.

Неки хостинг провајдери (пример: СитеГроунд) користите интегрисане инсталатере на својој корисничкој контролној табли (екран који видите одмах након пријаве на цПанел). У том случају, само покушајте да пронађете наслов који укључује 'ВордПресс'.

Пример: СитеГроунд цПанел контролна табла.

Корак КСНУМКС: Инсталирајте ВордПресс преко инсталатера

Софтацулоус је најпопуларнији ауто инсталатер и он је представљен на цПанел-у. Прећи ћу вас кроз инсталацију преко Софтцулоус-а. Остали инсталатори су прилично исти.

Кликните Софтацулоус, а затим кликните на 'Инсталирај' преко ВордПресс-а да започнете инсталацију.

Ево важног дијела.

Конфигуришите опције као што следи, оставите друга поља у подразумевану конфигурацију (ће се решити касније) и кликните на инсталирати.

  • Протокол: Морате одлучити хоће ли инсталирати хттп: // или хттп: // ввв. верзија УРЛ адресе. Шта год да одаберете, нећете видети много разлике. Са техничке тачке гледишта, хттп: // ввв. је боље у смислу флексибилности и управљања колачићима. Имајте на уму да ако имате важећи ССЛ сертификат и желите инсталирати ВордПресс на њега, само изаберите хттпс уместо хттп.
  • Домен: Изаберите домен на који желите да инсталирате веб локацију.
  • Директоријум: Одредите где желите инсталирати ВордПресс сајт. Ако желите да га инсталирате на свој роот УРЛ (нпр: хттп://ввв.иоурвебсите.цом/), држите је празно. Ако га желите на под-УРЛ-у (нпр: хттп://ввв.иоурвебсите.цом/миблог/), наведите директориј у пољу.
  • Админ налог: поставите своје корисничко име, лозинку и е-пошту коју ћете користити за пријављивање на своју ВордПресс страницу.

Ако сте успјели у посљедњим корацима, добро обављени. Ваша веб страница је уживо!

Сада се пријавите на свој ВордПресс сајт. Страница за пријављивање на вашем сајту ће изгледати као вп-логин.пхп заокружујући УРЛ адресу коју сте поставили.

Корак КСНУМКС: Инсталирајте тему и неке важне додатке

Затим морате инсталирати тему и неопходне додатке. Погледајте лево бочно дугме ваше ВордПресс контролне табле.

Постоје тоне бесплатних готова тема доступне у ВордПресс директоријуму.

Да бисте прегледали ове бесплатне теме, идите на 'Изглед> Теме »Додај нови', потражите тему која одговара вашим захтевима и кликните дугме за инсталирање.

Директоријум теме ВордПресс.

Можете такође инсталирати теме треће стране из одељка "Уплоад Тхеме". За плаћене, професионално дизајниране теме ВордПресса препоручујем Елегант Тхемес (за његову ефикасну шифру и предиван дизајн предњег краја).

За додатке, претражите 'Плугинс> Адд Нев'.

Претражите и инсталирајте додатке који су вам потребни. КСНУМКСrd Парти плугинс такође могу бити инсталирани из одељка "Уплоад Плугин".

Директоријум ВордПресс плугина.

Овде желим да вам предложи неколико важних бесплатних додатака. Претражујте по њиховим именима у директоријуму ВордПресс плугинс да их пронађете. Имајте на уму да је инсталација само једног додатка из сваке категорије довољна.

  • За СЕО: Иоаст СЕО, Све у једном СЕО Пацк
  • За безбедност: безбедност иТхемес, Вордфенце Сецурити
  • За статистику сајта: Јетпацк би ВордПресс.цом, Гоогле аналитика за ВордПресс помоћу Монстер Инсигхтс
  • За формирање форми: контакт формулар КСНУМКС
  • За перформансе: ВКСНУМКС Тотал Цацхе, ВП Супер Цацхе

Такође читати - КСНУМКС Ессентиал ВордПресс Плугинс за нове ВП сајтове

Корак КСНУМКС: Спремни сте!

Ваша веб страница треба да ради и покреће последњи корак. Али има још неколико ствари које треба разријешити.

  • Под 'Подешавања> Опште': подесите назив сајта и таглине.
  • Под 'Подешавања> Читање': Шта треба да прикаже ваша страница и колико постова за блог желите да прикажете на једној страници.
  • У одељку "Подешавања> Пермалинкс": Поставите која ће бити структура УРЛ-а у вашем блог посту.

Основне поставке за ново ВордПресс сајт.


Метод #КСНУМКС: Креирање веб странице са градитељима сајтова

Обавезна вештина и алат

  • Кнволедге: Основно функционисање рачунара и интернета
  • Алати: Вик и веебли

Градитељи сајта су учинили једноставним и брзим постављањем веб странице. Без знања о веб језицима, може се покренути његов потпуно доступан сајт у року од неколико минута. Они нуде градитеље драг & дроп-а који захтевају нулто знање кодирања.

Постоје многи градитељи сајтова распршени преко интернета - покривен је Диша КСНУМКС бесплатни сајтови у овом блогпосту; али не сви они могу задовољити потребе.

Следећа три су најпрометнији и потенцијални градитељи сајтова које можете користити.

Вик

Вик је један од најлакших сајтских произвођача на тржишту који садржи КСНУМКС + потпуно прилагођене шаблоне сортиране под различитим категоријама. Дакле, прилично је сигурно да ћете наћи ону која вам одговара.

Они нуде флексибилан Драг & Дроп уређивач странице који је увек видљив преко садржаја. Можете додати једну ставку са листе и отпустити је било где на веб локацији да бисте додали. Свака видљива ставка на њему може бити премјештена или уређена.

Једини недостатак је што постоје рекламе на сајту на Вик-овом бесплатном плану. Можете га решити тако што ћете га надоградити на свој Цомбо план, који вас враћа на минимум $ КСНУМКС / мјесец.

Такође читати - Наш детаљни преглед Вик-а.

веебли

Веебли је лакше на много начина, као што је навигација, једноставна употреба. Они нуде стотине шаблона за избор, али опције за персонализацију могу бити ограничене.

Имају добар број унапред дизајнираних поставки странице (на примјер: о страници, цјеновој страници, контакт страници) који се могу користити и модифицирати.

Драг & Дроп градитељ је лакше користити, али понекад сте ограничени на одређена подручја за прилагођавање. Доступност екстензија и апликација трећих лица је такође ограничена.

Такође читати - Наше дубинско истраживање Веебли.

Процес креирања веб страница корак по корак користећи Вик

Корак КСНУМКС: Пријавите се за Вик

Направите налог на Вик.цом.

Постоје КСНУМКС премиум планови и КСНУМКС бесплатни план (цијене се крећу од $ КСНУМКС - $ КСНУМКС / мо). Након успешног креирања сајта, видећете опције надоградње.

Погледајте Викове планове и цијене овде.

Вик пријава страница.

Препоручујем Вик основни плаћени план - Цомбо. Вик Цомбо план ($ КСНУМКС / мо) садржи бесплатан назив домена, више ЦПУ ресурса и Викове огласе.

Корак КСНУМКС: Изаберите шаблон

Вик ће вас питати како желите креирати веб страницу. Најбржи начин на који сугеришу је Вик АДИ (Умјетнички дизајнерски интелигенција) који на крају није много плодан.

Зато ћу вас проћи кроз мало дуже, али на бољи начин, веб дизајнера!

Видећете да постоје шаблони категорисани под различитим ознакама. Прегледајте своју будућу категорију и изаберите ону која вам одговара.

Након проналажења Вик теме коју волите, кликните на 'едит' да наставите.

Дугме "уређивање" се приказује када поставите миша на тему.

Корак КСНУМКС: Дизајнирајте своју веб страницу користећи Вик Вебсите Буилдер

После неколико тренутака, директно ћете пристати на свом интуитивном веб дизајнеру.

Дизајнирање веб странице је једноставно. Видјет ћете различите алате са лијеве стране и са десне стране екрана. Такође, кликните било гдје на веб локацији да бисте уредили блок или га премјестили на друго мјесто.

Изградите своје веб странице помоћу Вик уређаја за повлачење и спуштање.

Корак КСНУМКС: Објавите веб страницу

Када кликнете на дугме за објављивање, биће вам постављено питање да ли желите бесплатну поддомену или потпуно опремљену домену. То је твој позив.

Препоручујемо још неколико измена.

Идите на своју "Вик Дасхбоард> Управљајте & уређите сајт" и конфигурирајте СЕО, Фавицон, Социал и надоградње по потреби.

Конфигуришите Вик сајт. Кликните за увећање слике.

И када завршите са овим основним подешавањима - ваша страница је спремна.

Чланак Јерри Лов

Геек тата, СЕО дата јункие, инвеститор и оснивач Веб Хостинг Сецрет откривено. Јерри гради интернетску имовину и зарађује новац онлине од КСНУМКС-а. Он воли безумно лудило и пробати нову храну.