Δομή_ακολουθίας

Η Δομή Ακολουθίας στον Αλγόριθμο

Εισαγωγή στις Αρχές Υπολογιστών – Β’ Λυκείου

Η δομή ακολουθίας αποτελεί τη βασικότερη και πιο απλή μορφή εκτέλεσης εντολών σε έναν αλγόριθμο.
Κάθε πρόγραμμα, όσο σύνθετο κι αν είναι, στηρίζεται σε αυτήν τη θεμελιώδη ιδέα:
οι εντολές εκτελούνται με τη σειρά που γράφονται, από την πρώτη έως την τελευταία.


🧠 Τι είναι η δομή ακολουθίας;

Στη δομή ακολουθίας, δεν υπάρχουν επιλογές ή επαναλήψεις.
Ο αλγόριθμος απλώς εκτελεί διαδοχικά κάθε βήμα.
Αυτό το είδος λογικής είναι ιδανικό για να:

  • διαβάσουμε δεδομένα από τον χρήστη,

  • κάνουμε πράξεις ή υπολογισμούς,

  • εμφανίσουμε αποτελέσματα.

Με άλλα λόγια, ένας αλγόριθμος ακολουθίας αποτελείται από τρεις φάσεις:

  1. Είσοδος δεδομένων (π.χ. ΔΙΑΒΑΣΕ)

  2. Επεξεργασία (π.χ. πράξεις ή εκχωρήσεις)

  3. Έξοδος αποτελεσμάτων (π.χ. ΓΡΑΨΕ)


🧾 Παράδειγμα

Ακολουθεί ένα απλό παράδειγμα αλγορίθμου που υπολογίζει το άθροισμα δύο αριθμών:

Αλγόριθμος Άθροισμα
ΔΙΑΒΑΣΕ α, β
sum ← α + β
ΓΡΑΨΕ 'Το άθροισμα είναι: ', sum
Τέλος_Άθροισμα

Η εκτέλεση ξεκινά από την πρώτη εντολή και συνεχίζει μέχρι το τέλος χωρίς διακλαδώσεις.


🧮 Γιατί είναι σημαντική η δομή ακολουθίας;

Η δομή ακολουθίας:

  • μας βοηθά να σκεφτόμαστε βήμα–βήμα,

  • είναι η βάση πάνω στην οποία χτίζονται οι πιο σύνθετες δομές (επιλογής και επανάληψης),

  • μας επιτρέπει να κατανοήσουμε τη ροή ενός προγράμματος,

  • ενισχύει την αλγοριθμική σκέψη, ειδικά όταν τη συνδυάζουμε με παραδείγματα και εκτέλεση σε ψευδογλώσσα.


💻 Εφαρμογή στην Pseudoglossa

Η Pseudoglossa είναι ένα εξαιρετικό περιβάλλον για να εφαρμόσουν οι μαθητές τις έννοιες αυτές.
Μπορούν να γράψουν τους δικούς τους αλγορίθμους, να εκτελέσουν βήμα–βήμα και να δουν τα αποτελέσματα στην πράξη.

Ενδεικτικά παραδείγματα:

  • Υπολογισμός μέσου όρου βαθμών

  • Υπολογισμός τελικής τιμής με Φ.Π.Α.

  • Μετατροπή χρόνου από λεπτά σε ώρες και λεπτά


✏️ Φύλλα Εργασίας

Για να εξασκηθούν οι μαθητές, ετοίμασα δύο φύλλα εργασίας:

Φύλλο 1: 

    https://blogs.sch.gr/lenaanag/files/2025/10/fyllo-ergasias_1_diadrastiko_akoloythia-1.pdf

Φύλλο 2:


Φόρτωση PDF…


Φόρτωση PDF…

Φύλλο 3:


Φόρτωση PDF…

Φύλλο 4:


Φόρτωση PDF…

HOMEWORK


Φόρτωση PDF…

Λύσεις ασκησεων

1η Ασκηση

<!DOCTYPE html>
<html>
<head>
<meta charset=”UTF-8″>
<title>Η σημασία της τεχνολογίας</title>
</head>
<body>
<h1 style=”text-align: center;”>Η σημασία της τεχνολογίας στη σύγχρονη εποχή</h1>
<hr>

<p>
Η τεχνολογία έχει αλλάξει ριζικά τον τρόπο που ζούμε, εργαζόμαστε και επικοινωνούμε. <br>
Καθημερινά χρησιμοποιούμε <b>υπολογιστές</b>, <b>κινητά τηλέφωνα</b> και το <i>διαδίκτυο</i>
για να μαθαίνουμε, να διασκεδάζουμε και να συνεργαζόμαστε με άλλους ανθρώπους. <br><br>
Ωστόσο, η υπερβολική χρήση της τεχνολογίας μπορεί να έχει και αρνητικές συνέπειες, όπως
η <u>απομόνωση</u> ή η <u>εξάρτηση</u>. <br>
Είναι σημαντικό να χρησιμοποιούμε την τεχνολογία
<b>με σύνεση</b> και <i>υπευθυνότητα</i>, ώστε να αξιοποιούμε τα οφέλη της χωρίς να επηρεάζουμε
αρνητικά την καθημερινή μας ζωή.
</p>
</body>
</html>

Εικόνες και υπερσύνδεσμοι σε Ιστοσελίδες.

Θεωρία Μαθήματος: Εικόνες, Σύνδεσμοι σε Ιστοσελίδες

🎯 Στόχοι

Μετά το μάθημα οι μαθητές θα μπορούν:

  • να αναγνωρίζουν τη χρήση της HTML ως γλώσσα δημιουργίας ιστοσελίδων.

  • να γνωρίζουν τη λειτουργία της ετικέτας <img>
  • να κατανοούν τη χρήση των ιδιοτήτων scr, alt, width και height
  • να γνωρίζουν τη λειτουργία της ετικέτας <a> για δημιουργία υπερσυνδέσμων.
  • Να κατανοούν τη χρήση των ιδιοτήτων href και target=”_blank”

1. Τι είναι η HTML (υπενθύμιση)

Η HTML (HyperText Markup Language) είναι η γλώσσα που περιγράφει τη δομή μιας ιστοσελίδας.
Αποτελείται από ετικέτες (tags) που δηλώνουν τι ρόλο έχει κάθε στοιχείο.

Παράδειγμα:

<html>
<head>
<title>
Η πρώτη μου σελίδα</title>
</head>
<body>
<h1>
Καλώς ήρθατε!</h1>
<p>
Αυτό είναι ένα παράδειγμα HTML.</p>
</body>
</html>

🟢 Το <body> περιέχει το περιεχόμενο της σελίδας (κείμενα, εικόνες, συνδέσμους κλπ).
🔵 Οι ετικέτες γράφονται μέσα σε αγκύλες και συνήθως έρχονται σε ζεύγη, π.χ. <p>...</p>.


 2. Εισαγωγή Εικόνας στην HTML

📘Για να βάλουμε   μια εικόνα στην ιστοσελίδα μας, χρησιμοποιούμε την ετικέτα <img>. Εδώ δεν χρειαζόμαστε ετικέτα κλεισίματος.

Παράδειγμα:

<img src="photo.jpeg" alt="Η φωτογραφία μου" width="300" height="200">

Επεξήγηση:

Ιδιότητα Περιγραφή
src δηλώνει τη διαδρομή ή το όνομα του αρχείου της εικόνας
alt εναλλακτικό κείμενο που εμφανίζεται αν δεν φορτώσει η εικόνα
width, height καθορίζουν το μέγεθος της εικόνας (σε pixels)

Προσοχή!!! 

Η εικόνα πρέπει να βρίσκεται στον ίδιο φάκελο με την ιστοσελίδα μου.

📘 Αν η εικόνα βρίσκεται στο διαδίκτυο αρκεί να χρησιμοποιήσουμε το σύνδεσμό της:

Παράδειγμα:
<img src="https://example.com/logo.png" alt="Λογότυπο">

practice:

εφαρμογή 1.

χρησιμοποιείστε τoν παρακάτω σύνδεσμο για να μεταβείτε στον ιστοτοπο που χρησιμοποιούμε για την εκμάθηση html.
                                                          👉    https://www.w3schools.com/html/html_images.asp
  • βρείτε μια εικόνα στο διαδίκτυο, αντιγράψτε τo url και βάλτε το στο μέσα στο img src                                                                                                              (ενδεικτική url              https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcQ8Uo77Py-Q-cLNMElH8K05vPK0wu1gU1Invw&s
  • αλλάξτε τις τιμές του width  και του height

  Δραστηριότητα 1.

Οδηγίες

  1. Δημιούργησε ένα αρχείο school.html.
  2. Γράψε έναν τίτλο (<h1>) με το σχολείο (π.χ. “Το σχολείο μου”).
  3. Βάλε μία εικόνα σχετική με το σχολείο (μπορείτε να χρησιμοποιήσετε την παρακάτω).
  4. Χρησιμοποίησε το χαρακτηριστικό alt ώστε, αν δεν εμφανίζεται η εικόνα, να φαίνεται επεξηγηματικό κείμενο.
  5. Ρύθμισε το πλάτος (width) κάθε εικόνας στα 300 pixels.
  6. Πρόσθεσε μια μικρή περιγραφή με <p> κάτω την εικόνα.

school

photo

 

χρησιμοποιείστε το πρότυπο-κώδικα παρακάτω (προσοχή πρέπει να βάλετε το σωστό path ή όνομα  της εικόνας σας, ή το όνομα της εικόνας;)

<!DOCTYPE html>
<html>
<head>
<title>              </title>
</head>

<h1>εισαγωγή εικόνας </h1>

</body>
</html>

 


 3. Εισαγωγή Υπερσυνδέσμου (Link)

Οι υπερσύνδεσμοι δημιουργούνται με την ετικέτα <a>.

📘Παράδειγμα υπερσυνδέμου:

<a href="https://www.google.com">Επισκέψου τη Google</a>
ή
<a href="https://www.google.com" target="_blank"> Επισκέψου τη Google</a>
                                                

Επεξήγηση:

Ιδιότητα Περιγραφή
href η διεύθυνση (URL) που θα ανοίξει ο σύνδεσμος
target=”_blank” ανοίγει τη σελίδα σε νέα καρτέλα

Practise

εφαρμογή 2

χρησιμοποιείστε τον παρακάτω σύνδεσμο για να μεταβείτε στον ιστοτοπο που χρησιμοποιούμε για την εκμάθηση html.
                                                          👉  https://www.w3schools.com
  • βρείτε μια ιστοσελίδα της αρεσκείας σας στο διαδίκτυο, αντιγράψτε τo url και βάλτε το στο μέσα στο  href                                                                                  (ενδεικτική σελίδα https://www.travel.gr/experiences/chora-skopeloy-taxidi-sti-mageytiki-mi/)       

Ερώτηση:

  • Πως θα κάνουμε μια εικόνα υπερσύνδεσμο όταν έχεις τον παρακάτω σύνδεσμο και μια εικόνα Wiki?????
    <a href="https://www.wikipedia.org"></a>

    <img src="wiki.jpeg" alt="Wikipedia">

     

Δραστηριότητα 2

οδηγίες

  1. Δημιούργησε ένα αρχείο Skopelos.html.
  2. Προσθέστε έναν υπερσύνδεσμο που να οδηγεί σε μια ιστοσελίδα σχετική με τη Σκόπελο  (πχ,  https://www.skopelos.gov.gr/)
  3. Πρόσθεσε 1 εικόνα Απο τη Σκόπελο  .
  4. Κάνε για την  εικόνα σύνδεσμο που οδηγεί στο αντίστοιχο site
  5. O σύνδεσμος να ανοίγει σε νέα καρτέλα.
  6. Μην ξεχάσετε να προσθέσετε τίτλο  στη σελίδα σου.
  7. Αν θέλετε μπορείτε να προσθέσετε και παραπάνω εικόνες-υπερσυνδέσμους.

skopelos

 Ας αξιολογήσουμε τις γνώσεις μας

μεταβείτε στη σελίδα:

https://wayground.com/join?gc=20821409

…….και περιμένετε να λάβετε κωδικό!!!

Εισαγωγή στην HTML

ΣΧΕΔΙΟ ΜΑΘΗΜΑΤΟΣ

 

https://blogs.sch.gr/lenaanag/files/2025/10/SCHEDIO_MATHHMATOS1.pdf

Εισαγωγή στην HTML

Η HTML (HyperText Markup Language) είναι η βασική γλώσσα σήμανσης που χρησιμοποιείται για τη δημιουργία ιστοσελίδων. Δημιουργήθηκε στις αρχές της δεκαετίας του 1990 από τον Tim Berners-Lee, ερευνητή του CERN, ο οποίος επιδίωξε να βρει έναν τρόπο ανταλλαγής επιστημονικών πληροφοριών μεταξύ υπολογιστών μέσω υπερσυνδέσμων. Η πρώτη έκδοση της HTML αποτέλεσε τη βάση για την ανάπτυξη του Παγκόσμιου Ιστού (World Wide Web).

Σήμερα, η HTML συνεχίζει να εξελίσσεται και αποτελεί τη θεμελιώδη γλώσσα για την ανάπτυξη ιστοσελίδων, σε συνδυασμό με τις CSS (Cascading Style Sheets) και τη JavaScript.


🏗️ Δομή εγγράφου HTML

Κάθε ιστοσελίδα σε HTML έχει συγκεκριμένη δομή, που ξεκινά από την ετικέτα δήλωσης τύπου <!DOCTYPE html> και οργανώνεται μέσα στις ετικέτες <html>, <head> και <body>.

Παράδειγμα:

<!DOCTYPE html>
<html>
<head>
<title>Η πρώτη μου ιστοσελίδα</title>
</head>
<body>
<h1>Καλώς ήρθατε!</h1>
<p>Αυτή είναι η πρώτη μου ιστοσελίδα σε HTML.</p>
</body>
</html>
  • Το <head> περιέχει πληροφορίες για τη σελίδα (π.χ. τίτλος, χαρακτήρες, συνδέσεις με CSS).

  • Το <body> περιέχει το ορατό περιεχόμενο που προβάλλεται στον φυλλομετρητή.

  • Οι ετικέτες HTML έχουν αρχή και τέλος, π.χ. <p>...</p> για παράγραφο, <h1>...</h1> για επικεφαλίδα.


✨ Βασικές ετικέτες και ιδιότητες

Η HTML διαθέτει πολλές ετικέτες που καθορίζουν τη δομή και τη σημασία του περιεχομένου.
Μερικές βασικές είναι:

Ετικέτα Χρήση
<h1>…<h6> Επικεφαλίδες διαφόρων επιπέδων
<p> Παράγραφος κειμένου
<img src="..." alt="..."> Εισαγωγή εικόνας
<a href="...">...</a> Υπερσύνδεσμος
<br> Αλλαγή γραμμής
<hr> Οριζόντια γραμμή
<b>, <i>, <u> Έντονη, πλάγια και υπογραμμισμένη γραφή αντίστοιχα

Κάθε ετικέτα μπορεί να έχει ιδιότητες (attributes) που προσθέτουν πληροφορίες, όπως πλάτος (width), ύψος (height), εναλλακτικό κείμενο (alt) ή προορισμό συνδέσμου (href).


💻 Δραστηριότητα

Για να εξασκηθείτε, δημιουργήστε το δικό σας αρχείο index.html και αντιγράψτε ένα σύντομο κείμενο από το ιστολόγιο.
Προσπαθήστε να το μορφοποιήσετε χρησιμοποιώντας ετικέτες επικεφαλίδων, παραγράφων και γραμμών (<h1>, <p>, <br>, <hr>).

Στη συνέχεια, πηγαίνετε στη δραστηριότητα του φύλλου εργασίας:
👉 “Εισαγωγή στην HTML – Γίνε HTML ντετέκτιβ!”,
όπου θα εντοπίσετε και θα διορθώσετε σφάλματα σε έτοιμο κώδικα.

ΦΥΛΛΟ ΕΡΓΑΣΙΑΣ

Φύλλο_Εργασίας_Εισαγωγή_στην_HTML_Ελένη_Αναγνωστοπούλου

ΑΥΤΟΑΞΙΟΛΟΓΗΣΗ

https://docs.google.com/forms/d/1xb5veM-Pgc0KXD8dPBNg_9M0v4ioQP4eOwKJZF4Wbek/preview

  👉Εδώ θα βρεις μια σελίδα  όπου θα μετατρέπει κατευθείαν τις εντολές της HTML σε σελίδα

https://www.w3schools.com/html/html_basic.asp

 

Εισαγωγή_στην_HTML_Ελένη_Αναγνωστοπούλου

Το πρότυπο κώδικα είναι το παρακάτω:

<!DOCTYPE html>

<html>

<head>

<title>Η πρώτη μου ιστοσελίδα</title>

</head>

<body>

<h1>Καλώς ήρθατε!</h1>

<p>Αυτή είναι η πρώτη μου ιστοσελίδα σε HTML.</p>

</body>

</html>

 

Δημιουργείστε την παρακάτω σελίδα

Stigmiotypo othonhs 2025 10 12 000206

το κείμενο:

Η τεχνολογία έχει αλλάξει ριζικά τον τρόπο που ζούμε, εργαζόμαστε και επικοινωνούμε.
Καθημερινά χρησιμοποιούμε υπολογιστές, κινητά τηλέφωνα και το διαδίκτυο για να μαθαίνουμε, να διασκεδάζουμε και να συνεργαζόμαστε με άλλους ανθρώπους.
Ωστόσο, η υπερβολική χρήση της τεχνολογίας μπορεί να έχει και αρνητικές συνέπειες, όπως η απομόνωση ή η εξάρτηση.Είναι σημαντικό να χρησιμοποιούμε την τεχνολογία με σύνεση και υπευθυνότητα, ώστε να αξιοποιούμε τα οφέλη της χωρίς να επηρεάζουμε αρνητικά την καθημερινή μας ζωή.

ΕΡΕΥΝΑ ΣΕ ΜΑΘΗΤΕΣ/ΤΡΙΕΣ ΔΕΥΤΕΡΟΒΑΘΜΙΑΣ ΕΚΠΑΙΔΕΥΣΗΣ: Σχολικός Επαγγελματικός Προσανατολισμός

H έρευνα διεξάγεται πανελλαδικά σε σχολικές μονάδες δευτεροβάθμιας εκπαίδευσης, με στόχο τη χαρτογράφηση των απόψεων των μαθητριών και μαθητών δευτεροβάθμιας εκπαίδευσης σε σειρά ζητημάτων που άπτονται κυρίως του επαγγελματικού προσανατολισμού και της επαγγελματικής αποκατάστασης.

Σκοπός της έρευνας είναι η κατανόηση παραγόντων σχετικών με τις επαγγελματικές τους φιλοδοξίες και της επιλογής των επαγγελμάτων που θα ακολουθήσουν στο μέλλον. Οι πληροφορίες που θα συλλεχθούν αναμένεται να προσφέρουν πολύτιμη γνώση σχετικά με τις ανάγκες, τις προτεραιότητες και τις προκλήσεις που αντιμετωπίζουν οι νέοι. Τα ευρήματα της έρευνας θα αξιοποιηθούν για την τεκμηριωμένη ενημέρωση και ενδεχόμενη προσαρμογή των εκπαιδευτικών πολιτικών και προγραμμάτων, λαμβάνοντας υπόψη τις τάσεις και τις προτιμήσεις των μαθητών/τριών.

Η συμμετοχή στην έρευνα είναι απολύτως εθελοντική και ανώνυμη. Δεν θα συλλεχθούν προσωπικά στοιχεία που θα μπορούσαν να οδηγήσουν στην ταυτοποίηση των μαθητών/τριών. Όλες οι απαντήσεις θα χρησιμοποιηθούν αποκλειστικά για ερευνητικούς σκοπούς και θα αναλυθούν σε συγκεντρωτικά, ώστε να μην είναι δυνατή η σύνδεση οποιασδήποτε απάντησης με συγκεκριμένο άτομο.

Η έρευνα συμμορφώνεται πλήρως με τον Γενικό Κανονισμό για την Προστασία των Προσωπικών Δεδομένων (GDPR 2016/679) και τις κατευθυντήριες οδηγίες του Ινστιτούτου Εκπαιδευτικής Πολιτικής.

πατήστε στον παρακάτω σύνδεσμο ή αντιγράψτε τον και επικολλήστε τον σε έναν φυλλομετρητή.

https://ee.kobotoolbox.org/x/1fSdVdpY