Kaip sukurti Nicepage svetainių kūrimo programoje kelionių svetainę pagal Photoshope esantį dizainą

Mes pristatome svetainių kurimo programą Nicepag“. Mes parodysime, kaip susikurti bet kokio sudėtingumo svetainę Nicepage programoje. Demonstravimui naudosime paruoštą svetainės dizainą, pavyzdžiui, „Adobe Photoshop“. Dizaino idėja, kurią norime įgyvendinti svetainėje, yra kairėje.

Temos nustatymai

Temos nustatymai. Sukurkite naują svetainę. Pridėti naują puslapį. Pradėsime nuo temos nustatymų. Tai labai patogu, nes spalvas, šriftus, šrifto dydžius ir tipografiją nustatome vieną kartą visam puslapiui ar net svetainei.

Image

Spalvų keitimas. Mes matome gradientą pavyzdyje kairėje, padarytą dviem spalvomis. Įprasta, kad spalvos naudojamos visame puslapyje, todėl yra patogu nukopijuoti spalvų reikšmes ir įtraukti jas į svetainių paletę. Nukopijuokite pirmąją spalvų vertę naudodamiesi spalvų rinkikliu ir pridėkite šią vertę į svetainės paletę. Nukopijuokite antrąją spalvos vertę ir pridėkite jos vertę į paletę.

Image

Šriftų keitimas. Tinkinkite tinklalapio antraštėse ir tekstuose naudojamus šriftus. Pažvelgę ​​į mėginį kairėje, mes matome, kokio dydžio ir svorio važiavimo pozicijos mums reikia. Nustatykite šrifto reikšmes. Pastaruoju metu, pridėdami šiuos teksto elementus prie skyrių, iškart gausime norimus rezultatus. „Nicepage“ HTML svetainių kūrimo priemonė taupo laiką. Nustatykite antraštes, tekstą ir hipersaitus.

Image

Baigėme savo svetainės temos nustatymus. Dabar mes einame prie sekcijų projektavimo.

Tinklelio skyrius

Stačiakampio naudojimas. Mes pradedame nuo įvado skyriaus. Padidinkite skyriaus aukštį. Pridėkite stačiakampį prie skyriaus fono. Viršutiniame meniu Pridėti Stačiakampis pasirinkite Pridėti-> Stačiakampis arba naudokite „R“ greitąjį klavišą. Pakeiskite stačiakampio dydį taip, kad jis apimtų pusę sekcijos aukščio. Pakeiskite spalvų užpildą į gradiento užpildą, kaip matome pavyzdyje kairėje.

Image

Pridedame tinklelį. Dabar skyriuje turime įdėti paveikslėlį ir tekstą. Vizualiai turinį galime padalyti į dvi dalis, todėl tam reikia konteinerių. Paprasčiausias būdas yra naudoti tinklelį su dviem vienodais langeliais. Pasirinkite Pridėti-> Tinklelis, tada tinklelį su dviem langeliais.

Image

Tinkleliai mobiliesiems ekranams. Tinklelis taip pat supaprastina prisitaikymo režimų nustatymą, nes siauruose ekranuose langeliai automatiškai pertvarkomi vienas po kito.

Vaizdo modifikavimas. Pakeiskite tinklelio dydį. Pasirinkite kairįjį langelį ir paspauskite DELETE mygtuką. Pasirinkite antrą langelį. Sutraukti vaizdą. Pakeiskite paveikslėlio dydį. Pakeiskite paveikslėlį, vilkdami jį iš darbalaukio arba vietinio aplanko. Padėkite jį ant numatytojo vaizdo ir atleiskite pelės mygtuką. Dešiniajame skydelyje įgalinkite šešėlį. Pakeiskite šešėlio nustatymus. Pakeiskite spalvą, neryškumą ir skaidrumą.

Image

Turinio pridėjimas. Pridėkite turinį prie kairiojo langelio. Bet kurį elementą galima pridėti iš meniu „Pridėti“ viršuje arba naudojant sparčiuosius klavišus. Pridėti eilutę. Pakeiskite linijos svorį ir plotį. „Control Resize“ atliekamas lengvai, traukiant valdymo žymeklius. Ji veikia taip pat, kaip „Microsoft Powerpoint“ ar „Apple Keynote“. Tai yra natūraliausias būdas. Pridėti pavadinimą. Pakeiskite pavadinimo tekstą. Padarykite tai dviem eilutėmis. Pridėti tekstą. Dabar pridėkime sąrašą dešinėje. Pridėkite pirmą eilutę.

Image

Langelių kopijavimas. Nukopijuokite kitus laikydami CTRL klavišą ir tempdami nukopijuotą valdiklį arba naudokite kontekstinį meniu. Valdymo elementų išdėstymas yra paprastas, taip pat ir tempiant.

Image

Pereikite prie kito skyriaus.

Persidengianti dalis

Tinklelio naudojimas. Pridėkite naują skyrių. Mes taip pat naudosime tinklelį. Jei norite, valdiklius galite įdėti be tinklelio. Tuo metu, reaguojantiems režimams, turėsite rankiniu būdu koreguoti vietą kiekvienam režimui, o tai nėra patogu. Padidinkite skyriaus aukštį. Pakeiskite tinklelio dydį. Išlyginkite tinklelį naudodami magnetus.

Image

Turinio keitimas. Pridėkime valdiklius prie tinklelio. Dešiniajame langelyje pakeiskite paveikslėlio užpildymą į „Fono spalvos užpildymas“. Pridėti eilutę. Pakeiskite eilutę. Pridėti antraštę 2. Pakeiskite antraštę. Ir tekstas. Pakeiskite lygiavimą į vidurinę dešinę. Pereikite prie kairiojo langelio. Sutraukite vaizdą fone. Pakeiskite numatytąjį vaizdą, vilkdami reikalingą iš aplanko.

1 stačiakampio pridėjimas. Mes įdėsime du paveikslėlius į stačiakampius. Pridėkite stačiakampį. Pakeiskite stačiakampio dydį. Pakeiskite užpildo spalvą į šviesiai pilką. Išdėstykite vaizdą virš stačiakampio naudodami įrankių juostos parinktį Išdėlioti.

Vaizdo modifikavimas. Matome, kad stačiakampis iš dalies sutampa su kaimyno langeliu ir nėra visiškai matomas. Išjunkite dešiniojo langelio užpildymą. Pakeiskite paveikslėlio dydį. Įgalinti šešėlį. Nustatykite šešėlio ypatybes: Nuokrypiai, suliejimas ir skaidrumas.

Image

2 stačiakampio pridėjimas. Pridėkite dar vieną stačiakampį. Perkelkite stačiakampį žemiau vaizdo, pasirinkdami parinktį „Išdėlioti“. Šis skyrius taip pat išsamus. Tai paprasta!

Skyrius su vaizdais

Turinio redagavimas. Pridėkite tuščią skiltį. Pakeiskite skyriaus dydį. Šiam skyriui mes taip pat naudosime tinklelį su dviem langeliais. Pakeiskite tinklelio dydį. Pakeiskite paveikslėlį dešiniojo langelio fone. Sutraukite kairįjį langelį, vilkdami vidurinę kraštą.

Turinio kopijavimas. Pasirinkite kairįjį langelį ir paspauskite DELETE mygtuką. Pridėti sąrašą taip, kaip buvo padaryta anksčiau. Nukopijuokite valdiklius laikydami CTRL klavišą ir vilkdami juos į paskirties vietą. Pakeiskite hipersaitus. Galiausiai pridėkite tekstą. Šis skyrius taip pat yra paruoštas.

Image

Galerijos skyrius

Iš anksto suprojektuoti skyriai. Pridėtame tuščiame skiltyje matome, kad šiame skyriuje yra galerija. Nicepage programa pateikia daugiau nei 1500 unikalių maketų, o dabar mes ieškosime ir naudosime vieną iš jų. Rezultatus galite filtruoti pagal reikiamą vaizdų ir (arba) kategorijų pavadinimus. Tai labai pagreitina procesą. Taip pat galime filtruoti pagal temines kategorijas. Pasirinkite panašiai atrodanti variantą. Pakeiskite sekcijos aukštį. Pakeiskite antraštės konteinerio plotį ir aukštį. Ištrinkite numatytąjį turinį.

Image

Turinio keitimas. Pridėti eilutę. Pakeiskite linijos plotį. Padarykite liniją storesnę. Pridėti antraštę 2. Pakeiskite antraštę 2. Sudarykite ją dviem eilutėmis. Sulygiuokite viršutinę kairę. Pasirinkite skyrių. Pakeiskite šios dalies spalvų užpildą į „Gradiento užpildą“. Pakeiskite gradiento spalvas. Pakeiskite tinklelio dydį. Perkelkite antraštę virš tinklelio. Padarykite liniją ir antraštę balta. Pakeiskite vaizdus, ​​vilkdami reikalingus iš vietinio aplanko.

Darbas su poraštė

Skyrių galerija. Pakeiskite poraštę. Galerijoje pasirinkite poraštės stilių. Pakeiskite stulpelių turinį. Sulygiuokite stulpelio viršų dešinėje.

Image

Darbas su langeliais. Nukopijuokite antrą langelį, laikydami CTRL klavišą prie trečiojo ir ketvirtojo. Pakeiskite tų langelių turinį. Pakeiskite vaizdą pirmame stulpelyje, vilkdami logotipą iš vietinio aplanko. Pridėkite logotipo teksto 4 antraštę.

Peržiūra mobiliųjų telefonų ekranuose

Peržiūrėkite puslapį prisitaikymo režimuose. Kompiuteris. Nešiojamas kompiuteris. Planšetė. Telefonas horizontaliai. Telefonas vertikaliai.

Image
© 2020 Nicepage.lt

Paieška