Indonesian Journal of Educational Development (IJED) Volume 6. Issue 3, 2025, pp. ISSN: 2722-1059 (Onlin. ISSN: 2722-3671 (Prin. DOI: https://doi. org/10. 59672/ijed. Developing web-based learning media for enhancing digital literacy in computer networking Achmad Buchori*)1. Tarisa Ahwalia Rahmadhani2. Ade Ricky Rozzaqi3. Nur Khoiri4 1Universitas PGRI Semarang. Kota Semarang. Indonesia. achmadbuchori@upgris. 2Universitas PGRI Semarang. Kota Semarang. Indonesia. tarisaahwalia17@gmail. 3Universitas PGRI Semarang. Kota Semarang. Indonesia. zaqi@upgris. Universitas PGRI Semarang. Kota Semarang. Indonesia. nurkhoiri@upgris. *)Corresponding author: Achmad Buchori. E-mail addresses: achmadbuchori@upgris. Abstract. This study aimed to develop web-based learning media for computer networking to improve studentsAo digital literacy. The research employed a Research and Development (R&D) Article history: Received August 26, 2025 approach, utilizing the ADDIE model, and was conducted at Revised October 09, 2025 SMA Negeri 1 Pecangaan with 35 students and one teacher as Accepted October 10, 2025 Instruments included expert validation sheets. Available online November 10, 2025 questionnaires, and pre-test and post-test assessments. The media obtained a high feasibility score from experts . ontent = 87. Keywords: Computer networks, media design = 85. 42%). Student responses also indicated a high Development. Digital literacy. Learning level of practicality . 61%). Statistical analysis confirmed media. Web significant learning improvement: the experimental group (M = 74. SD = 4. outperformed the control group (M = 74. Copyright A2025 by Author. Published by Lembaga SD = 4. , with a t-test result of t. = 5. 47, p < . N-Gain Penelitian dan Pengabdian kepada Masyarakat (LPPM) analysis revealed that the experimental group achieved a score of Universitas PGRI Mahadewa Indonesia 75 . igh categor. , compared to 0. edium categor. in the control group. These results demonstrate that the developed web-based media is both feasible and effective for enhancing digital literacy in computer networking. Article Info Introduction Education plays a crucial role in shaping individuals to effectively utilize advancements in science and technology to achieve learning objectives (Muhson, 2010. Arsyad, 2. Education is not merely the process of transferring knowledge, but also the foundation for preparing individuals to face future challenges, as science and technology continue to evolve at an unprecedented pace. the 21st century, the quality of education is measured by its ability to equip students with competencies relevant to a global society, one of which is the capacity to navigate digital Thus, education must ensure that learning processes are aligned with technological progress, preparing students to participate actively and responsibly in a digitally connected world. The rapid growth of digital technology necessitates that the education sector, particularly students, adapt and integrate technology as an essential component in addressing global challenges (Alami. Rijal & Jaya, 2. Advances such as artificial intelligence, cloud computing, and the Internet of Things (IoT) have brought fundamental changes to how knowledge is accessed, processed, and In this context, schools are expected not only to adopt technology but also to implement it effectively in learning so that students can critically evaluate and produce digital content. The integration of technology in schools is therefore not simply an innovation but a necessity to avoid digital divides and ensure equitable access to quality education. Indonesian Journal of Educational Development (IJED), 6. , pp. One important element in this regard is the use of learning media that present content in an attractive, interactive, and communicative way while fostering active student engagement (Audia et , 2021. Kustandi & Dermawan, 2020. Hamid et al. , 2. Effective media transforms passive learning into student-centered processes by utilizing videos, animations, and simulations, thereby making abstract concepts more accessible. Moreover, interactive media encourages collaboration and inquiry, motivating students to achieve a deeper understanding (Sumandya et al. , 2. However, observations at Pecangaan State High School reveal that the learning process is still dominated by lectures and textbooks, which tends to make students passive and less able to understand basic concepts of computer networks. Teacher-centered approaches, although efficient for delivering large amounts of content, often fail to stimulate critical thinking and practical problem-solving skills. Students are left with limited opportunities to explore and apply knowledge in real or simulated contexts. Although the school has provided a learning website, its utilization has not been optimized due to limited teacher training, a lack of structured content, and insufficient encouragement for students to explore independently. This clearly reveals a gap between ideal conditions . nteractive, practice-based learning with web medi. and reality . ominance of lectures and underutilization of digital resource. This underutilization highlights the gap between technological availability and pedagogical integration. Meanwhile, digital literacy, as a vital 21stcentury competence, requires students to access, utilize, and interact ethically in digital environments (Mayers Erickson & Small, 2013. Zulqadris. Mustadi, & Retnawati, 2022. Muslimin & Rahmatan Idul, 2020. HaniAos Atus Suroya, 2021. Kriswinahyu & Kastuhandani, 2. Without mastering digital literacy, students risk becoming passive users of technology rather than active creators and responsible digital citizens. Digital literacy is increasingly recognized as a core competence necessary for lifelong learning and workforce readiness (Jayanti et al. , 2. According to UNESCO, digital literacy encompasses the ability to access, manage, understand, and create information using digital technology in a manner that is safe, ethical, and sustainable. This definition aligns with frameworks such as the European UnionAos DigComp, which emphasizes not only technical skills but also critical evaluation, communication, collaboration, and problem-solving in digital environments. In the Indonesian context, strengthening studentsAo digital literacy is particularly urgent given the governmentAos vision for AuMerdeka BelajarAy (Freedom to Lear. , which encourages flexible, student-centered, and technology-enhanced learning experiences (Agustika & Diputra, 2. Several previous studies emphasize the importance of integrating digital media to improve learning outcomes and foster digital literacy. For example. Audia et al. demonstrate that studentsAo motivation and learning achievements significantly improve when they are exposed to interactive (Kustandi et al. highlight that media integration supports differentiated learning pathways, accommodating students with different learning styles. Hamid et al. further demonstrate that digital media enables collaborative learning environments in which students can collectively construct knowledge. Nonetheless, these studies have primarily addressed general digital learning, rather than specifically the development of web-based media for computer networking in high school. This research gap highlights the need for innovative learning resources that are tailored to the characteristics of students and subject matter. Computer networking, as a field of study, demands not only theoretical comprehension but also practical application. Topics such as IP addressing, routing, and network troubleshooting often require visualization, practice, and simulation, which are difficult to achieve through textbooks or lecture-based methods alone. Web-based media can bridge this gap by offering interactive modules, multimedia explanations, and self-paced exercises Indonesian Journal of Educational Development (IJED), 6. , pp. that allow students to revisit concepts and test their understanding repeatedly. Moreover, webbased platforms are accessible across various devices, allowing learning to occur anytime and Image 1. Classroom learning situation Lectures and textbooks still dominate, leading to limited student engagement. This image highlights the gap between the availability of digital infrastructure and its pedagogical utilization. In addition to enhancing understanding of technical content, web-based media plays a strategic role in nurturing broader digital literacy competencies. By engaging with interactive content, quizzes, and collaborative online discussions, students are exposed to real-life digital practices, including online communication, responsible information sharing, and the ethical use of resources. This process equips them with transferable skills applicable beyond the classroom, including those relevant to higher education and the workplace. Therefore, this study seeks to develop web-based learning media to improve studentsAo digital literacy in computer networking. The objectives of this research are: . to design valid and practical web-based learning media for computer networking subjects, and . to test the effectiveness of the media in enhancing studentsAo digital literacy. Based on the research design, the proposed hypothesis is that web-based learning media can significantly enhance studentsAo understanding of computer networking concepts and their digital literacy skills compared to conventional learning This study not only contributes to the improvement of instructional practices in schools but also addresses broader national priorities in advancing educational quality and preparing students for active participation in the digital era. Method This study employed a Research and Development design, utilizing the ADDIE model (Analysis. Design. Development. Implementation, and Evaluatio. This model was chosen because it provides a systematic framework for developing educational products that are valid, practical, and effective (Alfanika, 2. The R&D approach not only emphasizes product design but also ensures Indonesian Journal of Educational Development (IJED), 6. , pp. iterative testing and refinement, so that the final media is scientifically accountable, pedagogically appropriate, and practically applicable in classroom contexts. The research was carried out at SMA Negeri 1 Pecangaan. Jepara, during the 2024/2025 academic The school was purposively selected because computer networking is part of its curriculum, and it already possesses the necessary supporting infrastructure, including computer laboratories and internet facilities. However, these resources have not been fully optimized. The participants consisted of one computer networking teacher and 35 students of class XI-F, selected through purposive sampling based on the relevance of the subject matter and the accessibility of participants. This sample size was deemed adequate to represent real classroom conditions and to assess both the feasibility and effectiveness of the developed web-based media. Image 2. ADDIE Model Analysis At this stage, observations and semi-structured interviews were conducted with the computer networking teacher to identify studentsAo learning difficulties, instructional problems, and infrastructure readiness. The findings indicated that learning was still largely dominated by lectures and textbooks, resulting in low engagement. Students reported difficulties in understanding abstract concepts such as IP addressing, subnetting, and network topology, which require visualization and practice. A gap was also identified between the existing school website, which is primarily used for document uploading, and the studentsAo needs for interactive, visually appealing media that provides feedback and supports self-paced learning. Supporting facilities such as computer laboratories, personal devices, and internet bandwidth were analyzed to ensure compatibility of the web-based media with the schoolAos infrastructure. Design The design stage focused on translating the identified needs into structured learning solutions. First, learning objectives were formulated using BloomAos Taxonomy, ensuring a systematic progression from lower-order cognitive skills . emembering and understandin. to higher-order Indonesian Journal of Educational Development (IJED), 6. , pp. nalyzing, evaluating, and creatin. The content framework was developed in alignment with the Indonesian high school computer networking curriculum, covering fundamental concepts, network topologies. IP addressing, and troubleshooting. The content was sequenced progressively, starting with basic principles and progressing to more complex applications. The web-based media was designed to integrate multiple components: . Learning materials presented in text, images, and animations to facilitate conceptual understanding, . Interactive quizzes to reinforce mastery and provide feedback, and . Instructional videos to demonstrate networking processes and procedures. The content organization was developed in accordance with the Indonesian high school computer networking curriculum, which includes basic networking concepts, topologies. IP addressing, and The materials were sequenced progressively, beginning with fundamental concepts and advancing to more complex applications, supporting gradual knowledge To enhance usability, the design was elaborated into a storyboard and navigation flow that outlined how learners interact with the platform, including page layouts, menu structures, and multimedia The user interface was designed by applying principles of consistency, clarity, and accessibility to ensure that the media is intuitive, engaging, and supports independent learning. Development At this stage, the designed framework was transformed into a functional prototype using Blogger as the primary platform, selected for its accessibility, ease of use, and multi-device compatibility. The platform was integrated with supporting tools such as Canva . isual desig. and Quizizz . nteractive assessment. , enabling the incorporation of both static and dynamic elements, including diagrams, animations, and gamified quizzes. The prototype underwent expert validation involving a subject-matter expert and a media expert. The validation instrument applied a four-point Likert scale assessing: . content accuracy and curriculum relevance, . media design . ayout, color, navigatio. , and . Experts provided both quantitative scores and qualitative feedback, resulting in revisions such as simplified navigation, enhanced color contrast, and an expanded quiz bank. To ensure technical reliability, the prototype was tested across devices . esktop, tablet, smartphon. and browsers. The development process followed an iterative cycle, where feedback from validators was incorporated before classroom implementation. Implementation The validated media was implemented in two groups: an experimental class using the developed web-based platform and a control class using conventional textbook-based learning. Both groups were administered pre-tests and post-tests . multiple-choice item. to measure learning gains and digital literacy improvement. Prior to implementation, the instruments were subjected to rigorous quality analysis: . Validity test: Using PearsonAos product-moment correlation, 20 out of 25 items were found to be valid . pbis > . , . Reliability test: Conducted using CronbachAos alpha, the result was 0. 666, indicating moderate reliability, . Difficulty index: Most questions were categorized as easy to moderate, ensuring suitability for high school students, . Discrimination index: The test items demonstrated varying levels of discrimination, with most categorized as satisfactory. Indonesian Journal of Educational Development (IJED), 6. , pp. The experimental class accessed the platform over a period of three weeks, combining classroom activities with independent study. Teachers acted as facilitators, guiding navigation and encouraging collaborative learning. The control class followed conventional lecture and textbookbased instruction without exposure to the developed media. Evaluation The evaluation stage was carried out through two components: . expert validation and user feedback, and . statistical analysis of learning outcomes. Expert Validation and User Feedback. The validation results indicated that the developed media met the criteria of being highly suitable for classroom use. Student questionnaire responses indicated that the platform was engaging, easy to navigate, and effective for self-study. Meanwhile, teachers reported that it reduced their workload in delivering complex topics and increased student participation. Statistical Analysis. The effectiveness of the media was further examined using descriptive and inferential statistics. Normality test: confirmed that the data were normally distributed, . Homogeneity test: showed equal variances between groups, allowing the use of parametric tests, . Paired sample t-test: revealed significant improvements in the experimental class compared to the control class . < . , . N-Gain analysis: showed that the experimental group achieved a high category . Ou 0. whereas the control group was in the medium category . 3 O g < 0. The interpretation of NGain values followed HakeAos classification: . High: g Ou 0. 7, . Medium: 0. 3 O g < 0. 7, . Low: g < 0. This comprehensive evaluation confirmed that the developed web-based media was not only valid and practical but also effective in improving both studentsAo digital literacy and conceptual understanding of computer networking. Results and Discussion This study aimed to design and evaluate web-based learning media that are valid, practical, and effective in enhancing studentsAo digital literacy in computer networking. The development process followed the ADDIE model, which consists of five stages: Analysis. Design. Development. Implementation, and Evaluation. Each stage generated findings that collectively contributed to the feasibility and effectiveness of the product. Analysis The needs analysis, conducted through classroom observations and teacher interviews at SMA Negeri 1 Pecangaan, revealed that instruction was still predominantly teacher-centered, with lectures and conventional materials dominating the approach. While efficient for content delivery, this approach led to passive learning, low motivation, and difficulties in grasping abstract networking concepts, such as IP addressing and subnetting (Sari et al. , 2022. Agustiyani et al. , 2. Computer networking encompasses complex and abstract topics, such as IP addressing, subnetting, and network topologies, which require both theoretical understanding and practical visualization. Conventional textbooks and whiteboard explanations often fail to support students in grasping these concepts, as confirmed by teacher interviews that indicate low engagement and a limited ability to relate theory to practice. Although the school had a website, its use was limited to uploading static documents. The absence of interactive and visually rich resources made digital learning less engaging than traditional This gap highlighted the urgent need for web-based media that integrates interactivity, accessibility, and multimedia elements to support student learning better. Indonesian Journal of Educational Development (IJED), 6. , pp. Design At the design stage, the needs analysis was translated into specific learning objectives aligned with the national curriculum and structured according to BloomAos Taxonomy, from lower-order to higher-order thinking. For example, students were expected to identify and configure different network topologies and evaluate the efficiency of network designs. The media design included three components: . Lesson content enriched with diagrams, animations, and case examples to concretize abstract concepts, . Practice questions developed in Quizizz, providing immediate feedback and gamified learning, and . Instructional videos created in Canva and embedded in Blogger, enabling flexible access. The choice of platforms (Blogger. Quizizz. Canv. was guided by accessibility, ease of use, and multidevice compatibility (Haris Munandar, 2022. Khomaidah & Harjono, 2. A storyboard and navigation flow were developed to ensure intuitive design, minimizing cognitive load while maximizing engagement. Image 3 Main Page Image 4 Lesson material page Development In the development stage, the design framework was converted into a functional prototype. The prototype underwent validation by both a media expert and a subject-matter expert. Indonesian Journal of Educational Development (IJED), 6. , pp. Validator Table 1. Validation Results by Learning Media Experts Total Maximum Percentage Score Score Product appearance Content suitability Product usage Product appearance Content suitability Product usage Aspect Eligibility The results showed that the product received high scores in terms of product appearance, content suitability, and usability. Both validators concluded that the product fell into the Auhighly feasibleAy Suggestions from experts included improving font consistency, increasing color contrast, and adding alternative text for images to ensure accessibility for students with different needs. Validator Table 2. Results of Subject Matter Expert Validation Aspect Total Maximum Percentage Score Score Learning Appropriateness Language Learning Appropriateness Language Eligibility The subject-matter experts evaluated the content as accurate, relevant, and consistent with curriculum standards. The overall scores across all aspects confirmed that the web-based media was classified as Auhighly suitableAy for classroom implementation. This validation stage was crucial in ensuring that the product met both pedagogical and technological requirements prior to student testing (Hadayat et al. , 2021. Permana, 2. The development process also emphasized iterative refinement based on expert feedback. For instance, additional quiz items were included to address more subtopics, while video tutorials were segmented into shorter units to prevent cognitive overload. These revisions improved both content coverage and accessibility. Indonesian Journal of Educational Development (IJED), 6. , pp. Image 5. After revision, there is a video about the types of networks. Image 6. After revision, only six questions remain. Implementation The validated media was tested on a limited scale at SMA Negeri 1 Pecangaan in class XI F-10, which was divided into two groups: a control group and an experimental group. The control group received instruction through conventional textbooks and teacher-centered lectures, while the experimental group utilized the developed web-based learning media. Both groups were administered a pre-test and post-test consisting of 25 multiple-choice items designed to assess learning outcomes and digital literacy. Prior to use, the test instrument was subjected to quality analysis, as summarized below: . Validity: Of the 25 items, 20 were valid and Indonesian Journal of Educational Development (IJED), 6. , pp. five invalid . pbi > 0. , . Reliability: CronbachAos alpha coefficient obtained through SPSS 22 666, indicating moderate reliability, . Difficulty level: All 25 items were classified as easy, . Item discrimination: Two items were categorized as good, 17 as satisfactory, and six as poor. These results confirmed that the test instrument was adequate for measuring learning outcomes and differentiating performance between groups. During the implementation phase, the experimental group interacted with the developed web-based media over three weeks. Teachers acted as facilitators, guiding students to explore modules, attempt interactive quizzes, and watch embedded videos both in class and independently. Meanwhile, the control group continued learning through conventional explanations and textbook-based exercises. Evaluation The evaluation stage involved both qualitative observations and quantitative analyses to determine the practicality and effectiveness of the developed media. Teachers reported that students in the experimental group exhibited higher motivation, greater curiosity, and improved collaboration compared to those in the control group (Anjarsari et al. , 2020. Supriadi et al. , 2. A feasibility questionnaire administered to 35 students of class XI-F yielded a mean score of 83. 61%, which was categorized as very feasible. This result indicated that the media was practical and appropriate for supporting computer networking learning. In addition, statistical testing confirmed the effectiveness of the intervention. The normality test showed that the data were normally distributed, while the homogeneity test indicated that both groups had equal variance. A paired sample t-test further revealed a statistically significant improvement in learning outcomes in the experimental class compared to the control class . < 0. These findings demonstrate that the developed web-based media effectively enhanced studentsAo digital literacy and learning Table 3. Results of the respondent questionnaire . No Aspect Score Obtained Maximum Score Eligibility Percentage (%) General aspects Product feasibility aspects Ease of learning aspects Total The N-Gain analysis further reinforced the effectiveness of the developed media. The experimental class achieved a 75% increase . ffective categor. , while the control class reached 64% . oderately effective categor. These results confirm that the web-based media successfully enhanced both studentsAo conceptual understanding and their digital literacy. Notably, the findings demonstrate that the media addressed the limitations of conventional instruction, which had relied heavily on lectures and textbooks and often limited student By incorporating interactive and multimedia-rich resources, the learning process became more dynamic, enabling students to take a more active role in constructing knowledge. Several key insights can be drawn from these results. Effectiveness of Multimedia Integration One of the most significant contributions of the media lies in its integration of multimedia elements, including videos, interactive quizzes, and structured written materials. These features enhanced engagement and accessibility, consistent with MayerAos Cognitive Theory of Multimedia Learning, which posits that dual-channel . erbal and visua. presentations reduce cognitive overload and facilitate deeper processing. For instance, videos helped students visualize abstract concepts, such as network topologies. Animations illustrated processes that are difficult to explain using static Indonesian Journal of Educational Development (IJED), 6. , pp. diagrams, and quizzes provided immediate practice and feedback. Gamification features in Quizizz further increased student motivation. This combination bridged the gap between theory and practice, supporting active, meaningful learning in line with constructivist principles. Improvement in Digital Literacy Another key outcome was the development of studentsAo digital literacy beyond subject-specific By engaging with online modules, quizzes, and multimedia resources, students built competencies aligned with UNESCOAos framework and the European CommissionAos DigComp model, which defines digital literacy as encompassing cognitive, social, and ethical dimensions. Students reported increased confidence in navigating online resources and applying digital tools to solve problems. Teachers observed greater independence, with students actively seeking out and applying information skills that are crucial for higher education and future workplaces. Consistency with Previous Research The findings are consistent with prior studies emphasizing the benefits of web-based learning. For example. Haluti et al. reported improved engagement and achievement through the integration of Google Sites and Quizizz, while Kusumawati et al. highlighted how projectbased web learning enhances creativity and critical thinking. Similarly. Rahman et al. demonstrated the effectiveness of web-based instructional models in vocational subjects. These consistencies reinforce the external validity of the present study, indicating that web-based media can be broadly applied across disciplines. Overall, the study demonstrates that the systematic application of the ADDIE model in developing web-based media, supported by accessible tools such as Blogger. Canva, and Quizizz, results in products that are pedagogically robust and contextually relevant for Indonesian schools. The integration of multimedia not only improved studentsAo understanding of computer networking concepts but also advanced their digital literacy, contributing to the broader discourse on technology-enhanced learning in secondary education. Limitations and Areas for Improvement Despite its promising results, this study had several limitations that should be acknowledged. First, some students experienced difficulties due to limited internet access, which hindered their engagement with web-based media outside of school hours. This reflects ongoing disparities in digital infrastructure, particularly in regions with unstable or unaffordable connectivity. Future development should therefore consider offline-compatible features or downloadable modules to ensure equitable access. Second, the study revealed challenges related to student self-regulation. Although the web-based media offered flexibility and autonomy, not all learners were able to manage their time effectively or maintain concentration during independent study. This suggests the need for complementary strategies such as teacher-provided study schedules, progress monitoring, or blended learning models that combine online autonomy with structured face-to-face support. Finally, the study was conducted in a single school with a relatively small sample size, which limits the generalizability of the findings. Contextual factors such as infrastructure readiness, teacher competence, and student demographics may vary across schools. Future research should therefore replicate the study in diverse contexts and subject areas to provide more robust evidence of scalability and broader applicability. Indonesian Journal of Educational Development (IJED), 6. , pp. Conclusion This study concluded that the web-based learning media for computer networking developed using the ADDIE model was feasible, practical, and effective. Expert validation indicated high suitability . % from subject matter experts and 75% from media expert. , while student responses . %) confirmed that the media was engaging and accessible. Effectiveness was further demonstrated by significant improvements in learning outcomes, with the experimental class achieving an N-Gain of 75% . n the effective categor. compared to 64% . oderately effectiv. in the control class. These findings confirm that the media successfully enhanced studentsAo conceptual understanding and digital literacy, providing a meaningful alternative to conventional textbook-based instruction. Theoretically, the study reinforces the ADDIE model as a structured and reliable framework for educational product development, while also confirming the relevance of MayerAos Cognitive Theory of Multimedia Learning. The integration of videos, animations, and interactive quizzes facilitated dualchannel processing and active engagement, thereby supporting the principles of constructivist Furthermore, the observed improvements in digital literacy are consistent with international frameworks such as UNESCOAos definition and the European CommissionAos DigComp model. Practically, the study demonstrates that affordable platforms such as Blogger. Canva, and Quizizz can be effectively combined to create interactive and accessible digital learning environments. This has important implications for resource-limited schools, showing that meaningful technology integration is possible without high investment. The findings also align with IndonesiaAos Merdeka Belajar policy, promoting learner autonomy, flexibility, and digital readiness. Although promising, the study is limited by its relatively small sample size, single-school context, and short-term focus. Challenges related to internet access and student self-regulation also warrant Future studies should therefore explore broader contexts, conduct longitudinal evaluations of learning outcomes, and integrate emerging technologies such as augmented reality or artificial intelligence. Furthermore, additional research on teacher professional development is recommended to ensure the sustainability and scalability of web-based media in diverse educational Bibliography