Scribd Logo
Upload

Welcome to Scribd!

  • 244 views

    Web Site Design Principles

    Uploaded by

    dr gawdat
    This document outlines principles for web site design, including designing for the computer medium, creating a unified site design, and designing for the user. Some key principles discussed are designing across platforms so the site works on different browsers and devices, planning for low bandwidth so pages load quickly, using a grid structure and white space for visual design, and designing pages considering whether users will read or scan the content. The document provides examples of how to design pages for reading versus scanning and how to guide users' eyes through a site based on reading or scanning patterns.

    Copyright:

    Attribution Non-Commercial (BY-NC)
    Download as PDF or read online from Scribd

    Web Site Design Principles

    Uploaded by

    dr gawdat
    244 views22 pages
    This document outlines principles for web site design, including designing for the computer medium, creating a unified site design, and designing for the user. Some key principles discussed are designing across platforms so the site works on different browsers and devices, planning for low bandwidth so pages load quickly, using a grid structure and white space for visual design, and designing pages considering whether users will read or scan the content. The document provides examples of how to design pages for reading versus scanning and how to guide users' eyes through a site based on reading or scanning patterns.

    Copyright

    © Attribution Non-Commercial (BY-NC)

    Available Formats

    PDF or read online from Scribd

    Did you find this document useful?

    Is this content inappropriate?

    This document outlines principles for web site design, including designing for the computer medium, creating a unified site design, and designing for the user. Some key principles discussed are designing across platforms so the site works on different browsers and devices, planning for low bandwidth so pages load quickly, using a grid structure and white space for visual design, and designing pages considering whether users will read or scan the content. The document provides examples of how to design pages for reading versus scanning and how to guide users' eyes through a site based on reading or scanning patterns.

    Copyright:

    Attribution Non-Commercial (BY-NC)
    Download as PDF or read online from Scribd
    Download as pdf
    244 views22 pages

    Web Site Design Principles

    Uploaded by

    dr gawdat
    This document outlines principles for web site design, including designing for the computer medium, creating a unified site design, and designing for the user. Some key principles discussed are designing across platforms so the site works on different browsers and devices, planning for low bandwidth so pages load quickly, using a grid structure and white space for visual design, and designing pages considering whether users will read or scan the content. The document provides examples of how to design pages for reading versus scanning and how to guide users' eyes through a site based on reading or scanning patterns.

    Copyright:

    Attribution Non-Commercial (BY-NC)
    Download as PDF or read online from Scribd
    Download as pdf
    of 22

    Web Site Design Principles

    ‫أﺳس ﺗﺻﻣﯾم ﻣواﻗﻊ اﻟوﯾب‬


    By : Dr. Mostafa gawdat
    www.mostafa-gawdat.net
    ‫ﻟﻧﺑدأ ﺗﺻﻣﯾﻣﻧﺎ اﻷول‬
    ‫ﻗﺑل أن ﻧﺑدأ ﺗﺻﻣﯾﻣﻧﺎ اﻷول ﯾﺟب أن ﻧﺗﻔق ﻋﻠﻰ ﻋدة‬ ‫‪‬‬
    ‫أﺳس ﻧﺗﺑﻌﮭﺎ‪.‬‬
    ‫ﻓﻠﻧﺗﻔق أوﻻ ً‬
    ‫ﻧﺣن ﻧﺻﻣم ﻣﺎدة ﻛﻣﺑﯾوﺗرﯾﺔ‬ ‫‪‬‬
    ‫‪ Design for the computer medium‬‬
    ‫ﻧﺣﺗﺎج ﻟﻌﻣل ﺗﺻﻣﯾم ﻣوﺣد ﻟﻠﻣوﻗﻊ ﻛﻛل‬ ‫‪‬‬
    ‫‪ Create a unified site design‬‬
    ‫ﻣراﻋﺎة اﻟﻣﺳﺗﺧدم ) اﻟﺟﻣﮭور( ﻓﻲ ﺗﺻﻣﯾﻣﻧﺎ‬ ‫‪‬‬
    ‫‪ Design for the user‬‬
    ‫ﻧﺣن ﻧﺻﻣم ﻣﺎدة ﺗﻌرض ﻋﻠﻰ اﻟﺷﺎﺷﺔ وﻟﯾس ﻣﺎدة‬ ‫‪‬‬
    ‫ورﻗﯾﺔ أو ﻣﻠﺻﻘﺎت‬
    ‫‪ Design for the screen‬‬
    ‫ﺗﺻﻣﯾم اﻟﻣواد اﻟﻛﻣﺑﯾوﺗرﯾﺔ‬
    ‫‪ ‬راﻋﻲ أن ﯾﻌﻣل ﺗﺻﻣﯾﻣك ﻋﻠﻰ ﻣﻧﺻﺎت ﻋﻣل ﻣﺗﻌددة )‬
    ‫ﻣﺳﺗﻌرﺿﺎت ﻣﺗﻌددة (‬
    ‫‪ Design for Cross Platform‬‬
    ‫‪ ‬راﻋﻲ أن ﻻ ﯾﺳﺗﮭﻠك ﺗﺻﻣﯾﻣك ﺳﻌﺔ ﻧطﺎق اﻟﺷﺑﻛﺔ‪.‬‬
    ‫‪ Design for low bandwidth‬‬
    ‫‪ ‬ﺧطط ﻟﺗﺻﻣﯾم واﺿﺢ ﯾﺳﮭل ﻣﻌﮫ اﻟوﺻول إﻟﻰ‬
    ‫ﻣﻌﻠوﻣﺎﺗك‪.‬‬
    ‫‪ Plan for clear presentation and easy‬‬
    ‫‪access to your information‬‬
    ‫اﻟﺗواﻓق ﻣﻊ ﻣﻧﺻﺎت ﻋﻣل ﻣﺗﻌددة‬
    ‫ ﻣوﻗﻌك اﻹﻟﻛﺗروﻧﻲ ﯾﺟب أن ﯾﻌﻣل ﺑﺷﻛل ﺻﺣﯾﺢ ﺑﻐض‬
    ‫اﻟﻧظر ﻋن اﻟﻣﺳﺗﻌرض أو ﻧظﺎم اﻟﺗﺷﻐﯾل أو ﻧوع ﺟﮭﺎز‬
    .‫اﻟﻛﻣﺑﯾوﺗر‬
     Your Web should be accessible across
    different browsers, operating
    systems, and computer platforms
    .‫ اﺧﺗﺑر دوﻣﺎ ﺗﺻﻣﯾﻣك ﺣﺗﻰ ﻟو ﻛﻧت واﺛﻘﺎ ﻣﻧﮫ‬
     Remember to test your work even
    when you feel confident of your
    results
    ‫ﻣراﻋﺎة ﺳﻌﺔ ﻧطﺎق اﻟﺷﺑﻛﺔ‬
    ‫ﯾﺟب اﻟﻼ ﯾﺳﺗﻐرق ﺗﺣﻣﯾل اﻟﺻﻔﺣﺔ أﻛﺛر ﻣن ‪ ٧‬ﺛواﻧﻲ‬ ‫‪‬‬
    ‫‪.7 Second Rule‬‬
    ‫ﯾﻔﺿل أن ﻧﺻﻣم ﺻﻔﺣﺗﻧﺎ ﻟﺗﺗﻔق ﻣﻊ اﻟﺳرﻋﺎت اﻟﻣﺧﺗﻠﻔﺔ‬ ‫‪‬‬
    ‫ﻟﻺﻧﺗرﻧت‪.‬‬
    ‫‪ Plan your pages so that they are‬‬
    ‫‪accessible at a variety of connection‬‬
    ‫‪speeds.‬‬
    ‫راﺟﻊ اﻟﺗﺻﻣﯾم اﻟﺗﺎﻟﻲ‬
    ‫ﺗﺣدﯾد اﻟﺷﻛل وأﺳﻠوب اﻟﻌرض‬

    ‫راﻋﻲ ﺗوﺣﯾد اﻟﺳﻣﺔ واﻟﺑﻧﯾﺔ ﻓﻲ ﺗﺻﻣﯾﻣك‪.‬‬ ‫‪‬‬


    ‫‪ Plan with unifying themes and‬‬
    ‫‪Structures‬‬
    ‫اﺳﺗﺧدم اﻟﺧطوط اﻟطوﻟﯾﺔ واﻟﻌرﺿﯾﺔ ﻟﻠﺣﻔﺎظ ﻋﻠﻰ اﻟﺑﻧﯾﺔ‬ ‫‪‬‬
    ‫اﻟﺑﺻرﯾﺔ ﻟﻠﺻﻔﺣﺔ‪.‬‬
    ‫‪ Use a grid to provide visual structure‬‬
    ‫اﺳﺗﺧدم اﻟﻣﺳﺎﺣﺎت اﻟﺑﯾﺿﺎء اﻟﻔﻌﺎﻟﺔ‪.‬‬ ‫‪‬‬
    ‫‪ Use active white space‬‬
    ‫أﻧظر ﺟﯾدا ﻟﻠﺻﻔﺣﺔ اﻟﺣﺎﻟﯾﺔ‬
    ‫ﻗﺎرن اﻟﺻﻔﺣﺔ اﻟﺣﺎﻟﯾﺔ ﺑﺎﻟﺳﺎﺑﻘﺔ‬
    ‫اﺳﺗﺧدم اﻟﺧطوط ﻟﻠﺣﻔﺎظ ﻋﻠﻰ ﺑﻧﯾﺔ اﻟﺻﻔﺣﺔ‬
    Use a grid to provide visual structure
    ‫اﺳﺗﺧدم اﻟﻣﺳﺎﺣﺎت اﻟﺑﯾﺿﺎء اﻟﻔﻌﺎﻟﺔ‬
    ‫راﻋﻲ اﻟﻣﺳﺗﺧدم ﻓﻲ ﺗﺻﻣﯾﻣك‬
     Keep your design efforts centered
    around your user
     Design for interaction
     Design for location
     Guide the user’s eye
     Decide whether the user will read or
    scan
    ‫ﺗﺻﻣﯾم اﻟﺻﻔﺣﺎت وﻓﻘﺎ ﻟﻠﻣﺳﺗﺧدم‬

    ‫ﺻﻔﺣﺔ ﻣﺻﻣﻣﺔ ﻟﻠﻘراءة‬ ‫ﺻﻔﺣﺔ ﻣﺻﻣﻣﺔ ﻟﻠﻣﺳﺢ‬


    ‫اﻟﺗﺻﻣﯾم ﺣﺳب ﻣﻧﺎطق اﻟﺗﻔﺿﯾل‬
    ‫ﻣﺛﺎل ﻟﻣﻧﺎطق اﻟﺗﻔﺿﯾل‬
    ‫اﻟﺗﺻﻣﯾم وﻓﻘﺎ ﻻﺗﺟﺎه اﻟﻘراءة‬
    ‫اﻟﺗﺻﻣﯾم ﺣﺳب اﺗﺟﺎه اﻟﻣﺳﺢ‬

    You might also like