Monday, October 23, 2017

User Interface Testing

  • check responsive behaviour
  • resize the browser to 
    • normal 
    • narrow
    • wide
  • check any broken links
  • check the validation
  • check the page loading time esp images
  • check on various devices
    • android smartphone
    • iphone
    • windows phone
    • tablet galaxy series
    • ipad
    • blackberries
  • check by deleting css line ie <link rel="stylesheet"> ie without css support
  • check by disabling javascript
  • check in various browsers esp old ones ie before IE 4/  and new one
    • IE
    • firefox
    • chrome
    • safari
    • opera


CSS 2

  • liquid vs fixed layout?
  • float?
  • clear?
  • layout?
  • animation?
  • font?
  • what could be the browser support for CSS and how to find this out?
  • A jello layout is one in which the content width is fixed, but the margins expand and shrink with the browser
  •  absolute positioning
  • z-index
  •  when an element is absolutely positioned, it is removed from the normal flow of the page. 
  • position
    • static
    • absolute
    • fixed
    • relative
  • If you specify width in percentage then their size is flexible
  • Another common use for percentages is in specifying widths.  If you don’t need specific widths for your elements or margins, then you can use percentages to make both your main content area and your sidebars flexible in size.  You’ll see this done a lot in two- and three- column layouts. 
  • negative left property value
  • css special effetcs
  • fixed positioning vs absolute positioning vs static positioning
  •  border-collapse: collapse;
    • The border-collapse property is a special CSS   property for tables that allows you to combine cell borders into one border for a cleaner look
  •  .blueberry p { color: purple; } Here we’re selecting all paragraphs that are descendants of an element in the blueberry class.