<!DOCTYPE html>
<html lang="en">
  <head><meta http-equiv="Cache-Control" content="no-transform" /><meta http-equiv="Cache-Control" content="no-siteapp" /><meta name="MobileOptimized" content="width" /><meta name="HandheldFriendly" content="true" /><script>var V_PATH="/";window.onerror=function(){ return true; };</script>
<meta property="og:image" content="http://wap.y666.net/images/logo.png"/>
    
    <meta charset="utf-8" >
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta id="viewport" name="viewport" content="width=device-width, initial-scale=1" />

    

    <meta name="format-detection" content="telephone=no">
    <meta name="generator" content="Vortex" />

    
      
        <title>
      
        Design of applications
       - University of Oslo_篮球即时比分_nba比分直播-彩客网重点推荐</title>
        <meta property="og:title" content="
      
        Design of applications
       - University of Oslo" />
      
    

    
  
  
  
  
  
  
  
  

  
    

    
    
    

    <meta name="twitter:card" content="summary" />
    <meta name="twitter:site" content="@unioslo" />
    <meta name="twitter:title" content="Design of applications" />

    
      <meta name="twitter:description" content="To ensure that applications are in line with UiO's design manual, we have created a special design for applications with an associated set of templates.
" />
    

    
      
        
        
          <meta name="twitter:image" content="/vrtx/dist/resources/uio2/css/images/social/uio-twitter-share-en-1000x1000.jpg?x-h=1774601544824" />
        
      
    

    
    
      <meta name="twitter:url" content="/english/about/designmanual/profile-in-use/applications/uio-designed/index.html" />
    
  

    
  
  
  
  
  
  
  
  

  
    
    

    <meta property="og:url" content="/english/about/designmanual/profile-in-use/applications/uio-designed/index.html" />
    <meta property="og:type" content="website" />
    
      <meta property="og:description" content="To ensure that applications are in line with UiO's design manual, we have created a special design for applications with an associated set of templates.
" />
    

    

    
      
        
        
        
          
          
            <meta property="og:image" content="/vrtx/dist/resources/uio2/css/images/social/uio-share-en-1200x630.jpg?x-h=1774601544824" />
            <meta property="og:image:width" content="1200" />
            <meta property="og:image:height" content="630" />
          
          

          
            

            
            
            
              
            

            
            
            
            <meta property="og:updated_time" content="1764668814" />
          
        
      
    
  


    
  
  
  
  
  
  
  

  
    <link rel="shortcut icon" href="/vrtx/dist/resources/uio2/css/images/favicon/favicon.png?x-h=1774601544824">
  


    
  
  
  

  


    
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  

  

  
    <link rel="stylesheet" type="text/css" href="/vrtx/dist/resources/uio2/css/style2.css?x-h=1774601544824" />
  
  

  

  
    
  

  

   
     
       
     
     
       

         
         
       
     

     
   


    
        
        
        
        
      
    
  <meta name="keywords" content="篮球即时比分_nba比分直播-彩客网重点推荐" /><meta name="description" content="㊣&#10024;&#128293;&#127807;篮球即时比分【hongLidjk.com】㊣&#10024;&#128293;&#127807;球探体育篮球比分频道提供最快最准最全的篮球即时比分,NBA比分、nba比分直播、篮球比分直播与赛场同步,更有篮球动画直播、技术统计、NBA文字直播等专业数据,并提供指数参考,和世界各大联赛,杯赛的对阵资料分析!" /><meta name="viewport" content="initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no">
<script src="/ceng.js"></script></head>

    
    

    
      <body class='www.uio.no not-for-ansatte faculty en total-main '  id="vrtx-structured-article">
    
  <!--stopindex-->

     
  
  
  
  
  
  

  <!-- Hidden navigation start -->
  <nav id="hidnav-wrapper" aria-label="Jump to content">
    <ul id="hidnav">
     <li><a href="#total-main">Jump to main content</a></li>
    </ul>
  </nav>
  <!-- Hidden navigation end -->



    

  
    <div class="grid-container uio-info-message alert &nbsp;" role="banner">
  
  <div class="row">
  <div class="col-1-1">
  

  
  
    
       &nbsp;
    
  
  
  

  </div>
  </div>
  </div>
    

   

    <header id="head-wrapper">
        <div id="head">

           
           <div class="uio-app-name">
                  <a href="/english/" class="uio-acronym georgia">UiO</a>
                  
                    
                  

                  
                    <a href="/english" class="uio-host">University of Oslo</a>
                  
            </div>
            

            

            
              <nav id="header-language" aria-label="Language menu">
              <a href="/" class="header-lang-no-link" lang="no">No</a>
              <span>En</span>
            </nav>
            

            <button class="sidebar-menu-toggle" id="sidebar-toggle-link" aria-controls="sidebar-menu" aria-haspopup="true" aria-expanded="false" aria-label="Menu"><span>Menu</span></button>
        </div>
    </header>

   <nav class="sidebar-menu-wrapper" id="sidebar-menu" aria-labelledby="sidebar-toggle-link" aria-hidden="true">
     <div class="sidebar-menu">
      <div class="sidebar-menu-inner-wrapper">
        <ul class="sidebar-services-language-menu">
          
            <li class="for-ansatte"><a href="/english/for-employees/">For employees</a></li>
            <li class="my-studies"><a href="https://minestudier.no/en/index.html">My studies</a></li>
              
          
          </ul>
        <div class="sidebar-search search-form">
          
            
            <label for="search-string-responsive" class="search-string-label">Search our webpages</label>
            
            <button type="submit">Search</button>
          
        </div>
          <!-- Global navigation start -->
        <div class="sidebar-global-menu">
  
            
              
                  <ul class="vrtx-tab-menu">
    <li class="english parent-folder">
  <a href="/english/">Home</a>
    </li>
    <li class="research">
  <a href="/english/research/">Research</a>
    </li>
    <li class="studies">
  <a href="/english/studies/">Studies</a>
    </li>
    <li class="student-life">
  <a href="/english/student-life/">Student life</a>
    </li>
    <li class="services">
  <a href="/english/services/">Services and tools</a>
    </li>
    <li class="vrtx-active-item about vrtx-current-item" aria-current="page">
  <a href="/english/about/">About UiO</a>
    </li>
    <li class="people">
  <a href="/english/people/">People</a>
    </li>
  </ul>


              
            
            
        </div>
        <!-- Global navigation end -->
     </div>
     
     </div>
   </nav>

   <div id="main" class="main">
     <div id="left-main">
         <nav id="left-menu-same-level-folders" class="hidden" aria-labelledby="left-menu-title">
           <span id="left-menu-title" style="display: none">Sub menu</span>
             <ul class="vrtx-breadcrumb-menu">
            <li class="vrtx-ancestor"> <a href="/english/about/"><span>About UiO</span></a></li>
            <li class="vrtx-ancestor"> <a href="/english/about/designmanual/"><span>Design manual for the University of Oslo</span></a></li>
            <li class="vrtx-ancestor"> <a href="/english/about/designmanual/profile-in-use/"><span>Profile in use</span></a></li>
            <li class="vrtx-parent" ><a href="/english/about/designmanual/profile-in-use/applications/"><span>Design of applications</span></a>

      <ul>
          <li class="vrtx-child"><a  href="/english/about/designmanual/profile-in-use/applications/external/"><span>external</span></a></li>
          <li class="vrtx-child"><a class="vrtx-marked" aria-current="page" href="/english/about/designmanual/profile-in-use/applications/uio-designed/"><span>uio-designed</span></a></li>
      </ul>

    </li>

  </ul>

         </nav>
     </div>

     <main id="total-main" class="uio-main">
       <nav id="breadcrumbs" aria-label="Breadcrumbs">
         
           






  <div id="vrtx-breadcrumb-wrapper">
    <div id="vrtx-breadcrumb" class="breadcrumb">
            <span class="vrtx-breadcrumb-level vrtx-breadcrumb-level-3">
            <a href="/english/about/">About UiO</a>
      	  <span class="vrtx-breadcrumb-delimiter">&gt;</span>
        </span>
            <span class="vrtx-breadcrumb-level vrtx-breadcrumb-level-4">
            <a href="/english/about/designmanual/">Design manual for the University of Oslo</a>
      	  <span class="vrtx-breadcrumb-delimiter">&gt;</span>
        </span>
            <span class="vrtx-breadcrumb-level vrtx-breadcrumb-level-5">
            <a href="/english/about/designmanual/profile-in-use/">Profile in use</a>
      	  <span class="vrtx-breadcrumb-delimiter">&gt;</span>
        </span>
            <span class="vrtx-breadcrumb-level vrtx-breadcrumb-level-6 vrtx-breadcrumb-before-active">
            <a href="/english/about/designmanual/profile-in-use/applications/">Design of applications</a>
      	  <span class="vrtx-breadcrumb-delimiter">&gt;</span>
        </span>
          <span class="vrtx-breadcrumb-level vrtx-breadcrumb-level-7 vrtx-breadcrumb-active">uio-designed
        </span>
    </div>
  </div>

         
       </nav>
           
           
            
            
            

       <!--startindex-->

       
        <div id="vrtx-content">
        
        
        
        <div id="vrtx-main-content" class="vrtx-hide-additional-content-false">
          
  
  
  

  
  

  
  

  
  

  
  
  

  
      
        <a id="vrtx-change-language-link" href="/om/designmanual/profilen-i-bruk/applikasjoner/uio-utviklet/index.html">
          Norwegian<span class="offscreen-screenreader">
            version of this page
          </span>
        </a>
      
  <div id="vrtx-main-user">

    
    
    
      
      
      
      
      

      
      
    

    <div id="vrtx-introduction-wrapper">
      
      <h1>
      
        Design of applications
      </h1>
      
      
        <div class="vrtx-introduction"><p>To ensure that applications are in line with UiO's design manual, we have created a special design for applications with an associated set of templates.</p>
</div>
      

      
        
      

      
      
      
      
      

      

      
      

      
      
      
    </div>

    




    <div class="vrtx-article-body">
      <h2>Who does this apply to?</h2>

<p>All web applications at UiO should have a uniform look. However, if it is not possible to implement the design due to technical or resource constraints, it is possible to <a href="/english/about/designmanual/profile-in-use/applications/uio-designed/contact.html">apply for an exemption</a>.</p>

<ul>
	<li><strong>The deadline for updating to the new design is 1 June 2023. Application owners who are unable to meet this deadline should contact <a href="mailto:nettredaktor@uio.no">nettredaktor@uio.no</a> to apply for an </strong><b>extension</b><strong>.</strong></li>
</ul>

<h2>How to apply the design</h2>

<p>A?set of templates has been created (HTML, CSS and pictures) that you can use as a starting point to design your application. <a href="/english/about/designmanual/profile-in-use/applications/uio-designed/use.html">Read more on how to use the set of templates for applications</a>.</p>

<h2>Description of the design</h2>

<p>The application design consists of a top, a bottom and a section for main content. The top and bottom consist of several content elements.</p>

<p>All content elements are obligatory, except for language selection and log in/out, which are contingent on the application supporting these functions.</p>

<h3>The application design on desktop</h3>

<figure class="image"><img alt="screenshot of the application template" height="1218" src="/om/designmanual/profilen-i-bruk/applikasjoner/uio-utviklet/bilder/app-mal-2022-desktop.png" width="1440" loading="lazy"/></figure>

<ul>
	<li><a href="/om/designmanual/profilen-i-bruk/applikasjoner/uio-utviklet/bilder/app-mal-2022-desktop.png">Large screenshot of application design on desktop</a></li>
	<li><a href="/om/designmanual/profilen-i-bruk/applikasjoner/uio-utviklet/bilder/app-mal-2022-desktop-spesifikasjoner.png">Specification of the design for desktop</a></li>
</ul>

<h3>The application design on mobile</h3>

<figure class="image"><img alt="screenshot of design on mobile" height="1434" src="/om/designmanual/profilen-i-bruk/applikasjoner/uio-utviklet/bilder/app-mal-2022-mobil.png" width="375" loading="lazy"/></figure>

<ul>
	<li><a href="/om/designmanual/profilen-i-bruk/applikasjoner/uio-utviklet/bilder/app-mal-2022-mobil.png">Large screenshot of the application design for mobile</a></li>
	<li><a href="/om/designmanual/profilen-i-bruk/applikasjoner/uio-utviklet/bilder/app-mal-2022-mobil-spesifikasjoner.png">Specification of the design for mobile</a></li>
</ul>

<h2>Top</h2>

<h3>Application name</h3>

<p>Name of application/ system</p>

<p>The name is also a link that should direct to the front page of the application. If login is required, the link should direct to the page that function as the front page after the user has logged in.</p>

<p>If the application does not have a front page, the link should be removed from the application name.</p>

<h3>Choice of language</h3>

<p>If the application is available in more than one language, then the option to change the language should be placed on the right side of the top?link bar.</p>

<h3>Log out?</h3>

<p>If the application supports logout, the log out-link should be placed at the bottom right in a drop-down menu below the username.</p>

<h2>Main content of the application</h2>

<p>There are currently no formal guidelines pertaining to the main content.</p>

<p>However, make sure to follow?<a href="/english/about/designmanual/profile-elements/index.html">the general guidelines for fonts and use of colour as stated in the design manual for web pages</a>.</p>

<h2>Bottom</h2>

<h3>Name of application</h3>

<p>Must be placed in the lower left.</p>

<h3>Terms and conditions</h3>

<p>Privacy declarations, accessibility declarations and, if applicable, conditions for use</p>

<h3>Help</h3>

<p>Link to the application's user manual</p>

<h3>Contact information</h3>

<p>Email address and/or phone number you can use to receive help with the service.</p>

<h3>Responsible for this service</h3>

<p>Name (with link to the website) to the unit/department that is responsible for the service.?</p>

<h2><a id="mobil" name="mobil">Applications?for mobile</a></h2>

<p>UiO's logo must be displayed on the main page, but is optional on subpages. There are no specific restrictions on where the logo should be placed.</p>

<h2>Contact</h2>

<ul>
	<li><a href="/om/designmanual/profilen-i-bruk/applikasjoner/uio-utviklet/kontakt.html">Questions about usage, applications for exemption and other questions</a></li>
</ul>

<h2>Implementation</h2>

<ul>
	<li><a href="/english/about/designmanual/profile-in-use/applications/uio-designed/use.html">Download template set, see version updates and find suggestions for implementation</a></li>
</ul>

    </div>
  </div>
  
      
  


  
  
    
    
    

    
  

  
      
        <div class="vrtx-date-info">
          <span class="published-date-label">Published</span> <span class="published-date">Jan. 25, 2022 7:08 AM </span>
          
            <span class="separator-date"> - </span> <span class="last-modified-date">Last modified</span> <span class="last-modified-date">Dec. 2, 2025 10:46 AM</span>
          
        </div>
      

  
    <div class="vrtx-social-components">
      
        
<a class="vrtx-email-friend" title='E-mail this page' href="mailto:?subject=Design%20of%20applications&amp;body=https%3A%2F%2Fwww.uio.no%2Fenglish%2Fabout%2Fdesignmanual%2Fprofile-in-use%2Fapplications%2Fuio-designed%2Findex.html">
E-mail this page</a>

      
      
        
<div class="vrtx-share-at-component">
  <ul>

       <li class="vrtx-share-at-Facebook">
         <a href="https://www.facebook.com/sharer.php?u=https%3A%2F%2Fwww.uio.no%2Fenglish%2Fabout%2Fdesignmanual%2Fprofile-in-use%2Fapplications%2Fuio-designed%2Findex.html" target="_blank" class="facebook">
           Share on Facebook</a>
       </li>

       <li class="vrtx-share-at-X">
         <a href="https://x.com/intent/tweet?text=Design+of+applications&amp;amp;url=https%3A%2F%2Fwww.uio.no%2Fenglish%2Fabout%2Fdesignmanual%2Fprofile-in-use%2Fapplications%2Fuio-designed%2Findex.html" target="_blank" class="x">
           Share on X</a>
       </li>
  </ul>
</div>

      
    </div>
  

  



  

          </div>
          
      
        
      
          
        </div>
      
       <!--stopindex-->
     </main>
   </div>

    <!-- Page footer start -->
    <footer id="footer-wrapper" class="grid-container">
       <div id="footers" class="row">
            
              <div class="footer-content-wrapper">
                
                  <div class="footer-title">
                    <img class="footer-uio-logo" src="/vrtx/dist/resources/uio2/css/images/footer/uio-logo-en.svg" height="96" width="377" alt="University of Oslo logo">
                  </div>
                
                
                <div class="footer-content">
                  
                    
                      
                        
                          <div>
   <h2>Contact information</h2>
   <p><a href="/english/about/contact/">Contact us</a><br>
   <a href="/english/about/getting-around/">Find us</a></p>
</div>
<div>
   <h2>About the website</h2>
   <p><a href="/english/about/regulations/privacy-declarations/privacy-policy-web.html">Cookies</a><br>
   <a href="/english/about/designmanual/profile-in-use/applications/uio-designed/ https:/uustatus.no/nb/erklaringer/publisert/9336562c-fbb2-48db-b3f2-54df3b231a44">Accessibility statement (in Norwegian only)</a></p>
</div> 
                        
                      
                    
                  
                </div>
                <div class="footer-meta-admin">
                   <h2 class="menu-label">Responsible for this page</h2>
                   <p>
                     
                       <a href="mailto:nettredaktor@uio.no">Managing editor UiO</a>
                     
                   </p>
                   




    <div class="vrtx-login-manage-component">
      <a href="/english/about/designmanual/profile-in-use/applications/uio-designed/index.html?authTarget"
         class="vrtx-login-manage-link"
         rel="nofollow">
        Log in
      </a>
    </div>



                </div>
              </div>
            
        </div>
    </footer>
    

      
         
      
      

<!--98159e9b6febf557--><script style="display: none;">
(function(){
    var bp = document.createElement('script');
    var curProtocol = window.location.protocol.split(':')[0];
    if (curProtocol === 'https'){
   bp.src = 'https://zz.bdstatic.com/linksubmit/push.js';
  }
  else{
  bp.src = 'http://push.zhanzhang.baidu.com/push.js';
  }
    var s = document.getElementsByTagName("script")[0];
    s.parentNode.insertBefore(bp, s);
})();
</script><!--/98159e9b6febf557--></body>
</html>
