Kuidas luua veebisaiti Adobe Rooma projektiga
Adobe käivitas hiljuti projekti Rooma, mis on mõeldud omamoodi kõik-ühes sisu avaldamise platvormiks. Selle uuendusliku rakenduse abil saate luua veebisaite, printida projekte, interaktiivseid PDF-e ja palju muud.
Täna annan teile ülitäpse algaja tutvustamise Rooma, et saaksite näha, mis see on, kuidas seda kasutada ja kas see sobib teie jaoks või mitte.
Rooma
Adobe enda sõnul on Project Rome “lihtne, võimas ja kõik-ühes sisuloome loomine ja avaldamine praktiliselt kõigile.” Kui arvate, et see on pisut ebamäärane, on teil õigus. Kuid siis on kogu projekt pisut mõistatuslik. Kas Rooma on Photoshopi tulevik? Kas see on Dreamweaveri või InDesigni konkurents?
Vastus on tõesti “ükski eespool nimetatutest”. Pärast natuke sellega mängimist saab ilmseks, et Adobe üritab sihtida erinevat turgu kui Creative Suite. Kui CS on uskumatult kallis komplekt võimsaid ja professionaalseid rakendusi, mille põhjalikuks õppimiseks võib kuluda aastaid (aastakümneid?), On Rooma mõeldud rikas sisu loomiseks kasutajasõbralikuks viisiks kõigile.
Enne kui alustame, peaksite peatuma Rooma veebisaidil ja laadima alla töölauarakenduse või käivitama veebirakenduse (kasutan töölauaversiooni).
Kui palju see maksab?
Rooma on praegu saadaval tasuta eelvaatena. Ilmselt pole Adobe veel otsustanud oma hinnastrateegia üle ja soovib enne jätkamist teada saada, kuidas kasutajad reageerivad. Võite koopia kohe alla laadida, kuid lihtsalt teadke, et ühel päeval see tõenäoliselt desaktiveeritakse ja paneb teid ostma ühekordse litsentsi või isegi tellimuse.
Alustamine
Kui olete rakenduse alla laadinud, peaks selle käivitamisel ilmuma töölauale vertikaalne nuppude riba.
Siit saate sirvida vaikemallide või isegi kena kasutajate esitatud mallide galeriid, kuid neid on juba palju käimas, nii et parem on õppimise eesmärkidel alustada nullist.
Klõpsake nupul „Loo uus”, et avada üsna suur galerii võimalike dokumentide suurustest. Siit minge jaotisse “Ekraani tühi” ja valige kaustast “Brauseri suurused” midagi. Valisin 960 × 550.
Tutvuge Roomaga: liides
Kui Rooma liidest esmakordselt uurite, näeb see välja nagu Photoshopi äärmiselt lihtsustatud versioon. Lõputu kaubaaluste mere asemel on seal vaid paar. Tegelikult võib tunduda, et neid on liiga vähe. Selle põhjuseks on asjaolu, et Adobe näib katsetavat mõnda uut ideed, mis näitavad teile ainult seda, mida peate nägema, kui peate seda nägema, selle asemel, et anda teile kogu enchilada korraga.
Ülalolev pilt näitab, kui tühja ekraani võrreldakse sellega, millega oleme Creative Suite'is harjunud. Vaatleme lähemalt iga allolevat jaotist, kui sukelduda oma lihtsasse projekti.
Lehed
Saidil, mida me ehitama hakkame, on mitu lehte. Rooma viitab neile kui „lehtedele“ ja kuvab need vasakpoolses ülanurgas koos pisipiltide eelvaatega.
Esimene asi, mida me teha tahame, on luua põhileht. See võimaldab meil seadistada paar põhielementi, mis ilmuvad igal lehel. Selle asemel, et esemeid käsitsi panna igale lehele, kantakse põhilehel olevad üksused automaatselt üle ka teistele lehtedele. See võib alguses segadusse ajada, kuna näete lehel sageli elementi, mida te ei saa redigeerida. Selle põhjuseks on asjaolu, et kuigi üksus võib sellel lehel ilmuda, on see põhielement ja seetõttu peate enne redigeerimist valima põhilehe.
Põhilehe loomiseks klõpsake menüü „Vaade” nuppu „Näita põhilehti”. See peaks jagama teie lehtede menüü kaheks osaks: Lehed ja Põhilehed. Mõne tavalise lehe lisamiseks klõpsake nuppu väike pluss. Lehe pisipildi kõrval on väike Rooma ikoon, näete neid hajutatud liideses, mis näitab, et siin on peidetud kontekstitundlik menüü.
Selle väikese lendmenüü abil saate nimetada oma lehed Kodu, Teave, Portfell ja Kontakt.
Navigeerimismenüü
Kuna peame seda lihtsaks rakenduse sissejuhatuseks, saame navigatsioonimenüü koostamise abil näidata paljusid põhifunktsioone. Alustamiseks haarake tekstiriist ja joonistage kast. Seejärel tippige “Kodu” ja valige alloleva menüü abil soovitud font.
Siin näete tõesti seda menüü maagiat tegevuses. Siin on palju menüüvalikuid, igaühel neist on alammenüüd. See, mida saate, on palju funktsionaalsust ilma igasuguse segaduseta. See võtab kindlasti harjumist ja võib olla aeganõudev, kuid kui olete aru saanud, pole see nii hull. Mulle meeldivad väga väikesed liugurid, mida saab kasutada erinevate omaduste, näiteks kirjasuuruse, kohandamiseks.
Kui olete suuruse ja fondi välja mõelnud, minge alla menüüsse „Link“ ja määrake link lehele „Avaleht“.
See muudab lingi välimuse automaatselt sinise värviga koos allajoonimisega. Kuna me ei soovi kumbagi neist, peame selle parandama. Värvuse muutmine mustaks on piisavalt lihtne, kuid allajoonimist oli raskem leida. See suvand asub allpool näidatud menüüs “Rohkem tähemärgivalikuid”.
Hõljutage efekti
Järgmisena tahame muuta lingi välimust, kui kasutaja kursoriga kursorit selle kohal hõljub. See pole just intuitiivne protsess ja selle mõistmiseks kulus mul mõni minut.
Kui teie tekstkast on valitud, minge menüü „Täpsemad” jaotisse „Sündmuse sätted” ja aktiveerige „Tavalised sündmused”.
Nüüd peaks teil peamenüüs olema valik Sündmused. Siit minge jaotisse “Hiire sisestus” ja “Määra omand”. Järgmisena valige oma tekstiobjekt ja määrake atribuudiks Läbipaistmatus. Lõpuks määrake väärtus 50% -ni.
See timmib teksti 50% -ni selle algsest läbipaistmatusest, kui keegi selle kohal hõljub. Oleksin tahtnud lihtsalt värvi seada, kuid tundub, et seda võimalust sündmuste menüüs ei kuvata.
Probleem, millega nüüd kokku puutume, on see, et tekst muudab Hiire Enteri värvi, kuid jääb selliseks jäädavalt. Selle lahendamiseks peame lisama hiire väljapääsule veel ühe sündmuse, mis seab läbipaistmatuseks tagasi 100%. Vaata viidet allolevalt pildilt.
Kodulingi dubleerimine
Nüüd, kui meie esimene link on üles seatud täpselt nii, nagu me tahame, kopeerige ja kleepige see kolm korda, et luua lingid About, Portfolio ja Contact. Pidage meeles, et peate iga teksti jaoks valima teksti, seejärel minema sisse ja muutma linke, et osutada vastavatele lehtedele.
Samuti peate objektid vertikaalselt jaotama, et veenduda, et need asuvad ühtlaselt. Selleks valige kõik tekstikastid ja minge menüüsse Joonda.
Teie töö eelvaade
Kui soovite näha, kas teie navigeerimismenüü töötab korralikult, klõpsake ekraani ülaosas läheduses asuval esitamisnupul väikest monitorinuppu. See peaks teile reaalajas eelvaate saidil töötama.
Hõljutage kursorit linkide kohal ja veenduge, et need töötavad, ja klõpsake ringi, et näha, kas leht muutub.
Objektide palett
Nüüd, kui teil on lehel paar elementi, vaatleme objektide paletti. See on samaväärne kihtide paletiga, mida olete harjunud nägema teistes rakendustes, ja on põhimõtteliselt lihtsalt interaktiivne loend kõigist lehe elementidest.
Pange tähele, et see on palju lihtsam kui Photoshopi kihtide palett. Puudub maskeerimine, kihtidefektid jne.
Põhilehe viimistlemine
Kuna igal heal minimalistlikul saidil on klišeede ringi logo, ei saa meie lihtsalt ilma üheta jääda. Sellise kiire ülesvõtmine annab kujuvahendeid tunda. Pange tähele, et kujundite suurust saab täielikult muuta ilma pildi halvenemiseta. Rooma sobib suurepäraselt nii vektor- kui ka rasterobjektidega töötamiseks.
Ja sellega oleme oma põhilehe lõpetanud. Need elemendid ilmuvad igal lehel ilma täiendavate pingutusteta.
Saidi viimistlemine ja eksportimine
Nagu ma juba mainisin, võimaldas navigeerimine katta enamiku funktsioonidest, mida soovisin näidata. Seadsime üles lingid, paigutasime ja jaotasime objekte ning lõime hõljukiefektid.
Siit peaksite omaette ringi mängima ja ülejäänud lehed lõpetama. Proovige pilti kleepida, töötada teksti lõikudega ja võib-olla isegi ruudustikku ehitada. Enne sisu lisamist vali kindlasti sobiv leht, nii et sa ei jätkaks põhilehele lisamist.
Kui olete saidiga lõpetanud, on teil selle eksportimiseks kaks peamist võimalust. Esimene on Rooma sait. See laadib teie saidi teie Adobe ID abil Adobe'i hostitud serverisse (praegu tasuta). Sellegipoolest ei saa te sellega midagi teha, seega eelistan selle eksportimist SWF-i ja HTML-faili loomise valiku valimise.
See annab teile elava ja toimiva veebisaidi, mille olete ise loonud ilma untsi koodita!
Minu mõtted Rooma teemal
Nüüd tuleb see osa, mis teid tõeliselt huvitab, kas saate Roomat kasutada projektide tegemiseks? Sellele küsimusele vastamiseks vaatame plusse ja miinuseid.
Esiteks vaatame positiivset külge. Rooma on uuenduslik WYSIWYG, mis pole kaugeltki täiuslik, kuid tundub üsna lihvitud ja võimas. Õppimiskõver on CS-rakendustest palju väiksem ja see peaks kindlasti meeldima kõigile, keda see komplekt hirmutab. Lisaks saavutab see üha ebaseadusliku eesmärgi - lubada mittearendajatel luua tegelikult toimiv veebisait ilma ühe koodireata.
Hoolimata nendest eelistest, ei näe ma end kunagi Roomat veebiprojektide jaoks professionaalses kontekstis kasutamas. Suurim takistus on minu jaoks see, et see sõltub Flashist nii palju. Ma ei kavatse välklambiga pöörduda, kuid see on lihtsalt tehnoloogia ebapraktiline kasutamine, sõltumata sellest, kas te seda armastate või vihkate. Meie äsja üles ehitatud sait sisaldas ainult mõnda linki ja pilti. Pole absoluutselt mingit põhjust, miks tulemuseks olevad failid peaksid olema kõike muud kui puhas HTML ja CSS. Saan aru Adobest, kes soovib Flash-tugiteenuseid sisse ehitada, kuid ärge öelge, et saan selle tööriistaga veebisaite luua, kui teil pole isegi võimalust tavaliseks veebiväljundiks.
Pidage meeles, et see artikkel vaatles Roomat ainult veebi vaatepunktist. See võib siiski olla suurepärane trükimaterjalide ja interaktiivsete PDF-ide väljatöötamiseks. Tegelikult on see viimase jaoks tegelikult väga vinge tööriist.
Järeldus
Kokkuvõtteks võib öelda, et kui olete veebiarendusele täiesti võõras ja peate ise kiire veebisaidi üles ehitama ilma kedagi palgamata või 15 raamatut lugemata, siis vaadake Rooma. Seda on üsna lihtne kätte saada ja juhtida, olenemata teie asjatundlikkuse tasemest.
Kui olete aga kindla ja kasutajasõbraliku WYSIWYG-i turul, mis tegelikult loob professionaalse taseme veebisaite, vaadake meie juhendit Flux 3-st. Kui mõistate CSS-i, on Flux tapjarakendus ja ma pole leidnud ühtegi väärilist rivaali.
Jäta kommentaar allpool ja anna meile teada, mida sa arvad Project Rome'ist. Mida tegi Adobe selles katses õigesti? Mida nad valesti tegid? Me tahame sinust kuulda!
