zondag 21 oktober 2012

Muse terminologie en web basics

Omdat ik niet gewend ben aan het maken van websites is voor mij een hoop van de terminologie nieuw. Ook weet ik niet zo heel erg veel af van webdesign. Hoewel je als gebruiker je natuurlijk wel eens ergert aan bepaalde dingen op een site.

Een rijtje met basale kennis die ik nodig blijk te hebben. Soms erg basaal en weet ik het ook wel, maar ik probeer zo volledig mogelijk te zijn.


Terminologie:
  • Home: Ik weet natuurlijk dat de home page de eerste pagina is en dat die meestal index.html heet.
  • Sibling page is een pagina op hetzelfde niveau.
  • Child-page is een pagina "eronder" een sub-pagina zou een ander woord ervoor kunnen zijn.
  • Hyperlink: een verwijzing naar een andere pagina of artikel.
  • Favicon: een klein logo dat naast de URL op de pagina verschijnt.
  • Content: de inhoud, hetgeen op de site staat.
  • Performs: o.a. de snelheid van binnenhalen.
  • Browser fill: hetgeen buiten de pagina wat in de browser te zien is. 
  • Page area: het gedeelte waarop de content van de pagina staat.
  • Toolbox: selecteer-, crop-, tekst-, zoom-, hand- en rechthoek-tool.
  • Controlpanel: laat mogelijkheden zien per tool verschillend.
  • Panels: panelen met widgets, kleuren, tekst mogelijkheden etc.
  • Header: kop met logo, titel en/of menu balk.
  • Foother: links naar social media e.d. 
  • Gutters: de afstand tussen kolommen
  • Page area: het gedeelte waaraan je content kunt toevoegen
  • Margin: een vrije ruimte, soort kantlijn in de site.
  • Padding is ook een vrije ruimte maar deze creëert ruimte boven de website waardoor je meer van de browser fill ziet.
  • Web fonts: lettertypes gepost door een bedrijf online: zoals Adobe Typekit. Op het moment dat de website geopend wordt wordt het font in de browser geladen via een script src="http://webfonts.creativecloud.com/de-walpergens-pica:n4:all.js.
  • Web save fonts: lettertype die eigenlijk op alle systemen wel geïnstalleerd is en daardoor te zien. (Denk aan arial).
  • System fonts: deze fonts worden door Muse omgezet naar een image (.PNG) zodat ze op de site te zien zijn. Te herkennen aan het logootje: een logo met een "T".



Footer en header guides zijn alleen op master pagina's te veranderen.

  • Letter space: afstand tussen de letters. Als je een heel woord selecteert worden alle letters uit elkaar geschoven. Ga je tussen 2 letters staan dan alleen daar plaatselijk.
  • Leading: onderlinge regelafstand (standaard %, maar je kunt ook px intypen).
  • Indent: Inspringen bovenste regel
  • Align justify: het uitvullen van een tekst waardoor er een blok ontstaat.
  • Inline Content: inhoud (afbeelding) die in een tekstvlak geplaatst is waardoor hij bij het verschalen meebeweegt. De afbeelding behoudt dus zijn plaats ten opzichte van de tekst.

Webdesign:
  • Muse maakt de site met vaste breedte gecentreerd in de browser: fixed width. De hoogte is afhankelijk van de content.
  • File size: de grootte van een bestand op de site. Om een bestand te kunnen zien moet het gedownload worden naar de computer; hoe kleiner de bestanden hoe sneller ze zijn. Dit kun je bij Photoshop > save for web helemaal zelf in de hand houden. 
  • Het is aan te raden de kleuren op alle pagina's gelijk te houden. Ook de navigatie niet van plaats veranderen omdat mensen dan moeten gaan zoeken.
  • navigatie snel, overzichtelijk en duidelijk maken en zorg dat de interactiviteit duidelijk wordt zodat mensen snel doorhebben waar deze te vinden is: in muse kun je dit regelen in je masterpage.
  • In de Footer en Header van een pagina kun je de dingen zetten die iedere pagina aanwezig moeten zijn.