Material Webdesign

Material Webdesign

Material Web-Design ist der neueste Trend. Seit Android 5.0 Lollipop regt sich auch einiges im Web Segment. Was ist nun Material Design: Material Design bringt Prinzipien von gutem Design sowie Fortschritt und die Möglichkeit Technologie und Wissenschaft in einer neuen visuellen Sprache zu vereinen. Der Begriff Material Design wurde vor allem durch Google geprägt. Das neue Konzept will vor allem eine Annäherung zwischen User Interface und der Realität schaffen.Es wird quasi das Flat Design adaptiert und die Farben, Icons und Strukturen werden dabei noch schlichter gestaltet. Zusätzlich wird dem ganzen mit Schatten oder leichten Animationen das Gefühl von Räumlichkeit eingehaucht.

Ich habe mich die vergangenen Tage mit Material Design und aktuellen Frameworks zu diesem Thema befasst und bin über Materialize gestolpert. Das Framework wirkt sehr aufgeräumt und durchdacht. Es bietet neben CSS auch SCSS. Javascript und Material Design Icons sind ebenfalls vorhanden, sowie Fonts, Buttons, Navigationen, Cards und Grids. Neben diversen Starter-Templates gibt es auch eine ausführliche Dokumentation. Sehr Empfehlenswert.

  <!DOCTYPE html>
  <html>
    <head>
      <!--Add materialize.css-->
      <link type="text/css" rel="stylesheet" href="css/materialize.min.css"  media="screen,projection"/>

 
      <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no"/>
    </head>

    <body>
      <!--Add jQuery before materialize.js-->
      <script type="text/javascript" src="https://code.jquery.com/jquery-2.1.1.min.js"></script>
      <script type="text/javascript" src="js/materialize.min.js"></script>
    </body>
  </html>

0 Kommentare