Ξεκινώντας το web design…




Σίγουρα το web design είναι κάτι πολύ ελκυστικό στο σημερινό νέο! Είναι ένας τομέας που έχει προοπτικές εξέλιξης και πάρα πολλούς τομείς. Άρα είναι δεδομένο ότι προς το παρόν δεν μπορεί να θεωρηθεί κορεσμένος.
Το πως ξεκινάς όμως να μαθαίνεις, όμως είναι πρόβλημα! Αυτή τη περίοδο, υπάρχουν πάρα πολλές ωραίες πηγές, άλλες δωρεάν άλλες όχι. Κι όλες αξίζουν αναφοράς! Με ένα γρήγορο search στο google ή ακόμα και στο wdf.gr θα βρει κανείς περισσότερες πηγές από όσες χρειάζεται.
Αλλά δεν θα αναφερθώ σε πηγές, μια και αυτό είναι κάτι που είναι μεταβλητό, και κάτι που σήμερα είναι κατάλληλο και μοντέρνο σε μερικούς μήνες, ίσως θεωρείται ξεπερασμένο.
Πολλοί ρωτάνε για βιβλία και πως θα ξεκινήσουν να μαθαίνουν τα απαραίτητα για web design. Άλλοι πάλι πιστεύουν, ότι το να ξέρουν html, css και javascript, ακόμη και τα βασικά τους κάνει “web developers”…
Προσωπικά, δεν θεωρώ πως ξέρω πολλά πράγματα. Ούτε θέλω να μιλήσω από την θέση του ειδικού γιατί αν λες πως είσαι ειδικός σήμερα, αύριο είναι δεινόσαυρος.
Ο σκοπός μου είναι να δώσω ένα απλό guideline, μία γραμμή οδηγιών που έχω ανακαλύψει ότι δουλεύει.
Πρέπει να ξέρουμε ότι η html είναι markup language
Αυτό σημαίνει ότι είναι μία εκτεταμένη γλώσσα επισήμανσης, και κατά τον ίδιο τρόπο που προσπαθούμε στις σημειώσεις μας, με αλλαγές γραμμών, διαφορετικά χρώματα στυλό, πιο παχιές ή λεπτές γραμμές, κενές περιοχές, πιο μεγάλα γράμματα,  να χαρακτηρίσουμε τις περιοχές του κειμένου μας. Κατά τον ίδιο τρόπο, πρέπει να λειτουργούμε και στην html. Εφόσον έχουμε μία μικρή γνώση της αγγλικής γλώσσας και ξέρουμε τι ψάχνουμε, η διαδικασία εκμάθησης είναι σχετικά απλή.
H CSS δεν θέλει μόνο εκμάθηση αλλά και οργάνωση! 
Η css (Cascading Style Sheets), είναι μία γλώσσα διακόσμησης/μορφοποίησης,  που δομείται από συγκεκριμένα αντικείμενα ή αλλιώς κατηγορίες λέξεων. Δείτε το παρακάτω παράδειγμα:






.myClass a {

position: relative;

width: 960px;

}
το myClass a λέγεται επιλογέας ή selector, ότι είναι μέσα στις αγκύλες {} λέγεται περιοχή δηλώσεων ή declaration block. Κάθε γραμμή είναι μία δήλωση ή declaration. Η πρώτη λέξη (λέξη θεωρώ ότι είναι μία συμβολοσειρά που δεν περιέχει !@#$%^&*(),.?/\|{}~*+_) κάθε γραμμής λέγεται ιδιότητα ή property, και η τιμή μετά το : αν είναι λέξη ονομάζεται keyword/λέξη κλειδί, αν είναι κάποιος αριθμός ονομάζεται τιμή ή value.
Εφόσον λοιπόν, κατανοούμε το λεξιλόγιο. Έχουμε κάνει το πρώτο και σοβαρότερο βήμα. Γιατί δεν υπάρχει πουθενά, βιβλίο που να περιέχει όλη τη css, γιατί απλά εξελίσσεται τόσο γρήγορα από το w3c και τους κατασκευαστές browsers, που για να βγάλει κάποιος ένα τέτοιο βιβλίο, θα έπρεπε να είναι κυριολεκτικά μέντιουμ!
Αυτό που πρέπει να ξέρουμε επίσης είναι να αξιολογούμε την οργάνωση του κώδικα μας! Στην οργάνωση υπάρχει ένας απλός, παιχνιδιάρικος τρόπος να την μετρήσεις. Θεωρείς την id ότι πιάνει 100 πόντους, την κλάση 10 πόντους και το tag 1 πόντο, ενώ υπάρχει και το !important που πιάνει 1000 πόντους.
Όσους περισσότερους πόντους μαζέψεις μετρώντας τους επιλογείς σου, τόσο πιο ανοργάνωτο κώδικα έχεις. Οπότε προσπαθείς να μειώσεις τους πόντους ακριβείας με μερικές απλές τεχνικές, όπως η μετατροπή κάποιων id’s σε κλάσεις! Και μερικές πιο πολύπλοκες όπως η λογική της αντικειμενοστραφούς css!

Αν μάθω javascript, λύνω το πρόβλημα του δυναμικού περιεχομένου;
Αν μιλάμε για το παρόν όσο αφορά πρακτικές λύσεις, όχι! Αυτό δεν ισχύει. Σε μερικά χρόνια, θα είναι μία πραγματικότητα. Η javascript προσφέρεται σαν ελαφριά λύση. Ωστόσο, το node.js έχει πάρα πολύ μέλλον και θα είναι έγκλημα αν κάποιος το αγνοήσει!
Επιπλέον πρέπει να ξέρουμε ότι η javascript, εξελίσσεται κι αυτή μαζί με τους browsers, οπότε δεν υπάρχει βιβλίο που να το διαβάσεις και να γίνεις γκουρού. Οπότε πάλι η λύση είναι η online πηγές, και η σελίδες τεκμηρίωσης των browsers όπως η mdn της mozilla. Ωστόσο πρώτα απ’ όλα πρέπει να ξέρουμε τι χρειαζόμαστε! Κι αν είναι κάποιος καινούργιος στον προγραμματισμό. Θα ήταν έξυπνο να δουλέψει παράλληλα με κάποια γλώσσα όπως η C++ ή τη Java, γιατί έτσι θα πάρει μία ιδέα πως τρέχει από κάτω ο κώδικας  javascript.
Το παν είναι να ξεκινήσει κάποιος με οργανωμένη σκέψη και με αργά βήματα. Αν προσπαθήσεις να μάθεις πολλά πράγματα μαζί, το αποτέλεσμα θα είναι πενιχρό!

Θέλω κάτι άλλο για να ξεκινήσω το web development;
-Σίγουρα, πάρα πολλά! Αυτή τη στιγμή πρέπει να μάθεις σίγουρα μερικά CMS, php frameworks και βιβλιοθήκες, javacript frameworks και βιβλιοθήκες,  css frameworks, photoshop, όπως και βασικές γνώσεις φυσικής και μαθηματικών, επιπέδου πρώτης (ενιαίου) λυκείου!
Κατηγορίες:
Σχόλια