Dreamweaver CS6 Για Dummies Cheat Sheet - ανδρείκελα

Με τη Janine Warner

Αν είστε νέος στο σχεδιασμό ιστοσελίδων ή δημιουργείτε σελίδες HTML για χρόνια, το Adobe Dreamweaver CS6 είναι το ιδανικό εργαλείο για την οικοδόμηση της ιστοσελίδας σας. Στην έκδοση CS6, θα βρείτε μια νέα οθόνη καλωσορίσματος και υποστήριξη για τα πιο πρόσφατα φύλλα στυλ Cascading (CSS3) και HTML5. Το Dreamweaver είναι ένα δημοφιλές πρόγραμμα ανάμεσα σε επαγγελματίες σχεδιαστές ιστοσελίδων, καθώς και ανθρώπους που θέλουν να δημιουργήσουν τοποθεσίες για τα χόμπι, τους συλλόγους τους, τις οικογένειες και τις μικρές επιχειρήσεις.

Η οθόνη υποδοχής Adobe Dreamweaver CS6

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

Dreamweaver CS6: Προσθήκη σκιών κειμένου με CSS3

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

πίστωση: Paul Gual, istockphoto. com

Το Dreamweaver CS6 περιλαμβάνει υποστήριξη για σκιά κειμένου CSS3 όταν χρησιμοποιείτε το παράθυρο Ιδιότητες στον πίνακα CSS Styles. Μπορείτε να δημιουργήσετε στυλ τάξης ή αναγνωριστικού με σκιά κειμένου και μπορείτε να προσθέσετε σκίαση κειμένου σε υπάρχοντα στοιχεία HTML, καθορίζοντας ένα στυλ ετικέτας, όπως το στυλ τίτλου 1 που χρησιμοποιείται στην εικόνα.

Ο κώδικας CSS3 που δημιουργεί τη σκιά κειμένου είναι

h1 {text-shadow: 2px 2px 3px # 000;}

Οι αριθμοί στον κώδικα καθορίζουν ότι η σκιά κειμένου θα πρέπει να επεκταθεί 2 εικονοστοιχεία προς τα δεξιά και 2 εικονοστοιχεία κάτω από το κείμενο με θόλωση 3-pixel. Επιπλέον, η σκιά δημιουργείται με το μαύρο χρώμα, που καθορίζεται από τον συντετμημένο δεκαεξαδικό κώδικα χρωμάτων # 000.

Όταν δημιουργείτε κανόνες για σκιά κειμένου, μπορείτε να ορίσετε έως και τέσσερις τιμές:

• Οριζόντια και κάθετη: Απαιτούνται οι δύο πρώτες αριθμητικές τιμές και ορίζονται οι οριζόντιες και κάθετες μετατοπίσεις - κείμενο (οριζόντια) και στα δεξιά του κειμένου (κάθετο).

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

• Χρώμα: Η τέταρτη τιμή καθορίζει το χρώμα της σκιάς και μπορεί να οριστεί χρησιμοποιώντας έναν δεκαεξαδικό κωδικό χρώματος ή έναν κωδικό χρώματος RGBa.

Μπορείτε να προσθέσετε μια σκιά κειμένου χρησιμοποιώντας το παράθυρο ιδιοτήτων στο κάτω μέρος του πλαισίου CSS Styles, όπως φαίνεται στην εικόνα.Για να το κάνετε αυτό, ακολουθήστε τα εξής βήματα:

1. Κάντε κλικ στο σύνδεσμο "Προσθήκη ιδιότητας" στην αριστερή πλευρά του παραθύρου "Ιδιότητες στυλ CSS".

2. Εισαγάγετε το όνομα κανόνα στυλ CSS3, σκιά κειμένου ή επιλέξτε τον κανόνα στυλ από την αναπτυσσόμενη λίστα.

   Αφού εμφανιστεί το όνομα στην αριστερή πλευρά, εμφανίζεται ένα μικρό βέλος στα δεξιά.

3. Κάντε κλικ για να επιλέξετε το βέλος στα δεξιά της σκιάς κειμένου.

   Εμφανίζεται ένα πλαίσιο.

4. Καταχωρίστε τις μετατοπίσεις X και Y, την ακτίνα θόλωσης και το χρώμα.

Ιστοσελίδες και πόροι για σχεδιαστές ιστοσελίδων

Οι έμπειροι σχεδιαστές ιστοσελίδων - είτε χρησιμοποιούν το Adobe Dreamweaver ή άλλο λογισμικό σχεδιασμού ιστοσελίδων - συχνά αναφέρονται σε ηλεκτρονικούς πόρους για να διατηρήσουν τις ικανότητές τους και να προσθέσουν ειδικές λειτουργίες στις ιστοσελίδες τους. Αυτή η λίστα σας διευκολύνει να βρείτε μερικούς ιστότοπους και ηλεκτρονικούς πόρους που μπορούν να σας βοηθήσουν με τα έργα σας στο web design.

• Υπηρεσίες φιλοξενίας ήχου και βίντεο:

  • YouTube

  • Vimeo

  • SoundCloud

• Blogging και προγράμματα CMS

  • Blogger

  • Joomla

  • MovableType

  • TypePad

  • Tumblr > WordPress

  • Υπηρεσίες κοινής χρήσης κοινωνικών μέσων

• Προσθέστε αυτό το

  • Share Lockerz

  • Υπηρεσίες αναφοράς επισκεψιμότητας:

• Google Analytics

  • Yahoo! Web Analytics

  • HubSpot

  • Δημοφιλή προγράμματα περιήγησης ιστού:

• Apple Safari

  • Google Chrome

  • Microsoft Internet Explorer

  • Mozilla Firefox

  • Opera

• Εργαλείο περιήγησης

  • BrowserShots

  • Δοκιμή Cross Browser

  • Sandbox από το Spoon (πρώην Xenocode)

  • Dreamweaver, CSS και web design resources:

• Κέντρο προγραμματισμού Dreamweaver

  • Web Design Training at DigitalFamily. com

  • Μετατροπές W3 HTML5 και CSS3 Πόροι

  • A List Apart