Approccio al Web Design

Le vostre creatività migliori

Moderatori: Gattinara, ModiMaccanici

ilario_seb
Maccanico attivo
Maccanico attivo
Avatar utente
Iscritto il: dom, 19 ago 2012 23:27
Messaggi: 276
Oggetto del messaggio: Approccio al Web Design

Messaggio Inviato: dom, 10 ago 2014 08:50

Hola amici Imaccanici, son abbastanza sicuro che alla fine questo messaggio sarà principalmente rivolto a faxus e gattinara, che da quel che ho letto in giro sono i due guru dell argomento, ma son sicuro che questo post potrà tornare utile a molti.
Volevo iniziare ad approcciarmi al Web Design, così da espandere i miei limiti e poi si sa, a chi non piace impararsi milioni di righe di codice?!
Premetto che attualmente non so nulla sull'argomento, ho dreamweaver installato ma non so se poi è il software più adatto ad accompagnarmi. Non so se mi sarà effettivamente utile, ma anche non conoscendo il codice HTML e CSS, credo di saper le basi del funzionamento che sta dietro i codici, l'anno scorso all'accademia che frequento ci fecero usare Processing, software permette di progettare, anche animazioni più o meno complicate, tramite codice; ma magari no e quindi dovrei iniziare proprio da 0! Mi rivolgo a voi che so che sicuramente mi consiglierete quello che reputate sia il modo migliore/giusto per iniziare a scrivere qualche riga. Thank you eventuali errori son dovuti alla scrittura da telefono mentre son ancora steso nel letto , capitemi :P
Gattinara
Web&Designer Expert
Web&Designer Expert
Avatar utente
Iscritto il: gio, 11 ago 2011 15:16
Messaggi: 761
Località: Roma
Contatta:

Top

Oggetto del messaggio: Re: Approccio al Web Design

Messaggio Inviato: dom, 10 ago 2014 11:29

Buongiorno Ilario, e complimenti per il coraggioso proposito Immagine
Per iniziare ti suggerisco di leggere alcune guide; ne troverai innumerabili tra le quali scegliere, ma mi permetto di segnalartene un paio di partenza:

HTML - Web design di base, consigli e best practices
CSS - Guida CSS di base

Dreamweaver è un buon applicativo sul quale imparare (molti webdesigner mi prenderebbero volentieri a tortorate per quest'affermazione, ma sono disposta a prendermene la responsabilità) e, più importante ancora è iniziare a giocare in fase di apprendimento, creando direttamente il template di un sito ed orchestrandone l'evoluzione insieme, magari in questo stesso post (con tanto di screenshot ed indettature).

Possiamo iniziare quando vuoi (attendo novelle per iniziare un mini tutorial di partenza su DW).
"Chiunque è degno di un ombrello"
Nikolàj Vsévolodovic Stavrogin

"Chiunque a quarant'anni non conosce emorroidi"
Armand Vedel
faxus
Pro-Expert 
Pro-Expert 
Avatar utente
Iscritto il: lun, 02 giu 2014 15:12
Messaggi: 26207
Località: Due Sicilie
Contatta:

Top

Oggetto del messaggio: Re: Approccio al Web Design

Messaggio Inviato: dom, 10 ago 2014 11:59

ilario_seb ha scritto:... mentre son ancora steso nel letto , capitemi
Fermo restando che i consigli di Gattinara sono sempre più autorevoli... A uno come te il consiglio da dare è uno solo... Un CMS...

In effetti l'approccio alla costruzione può essere di diverso tipo, e anche qui si rischiano tortorate ad affermarlo.
Dipende da cosa sai fare e di quali talento e conoscenze sei in possesso.

Non puoi comunque prescindere, nella costruzione di siti, da una dotazione interdisciplinare.
Devi avere competenze nei linguaggi e compilazione di codice, di grafica, di piattaforme informatiche e di protocolli web.

Ovviamente non puoi essere talentuoso in tutto, quindi dovrai scegliere l'approccio per te migliore.

Se definisci le tue conoscenze e capacità, una di quelle dette, più magari altre note relative a preferenze in queste attività, una risposta sarà più adeguata
ilario_seb
Maccanico attivo
Maccanico attivo
Avatar utente
Iscritto il: dom, 19 ago 2012 23:27
Messaggi: 276
Oggetto del messaggio: Re: Approccio al Web Design

Messaggio Inviato: dom, 10 ago 2014 12:37

Innanzitutto grazie a tutti e due per la disponibilità, è sempre un piacere trovare online persone che anche se non conosci son disposte ad aiutare il prossimo, e non è poco :D
Ho già aperto i due link e son pronto a leggermi e "studiarmi" quello che hanno da darmi.
Nella vita punto a diventare Grafico, i miei studi finora hanno preso questa direzione, è quello che mi piace e mi appassiona. Mi ritengo abbastanza capace e ho molta fiducia nelle mie capacità, anche altre persone con cui ho lavorato o frequentato mi hanno sempre detto che ho del talento, ma resto consapevole di come non sia un mestiere semplice e che l'esperienza se la fa da padrone, mi son reso conto di come quello che possono insegnarti in accademie e scuole e molto relativo a quanto poi accade nella realtà. Mi ritengo anche abbastanza fortunato, ho avuto diverse occasioni in cui ho fatto esperienza in aziende come stagista e ho anche iniziato una piccola collaborazione con un noto portale online.
Esser in grado di creare siti web ben fatti credo sia necessario oltre che interessante. Oggi intanto ho iniziato a seguire un "corso online" gratuito che spiega le basi mentre ti fa effettivamente scrivere un codice, ovviamente con molti aiuti, però è divertente ed ho già imparato qualcosina. Il risultato alla fine del primo step è stato questo, nulla di eclatante, son 35 righe di codice scarso, a cui vanno tolte le righe vuote ovviamente :P
Sarebbe molto interessante se insieme potremmo guardare i pastrocchi che creerò nel tempo e migliorarli insieme, vi lascio con uno screen di quello che DreamWeaver e Dash mi hanno portato.

@faxus: Puoi essere un po più preciso con la storia del Content Menager Software? (Si, l'ho googlato :P)


Immagine
Gattinara
Web&Designer Expert
Web&Designer Expert
Avatar utente
Iscritto il: gio, 11 ago 2011 15:16
Messaggi: 761
Località: Roma
Contatta:

Top

Oggetto del messaggio: Re: Approccio al Web Design

Messaggio Inviato: dom, 10 ago 2014 12:52

Impossibile non essere d'accordo sulle necessarie competenze che un webdesigner dovrebbe connaturare, Faxus ma, in questo specifico caso, fido non si tratti esclusivamente delle capacità delle quali si è già in possesso.
Se Ilario avesse aperto un post chiedendo: "voglio farmi un sito e non so nulla di codice, come mi consigliate di procedere?", in tal caso il suggerimento più sensato da offrire ad un profano (una volta fatta chiarezza sulla tipologia di sito occorrentegli) sarebbe stato indirizzarlo verso CMS & affini, ma il quesito postoci mi sembra ben differente: "Volevo iniziare ad approcciarmi al Web Design, così da espandere i miei limiti."

Questo sottende (o dovrebbe) un proposito mirato ad un iniziale avvicinamento al codice HTML/CSS/JS; ovvio che, se intende convertire questo embrionale interesse nella costruzione di una figura lavorativa professionale dovrà affrontare ben altri piani di studio, integranti competenze estese (grafiche, strutturali, et cetera) e per nulla improvvisate/superficiali.

Io stessa (al pari di molti webdesigner) ho iniziato ad interessarmi all'argomento per puro diletto, priva persino di intenti lavorativi (speravo che lo studio di un argomento ignoto sfiancasse la mia insonnia, figurarsi).
Solo dopo un anno di giochi e bozze ne sono rimasta conquistata (al quale sono seguiti anni di apprendimento mirato - e non si finisce mai di studiare).

Posso anche aver capito male i moventi di Ilario e starmi facendo filmetti con rimandi autobiografici (quando si parla di codice il rischio è sempre presente :)
"Chiunque è degno di un ombrello"
Nikolàj Vsévolodovic Stavrogin

"Chiunque a quarant'anni non conosce emorroidi"
Armand Vedel
Gattinara
Web&Designer Expert
Web&Designer Expert
Avatar utente
Iscritto il: gio, 11 ago 2011 15:16
Messaggi: 761
Località: Roma
Contatta:

Top

Oggetto del messaggio: Re: Approccio al Web Design

Messaggio Inviato: dom, 10 ago 2014 13:02

ilario_seb ha scritto:Sarebbe molto interessante se insieme potremmo guardare i pastrocchi che creerò nel tempo e migliorarli insieme, vi lascio con uno screen di quello che DreamWeaver e Dash mi hanno portato.
Più che uno screenshot, in questo caso, dovresti integrare il link/codice dei tuoi esperimenti, altrimenti sono ben poche le indettature che potremmo fornirti - relegando (nel caso specifico del tuo esempio) eventuali suggerimenti al solo costrutto grafico ed alla controversa utilità connaturata dalle scarne monopagine di presentazione (bellamente/giustamente ignorate dai motori di ricerca).

N. d. F.: Da brava bradipa ho postato il mio previo intervento non accorgendomi della tua ultima replica.
"Chiunque è degno di un ombrello"
Nikolàj Vsévolodovic Stavrogin

"Chiunque a quarant'anni non conosce emorroidi"
Armand Vedel
faxus
Pro-Expert 
Pro-Expert 
Avatar utente
Iscritto il: lun, 02 giu 2014 15:12
Messaggi: 26207
Località: Due Sicilie
Contatta:

Top

Oggetto del messaggio: Re: Approccio al Web Design

Messaggio Inviato: dom, 10 ago 2014 14:06

Gattinara ha scritto:... Se Ilario avesse aperto un post chiedendo: "voglio farmi un sito e non so nulla di codice, come mi consigliate di procedere?", in tal caso il suggerimento più sensato da offrire ad un profano (una volta fatta chiarezza sulla tipologia di sito occorrentegli) sarebbe stato indirizzarlo verso CMS & affini, ma il quesito postoci mi sembra ben differente: "Volevo iniziare ad approcciarmi al Web Design, così da espandere i miei limiti."...
In effetti sono io che mi faccio i filmetti autobiografici...

Quando tornai in Italia, nel 2005, ricomprai subito un Mac (due, addirittura) e mi misi in mente di farmi un sito per delle cose che all'epoca ritenevo importanti.
Dopo un rapido giro mi buttai su Wordpress, ma nel giro di qualche ora mi si inceppò qualcosa nel database e mi scocciai subito: "Non ho tutto questo tempo, e poi non è maturo...".

Due anni dopo qualcuno mi chiese, "siccome ero grafico", di fargli un sito.
A questo punto non potei esimermi e glielo feci con Joomla, una tortura... Avevo scoperto che dovevo studiare codice!

Poi un po' l'ho fatto, anche lavorando spalla a spalla con Webalex (spero di vederlo su questo Forum, un giorno), adesso posso dire di essere un professionista, ma se non ho con me a studio (prima Valerio, oggi Federico) qualcuno che ne sa un po' di più, ogni tanto denuncio lacune.
Mi sono persino iscritto a dei corsi online, nel passato, a qualcosa son serviti.
Giorni fa ne ho aggiunto un altro, ma ancora non ho cominciato...

Continuo comunque ad usare i CMS, con risultati che soddisfano me e i clienti.
Poi, magari, a sito avanzato li vedrete sicuramente sul mio sito personale, non è il caso di postare qui i link.

Tutto questo sproloquio sta comunque a significare che sottoscrivo del tutto le indicazioni di Gattinara
ilario_seb
Maccanico attivo
Maccanico attivo
Avatar utente
Iscritto il: dom, 19 ago 2012 23:27
Messaggi: 276
Oggetto del messaggio: Re: Approccio al Web Design

Messaggio Inviato: dom, 10 ago 2014 16:08

Mentre continuavo a studiarmi le prime funzioni base seguendo i tutorial, mi trovo con dei dilemmi che non riesco a risolvere, inizio a postare il codice in modo tale che possiate suggerirmi quali errori ho fatto o come agire per superare i diversi ostacoli, vi dirò anche cosa voglio raggiungere per il momento, lo scopo finale è si farmi un sito personale (non son sicuro che andrà online ma come allenamento ci può stare) ma è anche quello di imparare bene come strutturare un sito funzionale e con un layout curato per un futuro sbocco professionale.

(non c'è un tasto spoiler in modo da alleggerire la lunghezza del post?)

Andando con ordine:
Vorrei rimuovere i margini che lascia la barra dell'header, quello superiore e quelli laterali, ho provato ad agire sul padding ma non son riuscito.
Nella barra del Search vorrei inserire l'iconcina della lente d'ingrandimento, all'interno, prima della scritta search, ho googlato ma nulla.
Vorrei che avesse più pagine, quindi collegare ogni sezione al suo link, come creo le diverse pagine su dreamweaver?
Vorrei rimuovere la striscia bianca sotto i nomi delle sezioni, Home, about me e contact, come fare?
Ho visto che per interagire sulla pesatura del font ci sono molti limiti, ad esempio io vorrei usare un ultralight, come posso fare?
Lo sfondo (che è scelto alla cavolo) molte volte alla prima caricatura della pagina vien caricato male, è il primo bug del sito? (che emozione :D)
Al momento quando riduco la pagina lo sfondo si adatta con lei insieme ai contenuti, però arriva al punto in cui inizia a clonarmi lo sfondo, non mi piace per niente, voglio che l'immagine sia sempre una, non so se mi son spiegato sprero di si :(
Come posso inserire le notine a piè di pagina che son sempre presenti nei siti?
Spero di non avervi rotto troppo, aspetto notizie, anche se per voi queste cose saranno la base per me è complicato ancora, ma son veramente eccitato all'idea di imparare a progettare siti! Thank you


Codice: Seleziona tutto

<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>Moose Design</title>
</head>
<style>
body {
	text-align: center;
	background: url("http://i.imgur.com/Pm5cNxl.png");
	background-size: cover;
	background-position: center;
	color: white;
	font-family: Helvetica Neue;
}
 p {
      font-size: 20px;
	font-weight: lighter;
    }
    input {
      border: 0;
      padding: 10px;
      font-size: 18px;
    }
    input[type="submit"] {
      background: #5BBEBC;
      color: white;
	}
	input[type="search"] {
      background: #5BBEBC;
	}
	a {
		color: white;
	}
	ul {
		font-size: 14px;
		margin: 0px;
      padding: 15px;
      background: rgba(91,190,188,1);
    }
    li {
      display: inline;
      padding: 0px 20px 0px 20px;
    }
</style>

<header>

<ul>
<li> <a href="#"> HOME </a></li>
<li> <a href="#"> ABOUT ME </a></li>
<li> <a href="#"> CONTACT </a></li>
<li> <input type="search" placeholder="Search">
</ul>
</header>

<body>
<img src="http://i.imgur.com/YSVXqC3.png">
<p>HELLO, I'M ILARIO SEBASTIANI, A 21 YEARS OLD GRAPHIC DESIGN FROM ROME.</p>
<input type="email" input placeholder="Subscribe">
<input type="submit">
</body>
</html>
Gattinara
Web&Designer Expert
Web&Designer Expert
Avatar utente
Iscritto il: gio, 11 ago 2011 15:16
Messaggi: 761
Località: Roma
Contatta:

Top

Oggetto del messaggio: Re: Approccio al Web Design

Messaggio Inviato: dom, 10 ago 2014 17:53

Andiamo con ordine: prima di occuparsi dei dettagli bisogna pensare alle basi e, se non sei ancora (giustamente, avendo appena iniziato) in grado di applicare la semplice proprietà CSS text-decoration: none; per eliminare la sottolineatura dei link ti suggerisco di modificare totalmente la frettolosa linea di approccio (generante solo frustrazioni e risultati approssimativi).

Appuntini iniziali:
le immagini presenti sul tuo sito devono essere copiate in locale e non richiamate da host esterni.
Ottimizza sempre le immagini: la foto di fondo, al coevo, connatura peso e risoluzione eccessivi (4928x3889: quasi 600KB!), e persino il tondello (per quanto minuto) occupa più di 80KB.
Puoi utilizzare lo strumento che preferisci per l'ottimizzazione:
da Photoshop selezionando "Salva per Web" dal menu "File" - prelazionando il formato .jpg per le bitmap ed un buon compromesso qualitativo (80, ad esempio);
con Gimp ignoro la procedura da seguire, ma Faxus saprà fornirti ulteriori indicazioni).

Tratteremo in maniera maggiormente estesa l'ulteriore/eventuale ottimizzazione dei file più avanti, in maniera da non rendere il post dispersivo.

Iniziamo col configurare un nuovo sito in Dreamweaver:
  1. prima di tutto orchestriamo un costrutto ordinato:
    crea una cartella in una directory di tuo piacimento (in Documenti, magari) titolata "bozza" (o come preferisci);
    dentro "bozza" copia il file .html da te prodotto (rinominandolo "index.html") e crea tre sottocartelle, titolate "css", "img" e "js";
  2. Inserisci le immagini (previamente locate su imgur) all'interno della cartella "img", dando loro degli esplicativi nomi privi di spazi (usa trattini od underscore), es:
    "fondo-index.jpg" al lenzuolone uccellato e "nome-cognome.jpg" al tuo ritratto.
  3. apri DW e, dalla tendina a comparsa del menu "Sito", seleziona "Nuovo sito..." secondando le seguenti istruzioni:
Immagine

Ovviamente tramite l'orrido pulsantino a forma di cartelletta selezionerai la tua cartella "bozze";

Immagine

dal sottomenu a sinistra seleziona informazioni locali e come cartella immagini predefinita seleziona la directory "img" previamente figliata.

Al seguito clicka su "Salva" e su "Fine" nell'eventuale schermata seguente.
(per il momento lavoreremo in locale, rimandando la configurazione del server ad altro tempo - tra l'altro in FTP Dreamweaver è un mattone, sarebbe meglio usare altri applicativi allo scopo: Cyberduck o Filezilla, ad esempio)

(sono quasi le sei, ed una vera Signora non rinuncia mai alla pausa per il the; tornerò più tardi con indettature sull'impostazione delle preferenze generali di DW)
"Chiunque è degno di un ombrello"
Nikolàj Vsévolodovic Stavrogin

"Chiunque a quarant'anni non conosce emorroidi"
Armand Vedel
ilario_seb
Maccanico attivo
Maccanico attivo
Avatar utente
Iscritto il: dom, 19 ago 2012 23:27
Messaggi: 276
Oggetto del messaggio: Re: Approccio al Web Design

Messaggio Inviato: dom, 10 ago 2014 18:15

Ok, allora lascio perdere quello che stavo facendo e iniziamo a fare a modo vostro :P
Per fortuna son un tipo ordinato e quindi devo già una cartella con dentro index.html e una sottocartella per le immagini (che però io solitamente chiamo source, ma ho già rinominato la cartella in img e creato le altre due).
Ho impostato Dreamweaver come mi hai gentilmente spiegato, modificato i link mettendoli in locale, e salvato le immagini per web. Per la misura del background in effetti è esagerata, quale consigli per far in modo che si veda bene da browsers? Aspetterò allora che finisca il tè mylady :D
Nelson
Stella nascente
Stella nascente
Avatar utente
Iscritto il: mer, 02 mag 2012 17:04
Messaggi: 701
Oggetto del messaggio: Re: Approccio al Web Design

Messaggio Inviato: dom, 10 ago 2014 19:42

ilario_seb ha scritto:Hola amici Imaccanici, son abbastanza sicuro che alla fine questo messaggio sarà principalmente rivolto a faxus e gattinara, che da quel che ho letto in giro sono i due guru dell argomento, ma son sicuro che questo post potrà tornare utile a molti.
Volevo iniziare ad approcciarmi al Web Design, così da espandere i miei limiti e poi si sa, a chi non piace impararsi milioni di righe di codice?!
Premetto che attualmente non so nulla sull'argomento, ho dreamweaver installato ma non so se poi è il software più adatto ad accompagnarmi. Non so se mi sarà effettivamente utile, ma anche non conoscendo il codice HTML e CSS, credo di saper le basi del funzionamento che sta dietro i codici, l'anno scorso all'accademia che frequento ci fecero usare Processing, software permette di progettare, anche animazioni più o meno complicate, tramite codice; ma magari no e quindi dovrei iniziare proprio da 0! Mi rivolgo a voi che so che sicuramente mi consiglierete quello che reputate sia il modo migliore/giusto per iniziare a scrivere qualche riga. Thank you eventuali errori son dovuti alla scrittura da telefono mentre son ancora steso nel letto , capitemi :P
Non c'è bisogno di fare corsi o studi, si impara e basta.
Guarda me, mi sono fatto da solo un sito bellissimo, i forum esistono per aiutare, google per cercare…che vuoi di più?

L'unico consiglio da tenere sempre a mente, crea i file in HTML5, UTF-8 e in PHP
Ultima modifica di Nelson il dom, 10 ago 2014 19:45, modificato 3 volte in totale.
faxus
Pro-Expert 
Pro-Expert 
Avatar utente
Iscritto il: lun, 02 giu 2014 15:12
Messaggi: 26207
Località: Due Sicilie
Contatta:

Top

Oggetto del messaggio: Re: Approccio al Web Design

Messaggio Inviato: dom, 10 ago 2014 19:43

La foto in background la devi caricare tu, infatti.

Va innanzitutto ridotta, molto difficilmente troverai qualcuno che imposta una finestra del browser oltre i 1800 px.
Ed è quello il formato che uso normalmente, salvo eccezioni motivate, per un'immagine di fondo.
Caricata su Gimp, ridotta a 1800px di base, qualità al 65%, praticamente indistinguibile la perdita di qualità.

Risultato, 98kb, direi che può andare, scaricala da qui.

Per le scritte in fondo pagina, se si tratta del copyright è una riga di codice su cui inserire nome del sito, anno e tipo di diritti.
Se ti riferisci ad altro, con link interni, per esempio note legali, privacy policy, ecc, devi creare un menù.
O anche tutte e due, in un'area distinta da quelle finora considerate che sarà <footer>

Per Il CMS, è più che sufficiente leggere quel che ne dice Wikipedia.
Poi per sapere quale è più conveniente diventa più vasto come argomento.

Io uso Joomla! (con il punto esclamativo parte del nome, anche se ho usato e uso altre cose, Drupal e Wordpress.
Attualmente è il più diffuso al mondo e vanta la comunità più numerosa con supporti infiniti, open source.
Ha qualche lato debole (nessuno è perfetto, questo ha meno difetti di tanti altri), ma i pregi sono tantissimi.

Ne possiamo parlare, ma conoscere il codice te la potrà far usare in modo di gran lunga migliore
faxus
Pro-Expert 
Pro-Expert 
Avatar utente
Iscritto il: lun, 02 giu 2014 15:12
Messaggi: 26207
Località: Due Sicilie
Contatta:

Top

Oggetto del messaggio: Re: Approccio al Web Design

Messaggio Inviato: dom, 10 ago 2014 19:49

Nelson ha scritto:... Guarda me, mi sono fatto da solo un sito...
Ecco, Ilario_seb, segui il consiglio di Nalson.

Guarda il sito, se riesci a trovarlo...

Poi cerca una soluzione diversa per tutto quello che vedi.
È un esempio eccellente per tutte le cose che NON si devono fare nella costruzione di un sito web
Gattinara
Web&Designer Expert
Web&Designer Expert
Avatar utente
Iscritto il: gio, 11 ago 2011 15:16
Messaggi: 761
Località: Roma
Contatta:

Top

Oggetto del messaggio: Re: Approccio al Web Design

Messaggio Inviato: dom, 10 ago 2014 20:37

ilario_seb ha scritto:Come posso inserire le notine a piè di pagina che son sempre presenti nei siti?
Da questo quesito deduco che non hai neanche dato una occhiata alla prima pagina della guida precedentemente segnalatati; ti suggerisco dare perlomeno una scorsa alla sezione Definire la struttura di un sito.
Se l'avessi fatto sapresti che "le notine a piè di pagina" sono di solito integrate in un elemento titolato footer (come già esposto da Faxus).
Una volta decisa la stuttura portante (header/nav/footer, eventuali aside) potremo organizzarne i contenuti testuali traverso intestazioni, section, article, et cetera (elementi che scopriremo passo passo, gradualmente).

Un esempio su tutti per comprendere l'importanza di una attenta orchestrazione:
il codice da te postato non concerne la index (pagina di apertura) ma la sezione "search".
Una voce di questo tipo acquista senso/utilità in siti dinamici, magari discretamente corposi (e provvisti di database, ché senza risulterebbe difficile cercare/trovare qualcosa);
nel tuo caso stiamo iniziando a costruire un minisito (statico) provvisto di tre voci:

"home" (ovvero l'index) - che immagino essere una pagina di presentazione generale;
"about me" - contenente informazioni specifiche;
"contact" - integrante recapiti/form/mappa;

Capisco che, quando si è agli inizi, il disutile (specie se archivoltato da grazioserie grafiche) generi una certa fascinazione, ma credi abbia senso creare un'apposita voce menu dedicata alla ricerca di contenuti in un minisito (statico) integrante tre sole pagine?

Non sono produttive repliche quali: strada facendo potremmo aggiungere al menu le voci "blog", "lavori", "equitazione", "apicultura", creare un database, et cetera.
Per simili scopi conviene adottare mezzi altri: al momento ci stiamo occupando di comprendere elementare codice di base.
Non avere prescia: la fretta genera (spesso) nervi lesi e (sempre) risultati mediocri.

In soldoni: accatta un foglio di carta e disegna la struttura che desideri per ogni singola sezione, e reitero: non improvvisare.
Non appena avrai orchestrato il tutto posta i disegnetti, e li svilupperemo insieme.

Appuntini aggiuntivi per chiudere il capitolo sulle impostazioni base di DW:
scarica (nel caso non li detenessi già) i principali browser per Mac (dei testing su IE, virtualizzatori, emulatori, et cetera tratteremo molto più avanti):

Chrome
Firefox
Opera

Imposta le preferenze di DW:

menu Dreamweaver > Preferenze (⌘U)

Organizza i browser per le anteprime (aggiungendoli tramite il pulsantello "+") - puoi predefinire, volendo, principale e secondario in maniera da richiamarli agevolmente traverso scorciatoie di tastiera);

Immagine

orchestra documento/estensione/codifica di default.

Immagine

Edit: sono talvolta tentata di aggiungere emoticon per sdrammatizzare toni che potrebbero risultare perentori o stizzosi (per nulla voluti o sottesi, tengo a specificarlo).
Sono una creatura molto paziente (tranne che con Nelson), e quando ti esorto a studiare in corso d'opera non lo faccio per frantumarti gli zebedei con aria da maestrina, assicurolo :)
"Chiunque è degno di un ombrello"
Nikolàj Vsévolodovic Stavrogin

"Chiunque a quarant'anni non conosce emorroidi"
Armand Vedel
ilario_seb
Maccanico attivo
Maccanico attivo
Avatar utente
Iscritto il: dom, 19 ago 2012 23:27
Messaggi: 276
Oggetto del messaggio: Re: Approccio al Web Design

Messaggio Inviato: dom, 10 ago 2014 20:59

Grazie a tutti, procedo con ordine:
Nelson ha scritto:Non c'è bisogno di fare corsi o studi, si impara e basta.
Guarda me, mi sono fatto da solo un sito bellissimo, i forum esistono per aiutare, google per cercare…che vuoi di più?
Sarò lieto di buttare un occhio sul tuo sito se me lo linki o mi dai indizi sul trovarlo. Ma son dell'opinione che il bellissimo sia relativo, il funzionale assoluto.
Anche se anche io credo molto nel potere di Google, dubito che per argomenti simili e così complicati ci si possa totalmente affidare a lui.
...
Va innanzitutto ridotta, molto difficilmente troverai qualcuno che imposta una finestra del browser oltre i 1800 px.
Ed è quello il formato che uso normalmente, salvo eccezioni motivate, per un'immagine di fondo.
Caricata su Gimp, ridotta a 1800px di base, qualità al 65%, praticamente indistinguibile la perdita di qualità.

...

Io uso Joomla! (con il punto esclamativo parte del nome, anche se ho usato e uso altre cose, Drupal e Wordpress.
Attualmente è il più diffuso al mondo e vanta la comunità più numerosa con supporti infiniti, open source.
Ha qualche lato debole (nessuno è perfetto, questo ha meno difetti di tanti altri), ma i pregi sono tantissimi.

Ne possiamo parlare, ma conoscere il codice te la potrà far usare in modo di gran lunga migliore
Bene, prima regola memorizzata, base 1800px, puoi star sicuro che da oggi non userò più immagini di dimensioni infinite :D
Avevo già sentito parlare di Drupal, Joomla e Wordpress, tanto che mi avevano consigliato di scaricare un programma che ti crea un server offline per poter smanettare con i template, preferisco però per il momento dare un occhio in più sul codice, per lo smanettamento c'è tempo 8)
Guarda il sito, se riesci a trovarlo...

Poi cerca una soluzione diversa per tutto quello che vedi.
È un esempio eccellente per tutte le cose che NON si devono fare nella costruzione di un sito web
Con questa mi hai fatto sbracare dalle risate
Da questo quesito deduco che non hai neanche dato una occhiata alla prima pagina della guida precedentemente segnalatati; ti suggerisco dare perlomeno una scorsa alla sezione Definire la struttura di un sito.
Si hai ragionissima, purtroppo mi hai inquadrato, son frettoloso come la morte, anche se per fortuna non son uno che si accontenta sui risultati, ma sto lavorando anche sulla prescia, prima o poi diventerò saggio, spero :P
Un esempio su tutti per comprendere l'importanza di una attenta orchestrazione:
il codice da te postato non concerne la index (pagina di apertura) ma la sezione "search".
Una voce di questo tipo acquista senso/utilità in siti dinamici, magari discretamente corposi (e provvisti di database, ché senza risulterebbe difficile cercare/trovare qualcosa);
nel tuo caso stiamo iniziando a costruire un minisito (statico) provvisto di tre voci:
Hai ragione 2.0, mi son fatto prendere dalla smania di potere, tutte quelle cose che posso inserire e che al momento posso sembrare "fighe", ero arrivato alla tua stessa conclusione e avevo già provveduto a rimuovere quella parte di codice, ma prometto che prima di toccare di nuovo il codice mi leggerò almeno 2 volte le guide da te postate :oops:
In soldoni: accatta un foglio di carta e disegna la struttura che desideri per ogni singola sezione, e reitero: non improvvisare.
Non appena avrai orchestrato il tutto posta i disegnetti, e li svilupperemo insieme.

Appuntini aggiuntivi per chiudere il capitolo sulle impostazioni base di DW:
scarica (nel caso non li detenessi già) i principali browser per Mac (dei testing su IE, virtualizzatori, emulatori, et cetera tratteremo molto più avanti):

Chrome
Firefox
Opera
Sarà fatto, ambedue :D
Imposta le preferenze di DW:
Sarà fatto 2.0!

Bhè ragazzi che dire, vi ringrazio davvero di cuore, sembra che abbiate la questione a cuore quanto me, l'apprezzo molto, vi aggiornerò quando sarò pronto con quanto definito oggi. Thank you! :D
Rispondi