A feladat megoldásához a Sharepoint Designer 2007 programot használjuk, mely ingyenesen letölthető a Microsoft weboldaláról. Az érettségi aktuális szoftverlistája alapján az Expression Web 2, az Expression Studio 2, a DreamWeaver MX 2004, a Mozilla Composer 1.7 és az NVU 1.0 programokat használhatnánk még a feladat megoldásához. http://www.microsoft.com/DOWNLOADS/details.aspx?displaylang=hu&FamilyID=baa3ad86‐bfc1‐4bd4‐9812‐d9e710d44f42
Egyszerűbb a Google keresőbe beírni a Sharepoint Designer 2007 letöltés kulcsszavakat és az első találat erre a címre mutat.
FONTOS! A weboldal egy egyszerű szöveges állomány, vagyis a weboldalon megjelenő képeket a weboldalt tartalmazó mappába célszerű mentenünk, másolnunk. Így a feladat elkezdése előtt kell kiválasztani azt a helyet ahová a weboldalunkat mentjük és oda kell másolni a feladat szövegében szereplő képeket (jelen esetben a boly.jpg, hangyakep.gif, vorosh.jpg).
Indítsuk el a Sharepoint Designer 2007 programot.
A használat előtt beállíthatjuk milyen eszközöket szeretnénk használni. Amire nincs szükség azt bezárhatjuk az eszköz jobb felső sarkában lévő X jelre kattintva. Ha szükségünk volna egy eszközre azt a Munkaablakok menüpont segítségével jeleníthetjük meg a képernyőn.
Az index.html állomány létrehozásához mentsük el az alapból megjelenő üres weboldalt a Fájl menüpont Mentés parancsával abba a mappába, amit a megoldásnak létrehoztunk és ahová a forrás képeket átmásoltuk. Ügyeljünk arra, hogy alapértelmezetten htm kiterjesztésű állományt hoz létre a program, így célszerű begépelni a teljes fájlnevet: index.html. Így a megoldás mappában a 3 kép mellett megjelenik az index.html állomány is.
Az oldal háttérszínét és a szövegszínt beállítását a Fájl | Tulajdonságok… parancsra megjelenő Lap tulajdonságai ablak Formázás fülére kattintva tehetjük meg. A legördíthető menüben a További színek lehetőségeit kell választani.
Az Érték megadásánál kell a #F09838 kódot begépelni, majd az OK gombra kattintva a háttérszín megváltozik.
Hasonlóan kell eljárni a szövegszín módosításánál is, a #A03028 érték megadásával.
Táblázatot a Táblázat menüpont Táblázat beszúrás… parancsára megjelenő Táblázat beszúrás ablakban megadott, a szövegben szereplő alapadatokkal tudunk.
A táblázat bal oldali oszlopában jobb egér gombbal kattintva megjelenő gyors menüben a Cella tulajdonságai lehetőséget kell kiválasztani.
A megjelenő Cella tulajdonságai ablakban kell a Szélesség megadásánál a 150 képpontot beírni.
Képet beszúrni a Beszúrás | Kép | Fájlból… paranccsal lehet a kép kitallózásával. Vigyázzunk, hogy a megoldás mappában lévő képet használjuk. A beszúrás végrehajtásakor egy információt kérő ablak jelenik meg, melyben megadhatjuk, hogy milyen szöveg jelenjen meg, ha a képre visszük az egérmutatót. Jelen feladat nem kér ilyen beállítást.
OK gombra megjelenik a kép a bal oldali cellában. ENTER billentyű lenyomására új bekezdést létrehozva meg kell ismételni a műveletet még háromszor. A képre kattintva a középre igazítással igazíthatjuk középre a képet.
A hangya.txt állományt nem másoltuk át a megoldás mappába, így azt az eredeti forrás mappában találjuk. Itt megnyitva a Jegyzettömb lehetőséget kihasználva (Szerkesztés | Az összes kijelölése; Szerkesztés | Másolás) illeszthetjük be a Sharepoint Designer programba a szöveget (Szerkesztés | Beillesztés) a jobb oldali cellába kattintás után.
Mielőtt belekezdenénk a feladat végrehajtásába, alakítanunk kell a szövegen, mivel a Jegyzettömb sorvég jeleit le kell cserélnünk a Sharepoint Designer 2007 bekezdésjeleire. Ezt úgy tudjuk megoldani, hogy a szövegbe kattintva a Bekezdéstulajdonságot a Nincs értékről Bekezdésre módosítjuk, majd a szöveget a bekezdések mentén Enterek beszúrásával bekezdésekre bontjuk.
A cím – „Az erdei vöröshangya” – formázása a szövegszerkesztésben megszokott módon történik. Furcsaságot csak az okozhat, hogy a betűméretnél 7 konkrét méret közül választhatunk.
Ahhoz, hogy a böngésző keretén is a cím szövege jelenjen meg, először a kijelölése után vágólapra másoljuk (Szerkesztés | Másolás), majd a Fájl | Tulajdonságok… menüpontra megjelenő Lap tulajdonságai ablakban az Általános részben a Cím értékhez kell beilleszteni.
Először ki kell jelölni a „bolyokban” szót, majd ha a kijelölésen jobb egér gombbal kattintunk, a megjelenő gyors menüben a Hiperhivatkozás… lehetőséget kell választani.
A megjelenő Hipehivatkozás beszúrása ablakban vagy a listából kell kiválasztani a boly.jpg állományt, vagy a Cím mezőbe kézzel kell beírni a boly.jpg‐t.
A kép beszúrása előtt célszerű az első bekezdés után egy üres bekezdést létrehozni. Az üres bekezdésbe kattintva a már használt Beszúrás | Kép | Fájlból… paranccsal szúrjuk be a képet és a középre igazítással igazítjuk középre.
Az utolsó feladatnál a minta szerinti helyre létrehozunk egy üres bekezdést, majd egy táblázatot szúrunk be (Táblázat menüpont Táblázat beszúrás… parancsára megjelenő Táblázat beszúrás ablakban megadott, a szövegben szereplő alapadatokkal). A szín megadásánál nem szükséges a háttérszín kódját megadni, mivel a háttérszínnél megadott narancssárga szín szerepel a legutóbb használt színek listájában.
A táblázat beszúrása után a minta szerinti „Tudtad?...” kezdetű szöveget jelöljük ki és a Szerkesztés | Kivágás paranccsal való kivágás után illesszük be a táblázatba. A szöveg színét kijelölés után a feladatban megadott (a legutóbb használt színek listájában szereplő) #FFECC0 színkódra kell beállítani, illetve középre igazítani.
A „Tudtad?” bekezdés kettes szintű címsor stílusú legyen! feladatrész megoldásához két bekezdésre kell bontani a táblázatban lévő szöveget, vagyis először a bekezdéstípus értékét Nincs-ről Bekezdésre kell állítani. Majd a „Tudtad?” után egy Entert kell beszúrni, és a szövegbe kattintva a bekezdéstípus t a Bekezdés értékről Címsor 2-re kell állítani.
A feladat megoldása közben többször mentettünk ugyan, de szükség van még egy mentésre. A megoldás mappában duplán kattinthatunk az index.html állományon és az alapértelmezett böngészőben megtekinthetjük a végeredményt. Kész!