YTE Home   /   KAMİS   /   Usability Principles   /   Device Independent Design

KAMİS

Device Independent Design

Responsive Design

Principle

When designing websites, it is essential to consider access from different devices, screens, and platforms, and apply responsive design principles.

Description

Creating a separate website and corresponding codebase for large screen monitors, desktops, laptops, tablets, and various sizes of smartphones can be cumbersome. Instead, developing a single codebase according to responsive design principles will make it easier for users accessing the website from different devices. In a website designed with responsive principles, page elements will adapt to the user's device. It is known that this approach, called responsive design, also brings long-term convenience from a software development perspective.

Guidelines

  • When accessed from different devices like computers, tablets, and phones, elements on the website should adjust according to screen width and be displayed smoothly without the need for horizontal scrolling.
  • In responsive design, page elements are constantly changing, so design and development teams should collaborate closely.
  • A website designed according to responsive principles can offer an excellent user experience on a desktop platform but provide a poor experience on mobile devices. Usability testing should be conducted for each layout change.
  • Users should not be forced to use the website in full-screen mode.

References

  • ISO 9241-151 / 7.2.2 – Independence of content, structure and presentation
  • ISO 9241-151 / 9.3.14 – Using appropriate techniques for defining the layout of a page
  • ISO 9241-151 / 10.9 – Designing for input device independence

Useful Resources

Significance Level

5/5

Example

In the example website, it is displayed seamlessly when accessed from different devices.
Screen Resolution

Principle

Websites should be designed to be compatible with the most common screen resolutions.

Description

With advancing technology, the variety of devices used by people has expanded, and these devices now have clearer screens with higher resolutions. As of 2017, according to statistical data from some highly visited websites, 95% of computer users have screen resolutions of 1024×768 pixels or higher.

Guidelines

  • The website should be designed to be compatible with all resolutions, even if the visual design may be affected, a structure should be built where navigation and functionality remain unaffected.
  • Information about which resolution and browser works best for the website should not be provided directly on the homepage. However, this information can be provided in technical details or a help section.
  • Considering that users without visual impairments generally prefer to read text from 60cm away at 12 points, and that screen sizes between 14-24 inches are more commonly used, these factors should be taken into account.
  • Designs should consider the resolutions of commonly used devices, especially since many users access websites through tablets or mobile phones.
  • It should not be assumed that users are required to use websites in full-screen mode, and screen designs should take this into account.

References

  • ISO 9241-151 / 10.7- Supporting common technologies

Useful Resources

  • Galitz, W. O. (2007). The essential guide to user interface design: an introduction to GUI design principles and techniques (3rd ed.). Indianapolis, IN: Wiley.
  • Screen Resolution and Page Layout

Significance Level

4/5

Example

The sample site runs smoothly on computers with different resolutions.
Internet Access Speed

Principle

When developing websites, internet connection speed and quality should be taken into account.

Description

The speed and quality of a user's internet connection affect a website's performance. With a slow internet connection, the loading time of a website increases, content may load slowly, and users are adversely affected by this situation. On the other hand, websites optimized for low bandwidth can provide a fast user experience for both high and low bandwidths.

Guidelines

  • To prevent the slowness experienced during page loading, large content files (e.g., photos, videos, animations, etc.) should not be used.
  • Images, except in exceptional cases, should not be used in their original large sizes but should be resized to fit the screen size. To reduce image sizes, image editors should be used to adjust their dimensions. HTML/CSS should not be used to change the real size of images/photos.
  • Optimizations/improvements should be made, especially for the homepage and frequently used pages, to ensure that they load quickly.
  • The maximum wait time for page loading should not exceed 10 seconds.
  • Gradual loading techniques can be used to load pages in stages. With this technique, the first part of the page will be immediately available for the user to start reading.
  • Pages should be optimized for low connection speeds as well.
  • JavaScript, CSS, etc. files should be cached by using full-length source code within the page rather than being included in each page, using common server folders.

References

  • ISO 9241-151 / 10.5 – Acceptable download times

Useful Resources

Significance Level

5/5

Example

In the example website, some images are slow to load when the site is first opened. This can be due to both the user's internet speed and the high sizes of image elements.
Operating System Differences

Principle

It should be ensured that the website is compatible with browsers on different operating systems.

Description

User-owned operating systems can vary, making it crucial that websites are designed to work seamlessly on all operating system-based browsers (e.g., Windows, MacOS, Linux, etc.).

Operating systems may interpret fonts or form elements differently. The reason the same font may appear differently on different operating systems is due to the different rendering engines used. The same font might be displayed with anti-aliasing in one operating system while in another it may appear sharp-edged and more jagged due to the lack of this feature. When form elements are used in their standard, uncustomized state without web technologies (CSS, JavaScript, etc.), differences in appearance can also arise.

Guidelines

  • A smooth operation test should be performed with browsers in the national open source operating system.
  • Regardless of the operating system, the website's appearance, content, and performance should remain consistent.
  • Plug-in file types that are not available in every operating system and require paid applications should not be used within the scope of document downloading, and common extension types should be preferred.
  • It should not be assumed that users use a specific operating system.
  • In the font preference, the different font appearance that will be created by the interpretation engines in different operating systems should be taken into account and the most ideal font should be selected for the target audience.

References

  • ISO 9241-151 / 10.7 – Supporting common technologies

Useful Resources

Significance Level

3/5

Example

When the sample site is accessed with the same browser (Google Chrome) on different operating systems (Windows (left) and Mac OS (right)), the same performance and display are provided.
Browser Differences

Principle

During the design process, the website's appearance should be created with consideration for different browsers.

Description

In the past, when websites were viewed in different browsers, significant appearance differences could arise. However, today, there is greater consistency between the updated versions of browsers. The emergence of browser differences can be attributed to the fact that some browsers may correct faulty code structures. While the same code structure can be interpreted differently by browsers, developers can always write browser-specific code.

Guidelines

  • Since it is impossible to know with certainty which browser users will employ, the website should be designed to have the same appearance and performance on the most commonly used browsers (e.g., Google Chrome, Internet Explorer, Mozilla Firefox, Safari, Opera, etc.).
  • The use of special browser components (e.g., components, plugins, etc.) can affect the appearance of websites and should be considered.
  • Designs based on special plugins or features found in the latest browser versions should be avoided, taking the website's target audience into account.
  • Components that strain the processor power and battery capacity should be used as sparingly as possible.
  • Care should be taken to ensure that there are no errors in the page code. Some of these errors may be corrected by certain browsers, while others may affect the page's appearance. This can lead to differences in appearance among browsers.

References

  • ISO 9241-151 / 10.7 – Supporting common technologies

Useful Resources

Significance Level

5/5

Example

In the example images, the same website is displayed similarly in different browsers.

sge

(SGE) Cyber Security Institute

The Cyber Security Institute, which was established to carry out studies to increase the national cyber security capacity, carries out research and development activities in the field of cyber security; carries out solutions-oriented projects for military institutions, public institutions and organizations and the private sector.

The main fields of activity of our institute, which has made a significant contribution to the creation of cyber security knowledge and tactical infrastructure in our country with many successful projects to date, are secure software development, penetration tests and vulnerability analysis.

blank
6-yze card logo

(IZE) Artificial Intelligence Institute

Artificial Intelligence Institute is the first institute established within the scope of TUBITAK centers and institutes, which cuts the sectors and research fields horizontally and focuses directly on the emerging technology field. For this reason, it constitutes an innovative model in terms of both the open innovation and co-development approach of the institute and its focus on emerging technology.

Artificial Intelligence Institute aims to develop core technologies in the field of artificial intelligence and bring these innovations from the forefront of science to the use of the industry as soon as possible. Focusing on the transformative potential of artificial intelligence, it will continue to play its part in pioneering efforts to create and sustain artificial intelligence-based innovation, growth and productivity in Turkey. Working with industry and public institutions in Turkey, together with other organizations within the artificial intelligence ecosystem, spreading the use of artificial intelligence and increasing the workforce specialized in this field are among its primary goals.

blank

Researcher

By joining TÜBİTAK BİLGEM as a Researcher, you can contribute to developments in the fields of information technology, information security, and advanced electronics. You'll have the opportunity to make your mark on innovations, closely follow advancements, enhance your skills, and shape your future by advancing in your career.

You can apply to our currently open positions through the TÜBİTAK Job Application System .

Application Conditions

Conditions for Job Application:

  • Foreign language proficiency: Attaining appropriate scores in the exam types specified in the announcement or studying in a program that is 100% in English for undergraduate education.
  • Fulfilling specific requirements stated in the announcement (such as undergraduate department, years of experience, expertise, etc.).
  • Satisfying the formula score:

For Candidates with Less than 3 Years of Experience:

Weighted Graduation Average + (10,000 / University Placement Exam Ranking) + Additional Score* >= 3.20

 

For Candidates with 3 Years and More of Experience:

Weighted Graduation Average + (10,000 / University Placement Exam Ranking) + 5*[1 / (1 + e^(5 - years of experience) ) ] + Additional Score* >= 3.20


*Candidates who have achieved rankings and awards in national and international competitions will receive an additional score of 0.3.

arastırmacı-img-1

Competence Centers

Candidate Researcher

Students in the 3rd and 4th years of relevant engineering departments at universities can apply to our Part-Time Candidate Researcher positions through our Job Application System at kariyer.tubitak.gov.tr. By doing so, they can gain work experience at TÜBİTAK BİLGEM during their university years.

This program does not have an end date. Candidate Researcher personnel working part-time during their university period can seamlessly transition to full-time employment as Researcher personnel at TÜBİTAK BİLGEM without interrupting their career journey after graduating from the undergraduate program.

Application Conditions

Conditions for the Candidate Researcher Program:

  • Being a 3rd or 4th-year student in the relevant departments specified in the announcements at universities.
  • Foreign language proficiency: Achieving appropriate scores in the exam types specified in the announcement or studying in a program that is 100% in English for undergraduate education.
  • Satisfying the formula score:

Weighted Graduation Average + (10,000/University Placement Exam Ranking) + Additional Score* >= 3.20

*Candidates who have achieved rankings and awards in national and international competitions will receive an additional score of 0.3.

aday-arastırmacı-img-1

Discover institutes laboratories technologies products projects of BİLGEM.

Intern

TÜBİTAK BİLGEM builds its basic strategy for the future on qualified knowledge and qualified people focused on national targets in the research, technology development and innovation ecosystem.

Starting from the understanding that "the most important resource of a country is generally people, specifically scientists," TÜBİTAK encourages and supports our youth from an early age. In this context, providing young minds with early exposure to technology production is crucial for the success of our National Technology Move. Accordingly, TÜBİTAK BİLGEM offers internship opportunities to undergraduate students from universities every year.

You can follow internship announcements and submit your applications through the Career Gateway at https://kariyerkapisi.cbiko.gov.tr.

Application Conditions

  • Students enrolled in undergraduate (2nd year and above) and associate degree programs in departments offering education in universities and conducting insurance procedures through the higher education institution to which they are affiliated can benefit from the internship opportunity.
  • For undergraduate and associate degree students, a minimum Weighted Grade Point Average (GPA) of 2.50 out of 4 is required. The GPA of candidates with a 100-point system is converted to a 4-point system based on the "Conversion Table of Grades from the 4-Point System to the 100-Point System" published by the Higher Education Council.
  • There is no requirement for a foreign language certificate during the internship application process.
  • Students enrolled in departments such as Forensic Computing Engineering, Computer Sciences, Computer Science and Engineering, Computer Engineering, Computer and Informatics, Computer and Software Engineering, Information Systems Engineering, Electrical and Electronics Engineering, Control Engineering, Control and Computer Engineering, Control and Automation Engineering, Mechanical Engineering, Mechatronics Engineering, Telecommunication Engineering, or Software Engineering in universities can apply for internships.

Internship applications are accepted between December and January, and the internship period covers June, July, and August.

stajyer-img-1

Scholar

Scholar assignments are made for research and development activities for undergraduate, master's, doctoral students, and post-doctoral researchers. In our center, scholars are appointed for practical purposes in externally funded, TARAL, or European Union projects.

Application Conditions

(1) The conditions for undergraduate scholars in externally funded projects conducted by the institution are specified below:

  •  Being a student continuing undergraduate education at higher education institutions established in Turkey (excluding foreign language preparatory students).
  • Having a weighted cumulative GPA for previous years, excluding preparatory years, based on the university's grading system, which satisfies the formula score and foreign language requirements in the recruitment criteria.
  • Completing at least the first semester of the first year of undergraduate education.
  • Having a GPA of "+3.00" and a University Placement Exam Ranking of "10,000 ≥" for undergraduate general average.
  • For foreign students placed in Turkish universities without taking the ÖSYM exam or for those who completed undergraduate education through exams such as Vertical Transfer Exam, the lowest university placement ranking of the department from the year the candidate started the undergraduate program is considered in the ranking formula.

(2) The conditions for master's degree scholars in externally funded projects conducted by the institution are specified below:

  • Being a student continuing master's degree education at higher education institutions established in Turkey (excluding special students and foreign language preparatory students).
  • Currently pursuing a master's degree in the project's field of responsibility.

(3) The conditions for doctoral students in externally funded projects conducted by the institution are specified below:

  • Being a student continuing doctoral education at higher education institutions established in Turkey (excluding special students and foreign language preparatory students).
  • Currently pursuing a doctorate in the project's field of responsibility or conducting a doctorate in areas determined within the framework of the YÖK-TÜBİTAK Doctoral Program Project Collaboration Protocol. (Students in medical specialization and artistic proficiency are accepted as doctoral students.)

bursiyer-img-1

MILSEC 4 - Secure IP Terminal

SAFE IP TERMINAL

While the MİLSEC-4 terminal offers an up-to-date solution for next-generation secure communication (voice, data and video) in IP networks, it provides an uninterrupted communication service by maintaining the compatibility of secure voice communication in PSTN networks with PSTN secure phones in use.
provides.

Configuration, surveillance and software update processes of MILSEC-4 terminals are carried out securely remotely using the Security Management Center (GYM). MİLSEC-4 terminal is capable of IP Network Key Loading (IPAAY) through secure communication with GYM without the need for an additional device.

MİLSEC-4 terminals are interoperable with MİLSEC-1A and MİLSEC-2 phones and offer the opportunity to replace MİLSEC-1A and MİLSEC-2 phones without interruption in the gradual transformation of PSTN networks to next generation IP networks.

FEATURES

  • End-to-end secure voice communication in PSTN networks
  • End-to-end secure voice, image and data transmission in IP networks
  • NATO SCIP compliance on IP networks
  • Compatibility with commercial SIP products
  • Interoperability with MILSEC1A and MILSEC2 secure phones
  • National and AES crypto algorithms
  • Remote software update
  • Easy operation with touch screen

It is subject to the sales license to be given by the Ministry of National Defense.

Feedback